React-native-vector-icons: Unrecognized font family when bringing app back from background iOS.

Created on 7 Dec 2019 · 6Comments · Source: oblador/react-native-vector-icons

Environment

iOS
react-native: 0.61.1
react-native-vector-icons: 6.6.0

Description

I install the library following the documentation.

yarn install react-native-vector-icons
cd ios/
pod install

// rebuild

On launch, the icons work fine but upon minimizing the application and bringing it back, I get the following error.

Simulator Screen Shot - iPhone X - 2019-12-06 at 21 32 30

After dismissing it the icons now display as [?].

Source

thefinnomenon

👍5

Most helpful comment

Add to info.plist:

    <key>UIAppFonts</key>
    <array>
      <string>AntDesign.ttf</string>
      <string>Entypo.ttf</string>
      <string>EvilIcons.ttf</string>
      <string>Feather.ttf</string>
      <string>FontAwesome.ttf</string>
      <string>FontAwesome5_Brands.ttf</string>
      <string>FontAwesome5_Regular.ttf</string>
      <string>FontAwesome5_Solid.ttf</string>
      <string>Foundation.ttf</string>
      <string>Ionicons.ttf</string>
      <string>MaterialIcons.ttf</string>
      <string>MaterialCommunityIcons.ttf</string>
      <string>SimpleLineIcons.ttf</string>
      <string>Octicons.ttf</string>
      <string>Zocial.ttf</string>
    </array>

Patys on 12 Dec 2019

🎉5 👍1

All 6 comments

Add to info.plist:

    <key>UIAppFonts</key>
    <array>
      <string>AntDesign.ttf</string>
      <string>Entypo.ttf</string>
      <string>EvilIcons.ttf</string>
      <string>Feather.ttf</string>
      <string>FontAwesome.ttf</string>
      <string>FontAwesome5_Brands.ttf</string>
      <string>FontAwesome5_Regular.ttf</string>
      <string>FontAwesome5_Solid.ttf</string>
      <string>Foundation.ttf</string>
      <string>Ionicons.ttf</string>
      <string>MaterialIcons.ttf</string>
      <string>MaterialCommunityIcons.ttf</string>
      <string>SimpleLineIcons.ttf</string>
      <string>Octicons.ttf</string>
      <string>Zocial.ttf</string>
    </array>

Patys on 12 Dec 2019

🎉5 👍1

And for android:

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

in android/app/build.gradle

Patys on 12 Dec 2019

🎉2

@thefinnomenon Have you fixed the issue? i am facing same issue.

kalyanijamunkar10 on 24 Dec 2019

Nope, I haven't been able to fix it. I am not even sure where to start because the fonts are successfully loading at the start and for some reason are unloaded sometime between the app going to the background and the app resuming.

thefinnomenon on 27 Dec 2019

👍1

Same issue... Been trying to resolve this for a couple days now......

nica0012 on 10 Feb 2020

@kalyanijamunkar10 @thefinnomenon
on windows I have fixed upgrading gradle
android -> build.gradle
classpath("com.android.tools.build:gradle:3.6.1")
and android -> gradle -> wrapper
distributionUrl=https\://services.gradle.org/distributions/gradle-5.6.4-all.zip

npx react-native info

info Fetching system and libraries information...
System:
    OS: Windows 10 10.0.18362
    CPU: (6) x64 Intel(R) Core(TM) i5-8500 CPU @ 3.00GHz
    Memory: 3.95 GB / 15.86 GB
  Binaries:
    Node: 12.2.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.16.0 - C:\Users\Julian\AppData\Roaming\npm\yarn.CMD
    npm: 6.9.0 - C:\Program Files\nodejs\npm.CMD
  SDKs:
    Android SDK:
      API Levels: 23, 24, 25, 26, 27, 28, 29
      Build Tools: 23.0.1, 25.0.0, 25.0.1, 25.0.3, 26.0.1, 26.0.2, 26.0.3, 27.0.3, 28.0.3, 29.0.2
      System Images: android-18 | Google APIs Intel x86 Atom, android-19 | Google APIs Intel x86 Atom, android-24 | Google APIs Intel x86 Atom, android-26 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom, android-R | Google Play Intel x86 Atom
  IDEs:
    Android Studio: Version  3.6.0.0 AI-192.7142.36.36.6200805
  npmPackages:
    react: 16.9.0 => 16.9.0
    react-native: 0.61.5 => 0.61.5