vasavi
vasavi

Reputation: 1575

How can i use the same custom fonts for android as for ios using react native

I am working with the same code for both ios and android using react native. Now in my project I want to use custom fonts for both. I know how to apply custom fonts for ios but those same fonts how to apply for android also?

//New sample

I added the custom font under sample/android/app/src/main/assets/fonts/gillsans-italic.ttf I applied this gillsans-italic.ttf font in CustomFontTest component like below

var CustomFontTest = React.createClass({
      render:function(){
         return (<View><Text style={styles.customFont}>CustomFont</Text></View>)
      }
})
var styles = StyleSheet.create({
    customFont:{
        fontFamily:'gillsans-italic',
        fontSize:14,
        color:'#efefef'
    }
})

Upvotes: 2

Views: 3019

Answers (1)

John Shammas
John Shammas

Reputation: 2715

Put your fonts under android/app/src/main/assets/fonts.

They must be named according to the font family name. Here is what is supported:

{{fontName}}.otf
{{fontName}}_bold.otf
{{fontName}}_bold_italic.otf

You can replace .otf with .ttf. The {{fontName}} is the name you pass through to the style property of a component.

Upvotes: 3

Related Questions