Question

我正在尝试在我的本机应用程序中使用字体“Verveine Corp Regular”。

该字体适用于iOS版本，但不适用于Android版本。

字体是.tff格式，放在我的工作的根目录中（在package.json中链接，我运行react-native链接）和里面的“android / gradle / src / main / assets / fonts”但它仍然没有选择字体。我也多次清理并重建了应用程序。

当检查在android调试器中使用该字体的元素时，它说它正在使用该字体。但字体仍然是默认字体。

有人可以就此问题提供一些帮助或指导吗？

谢谢！

Answer 1

这就是我在项目中使用自定义字体的方式

//sampleStyle.js
import overrideStyles from '/sampleoverridestyles';
iconTextStyle: {
  color: '#FFFFFF',
  fontSize: 16
}

//sampleoverridestyles.ios.js
export default {
  iconTextStyle: {
    fontFamily: 'FaktSoftPro-Medium'
  }
}

//sampleoverridestyles.android.js
export default {
  iconTextStyle: {
    fontFamily: 'faktsoftpro_medium'
  }
}

因为我无法为iOS和android设置相同的字体名称，所以我已经覆盖了它，并且它有效。

Answer 2

其他答案帮助我帮助了我，谢谢。仅当字体文件名中包含大写字母时，才可能需要此操作。更完整的答案：

在react native中正常添加字体，例如：

{react-native-project} /fonts/GovtAgentBB.ttf

运行react-native链接，这会将字体放入

{react-native-project} /android/app/src/main/assets/fonts/GovtAgentBB.ttf

{react-native-project} /android/app/src/main/assets/fonts/GovtAgentBB_ital.ttf

但是android，不是机器人而是机器人，而是机器人。因此，请在变体之前使用所有小写字母和下划线来重命名文件，例如：

{react-native-project} /android/app/src/main/assets/fonts/govtagentbb.ttf

{react-native-project} /android/app/src/main/assets/fonts/govtagentbb_ital.ttf

然后，您必须根据平台更改样式的字体名称。对于iOS，请使用人名，该人名是将在Mac字体菜单的窗口标题中显示的字体名称（或仅是您在网络上看到的名称）。对于android，您必须自动使用刚刚重命名的文件的名称。

      {Platform.OS === 'ios' ? (
        <Text style={styles.welcome}>
          Hello World!
        </Text>
      ) : (
        <Text style={styles.welcomeAndroid}>
          Hello World
        </Text>
      )}
      const styles = StyleSheet.create({
      ...
      welcome: {
          fontFamily: 'Government Agent BB',
      },
      welcomeAndroid: {
          fontFamily: 'govtagentbb',
      },

Answer 3

First, make sure you are up to version 0.16+ with react-native.
Your fonts should be *.ttf or *.otf files and must be located in: /projectname/android/app/src/main/assets/fonts
Make sure the fonts are lowercase only and follow this pattern: fontname.ttf, fontname_bold.ttf, fontname_light.ttf, fontname_bold_italic.ttf

Answer 4

您是否在AppTheme（styles.xml）中定义了另一种字体，该字体会覆盖您的首选字体？

您是否使用“Hello World”-App作为最小测试来测试您的字体？

您是否实现了此处所示的ttf？例如：How to use custom font in Android Studio

Answer 5

我从这里在react-native android中添加了字体：

https://medium.com/@gattermeier/custom-fonts-in-react-native-for-android-b8a331a7d2a7#.40vw3ooar

按照所有步骤正常工作。

添加运行react-native run-android

后

Android react-native app没有提取字体

5 个答案: