Unrecognized font family on iOS simulator with React Native

Question

I\'ve added Linux Biolinum fonts (http://www.dafont.com/linux-biolinum.font, LinBiolinum_R.ttf, LinBiolinum_RB.ttf) to my React Native project. Android version is OK. But on

Answer 1

On Android it takes the name of the file and you are done. On iOS however it is a bit more complex.

There are a few steps you should take:

• Double check the font files are included in the Target in XCode
• Make sure they are included in the step "Copy Bundle Resources" (add files, not folders)
• Include them in the Info.plist of the app
• Find the name of the Font through FontBook or with some log statements in your AppDelegate

Explained in more detail here: http://codewithchris.com/common-mistakes-with-adding-custom-fonts-to-your-ios-app/

Good luck!

Answer 2

I had the same problem. I checked if I've added the fonts correctly to the xcode project. Then I checked the info.plist.

Turned out I spelled the name wrong. Instead of FontAwesome5_Solid.ttf, I had written FontAwesoem5_Solid.ttf. So I fixed it. That solved the problem for me.

To sum up - be very careful when typing the names and when checking them.

Answer 3

Easy solution. Stop worrying

Add it in to your project, Then add it your Bundle resources

Answer 4

For me, changing the name of the file to the name of the Font (displayed as I open the file) did it.

Answer 5

Add this to your package.json

"rnpm":{
    "assets":[
        "./assests/fonts/"
    ]
}

and then run react-native link in command line

Answer 6

For IOS,

• Make sure you add fonts to resource Copy Bundle Resources

• Make sure you have folder Resources in Xcode, somehow it was deleted and you must create, import fonts to that folder manually

• Make sure using name of Family in Font book