'FontFamily not working in Android Device in React-Native

I have added many font-family and style into my asset folder in React-Native project. It's working fine in simulator, emulator, and iOS device. But some font won't work and not display in Android device.

I have try with react-native link and check the asset folder in Android app directory, nothing missing.

Anyone help please.



Solution 1:[1]

I might have a solution for this. I had the same problem, the fonts were visible in my emulator, the font files are located under 'android/src/main/assets/fonts' and yet it wasn't visible on my physical android device (Huawei Honor 8X).

I found out that the problem was with my physical device's Font settings. To fix this, on your phone, go to

Settings -> Display -> Text Style -> Default

Settings screen : Go to Display Settings screen : Go to Display

Display settings : Look for Text Style, Make sure it is set to default as seen in the pic Display settings : Look for Text Style, Make sure it is set to default as seen in the pic

Select Default here : Now your custom app fonts should work Select Default here : Now your custom app fonts should work

Please Note that these settings might differ as per your device. I've mentioned the steps for my phone.

Always use the default Text Style to render custom fonts in your app. Nowadays, phones like the OnePlus etc. have their own custom fonts and I think this is interfering with custom fonts defined in Applications.

Hope this helps.

Solution 2:[2]

Following this article worked for me. The name of the font file name is important to get it working on both platforms.

I had multiple font files with different weights (Circular Std Bold, Circular Std Medium etc..) for these to work on android I dynamically changed the font family style to this name to change the weight.

The font weight style on android didn't work for me.

Solution 3:[3]

the problem is with devices that have custom font style like huawei devices. I hope there be a solution for this to not force the user to change it's device font style because of our app.

Solution 4:[4]

My font family changes when I connect to my android device but I finally figured out how to fix it. If font weight is set then it changes the font on my device to its default font. After I removed font weight my android devices default font isn't applied anymore.

Solution 5:[5]

fontFamily its not work in inlinstyle you must change from

<Text style={{fontFamily:'SantPro'}} />

to Text style={styles.text}

const styles = StyleSheet.create({
   text: {
        fontFamily:'SantPro',

    },
})

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Matthijs
Solution 2 Matt Cubitt
Solution 3 TheEhsanSarshar
Solution 4 Lyle Rogers
Solution 5