我想忽略系统操作字体(iOS和Android),并使用我在react-native项目中使用的各种字体。我只想做一次,但是我不知道怎么做。你能帮我吗?
答案 0 :(得分:2)
将字体添加到资产
将所需的所有字体文件添加到react native项目根目录中的“ assets / fonts”文件夹中
Package.json
接下来,我们需要告诉React Native我们的自定义字体在哪里。为此,我们将rnpm添加到package.json中,以提供字体文件的路径:
"rnpm": {
"assets": [
"./assets/fonts/"
]
},
然后,我们告诉react native为我们链接这些字体文件:
react-native link
在IOS上
这应该在iOS的Info.plist文件中添加字体引用,而在Android上,将字体文件复制到android / app / src / main / assets / fonts。您可以通过从iOS文件夹打开Info.plist并查找UIAppFonts密钥来验证这一点,您应该会看到类似以下内容的
<key>UIAppFonts</key>
<array>
<string>YOUR_FONT_FILE.ttf</string>
</array>
在Android上
如果您在文件路径“ android / app / src / main / assets / fonts /”中查找,应该会看到您的字体已被复制:
反应本机样式
嵌入并引用了字体后,可以很简单地将其添加到React Native样式中。只需使用您的字体名称添加fontFamily属性:
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: "center",
alignItems: "center",
backgroundColor: "#F5FCFF"
},
foo: {
fontFamily: "YOUR_FONT_FAMILY_NAME",
fontSize: 30,
textAlign: "center",
margin: 10
},
bar: {
fontFamily: "YOUR_FONT_FAMILY_NAME",
fontSize: 20,
textAlign: "center",
color: "#333333",
marginBottom: 5
}
});
来源: