具体:https://blog.bam.tech/developper-news/add-a-custom-font-to-your-react-native-app
或者:https://github.com/refinery29/react-native-cheat-sheet
我的步骤:
1。前往https://github.com/google/fonts下载自己需要的字体。
2.在和ios目录同级的目录下增加assets目录,进入assets,增加fonts目录,进入fonts目录,增加对应字体名称目录,然后将下载的字体全部拖到该目录下,eg:将EaterCaps-Regular.ttf拖进EaterCaps目录中
3.打开package.json,添加如下代码://最后一个不用逗号隔开。
"rnpm": {
"assets": ["assets/fonts/TittiliumWeb"]
}
4.控制台运行
react-native link5.打开ios工程,clear项目后,run项目。
ps:可以在Appdelegate.m文件中打印字体:NSLog (@"Font families: %@", [UIFont familyNames]);
使用:
const styles = StyleSheet.create({
customFont: {
fontFamily: 'Tittilium Web',
fontWeight: 'bold',
fontStyle: 'italic'
}
});
...
<Text style={styles.customFont}>My awesome font</Text>;
字体文件:MyriadPro-Bold.otf
使用:
fontFamily: 'MyriadPro-Bold',
otf后缀的也可以:
fontFamily: 'Myriad Pro',
fontWeight: 'bold',