react-native add new font gives 'Unrecognized font family' on IOS simulator

3
votes

I added new font - 'SourceSansPro'(got from GoogleFonts) to my React-Native project. But I got 'Unrecognized font family' error on IOS simulator. There are dozens of various suggestions about this problem like deleting build items or look whether fonts are defined in info.plist or execute 'react-native-link' and etc.However, none of them worked for my case. Also, some people mentioned that, although it does not work through CLI, it works when executed directly through Xcode. Whereas,it did not work for me. I'm stucked at this problem for almost 5 hours. Finally, I thought maybe someone may helps me, here.

Do you have any suggestion?

enter image description here

4
iosfontsreact-native

4 Answers

8
votes

Your font's name is probably not SourceSansPro

Depending on which one (or more than one) that you added to your project, the name is more likely SourceSansPro-Regular or SourceSansPro-Bold or SourceSansPro-Italic etc

I don't use React-Native, but you can list the Font Families and Font Names available to your app with this code:

for (NSString* family in [UIFont familyNames])
{
    NSLog(@"%@", family);

    for (NSString* name in [UIFont fontNamesForFamilyName: family])
    {
        NSLog(@"  %@", name);
    }
}
2
votes

You need to also make sure that the fonts are included as part of the bundle in the iOS project. First drag the font to the file navigator in Xcode under your project. Then select the font in the file navigator, open the Inspector and make sure it's ticked for your project under Target Membership. Hope this helps.

2
votes

enter image description here

Please add your custom font to your Plist file like the attached screenshot with key "Fonts provided by application" . And please make sure that the font is successfully loaded by change the font name to custom font from xib , you should see your custom font at the list of fonts at xib .

Thank you Nada Gamal

1
votes

The Swift version of the DonMag's answer:

for family: String in UIFont.familyNames{
    print("\(family)")
    for names: String in UIFont.fontNames(forFamilyName: family){
        print("== \(names)")
    }
}