将自定义字体添加到我的 react-native 应用程序时，iOS 上的 Thin & Light fontWeight之间没有区别

Question

我刚刚在我的React-Native应用程序（https://fonts.google.com/specimen/josefin sans）中添加了自定义字体。

JosefinSans-Bold.ttf
JosefinSans-BoldItalic.ttf
JosefinSans-Italic.ttf
JosefinSans-Light.ttf
JosefinSans-LightItalic.ttf
JosefinSans-Regular.ttf
JosefinSans-SemiBold.ttf
JosefinSans-SemiBoldItalic.ttf
JosefinSans-Thin.ttf
JosefinSans-ThinItalic.ttf

我在添加

后通过运行react-native link链接字体文件

"rnpm": {
  "assets": [
    "path/to/my/font/files"
  ]
},

到我的package.json

然后，我在应用中使用字体这样：

customFont: {
    fontFamily: 'Josefin Sans',
},
thin: {
    fontWeight: '100'
},
light: {
    fontWeight: '300'
},
semiBold: {
    fontWeight: '600'
},
bold: {
    fontWeight: '700'
},
italic: {
    fontStyle: 'italic'
},

iOS模拟器屏幕截图不同的输血和fontstyle

问题是thin(fontWeight: '100')＆amp;light(fontWeight: '300')。

到目前为止我尝试过的是：

• 使用Google字体的另一种字体（同样的问题）尝试。
• 试图在实际设备（而不是模拟器）上运行该应用程序，但徒劳无功。
• 试图将iOS默认字体与这些font量级使用：thin和light确实可识别
• 在Xcode中显示字体实际名称（JosefinSans-Light和JosefinSans-Thin），

_

for (NSString* family in [UIFont familyNames])
{
  NSLog(@"%@", family);
  for (NSString* name in [UIFont fontNamesForFamilyName: family])
  { NSLog(@"  %@", name); }
}

有人遇到同样的问题吗？关于如何修复它并显示实际的薄字体重量的任何想法？

非常感谢

Answer 1

我相信，在涉及自定义字体时，您必须为每种重量使用不同的fontFamily样式。

因此，在这种情况下，您想要这样的样式（名称可能有些关闭，但您明白了）：

customFont: {
    fontFamily: 'Josefin Sans'
},
thin: {
    fontFamily: 'Josefin Sans-Thin'
},
light: {
    fontFamily: 'Josefin Sans-Light'
},
semiBold: {
    fontFamily: 'Josefin Sans-SemiBold'
},
bold: {
    fontFamily: 'Josefin Sans-Bold'
},
italic: {
    fontFamily: 'Josefin Sans-Italic'
}
...

当然，请随时在您认为合适的情况下添加其他样式。另外，您可能需要鉴于此，将customFont更改为regular。