了解如何在本机反应中加载“字体系列”答案

【问题标题】：Understanding how to load a "font-family" in react native了解如何在本机反应中加载“字体系列”
【发布时间】：2017-04-10 23:04:36
【问题描述】：

我正在尝试在 React Native 中了解字体与字体系列。我在shoutem/ui 库和exponentjs 框架之间发现了一个错误，其中shoutem/ui 将TextInput 的样式设置为Rubik。然而，exponentjs 项目单独加载每个 Rubik 字体，并且需要对特定 Rubik 字体或粗细的引用，例如Rubik-Regular.

https://github.com/shoutem/ui/blob/develop/theme.js

https://github.com/exponent/shoutem-example

我不明白的是：在默认的 react-native 字体实现中的某个地方是否有默认魔法发生，它理解所有这些 Rubik 字体都是字体系列的一部分，并将整个字体设置为 Rubik 并显示粗体，斜体等...当文本样式设置为粗体时需要？这是否意味着 Exponent 没有实现将所有这些字体聚合到一个命名的字体系列组中的字体聚合功能？

或者……

shoutem 库是否因引用应用中不存在的字体而出错？

指数应用如何加载shoutem库使用的所有字体：

 {'Rubik-Black': require('./node_modules/@shoutem/ui/fonts/Rubik-Black.ttf')},
  {'Rubik-BlackItalic': require('./node_modules/@shoutem/ui/fonts/Rubik-BlackItalic.ttf')},
  {'Rubik-Bold': require('./node_modules/@shoutem/ui/fonts/Rubik-Bold.ttf')},
  {'Rubik-BoldItalic': require('./node_modules/@shoutem/ui/fonts/Rubik-BoldItalic.ttf')},
  {'Rubik-Italic': require('./node_modules/@shoutem/ui/fonts/Rubik-Italic.ttf')},
  {'Rubik-Light': require('./node_modules/@shoutem/ui/fonts/Rubik-Light.ttf')},
  {'Rubik-LightItalic': require('./node_modules/@shoutem/ui/fonts/Rubik-LightItalic.ttf')},
  {'Rubik-Medium': require('./node_modules/@shoutem/ui/fonts/Rubik-Medium.ttf')},
  {'Rubik-MediumItalic': require('./node_modules/@shoutem/ui/fonts/Rubik-MediumItalic.ttf')},
  {'Rubik-Regular': require('./node_modules/@shoutem/ui/fonts/Rubik-Regular.ttf')},
  {'Rubik': require('./node_modules/@shoutem/ui/fonts/Rubik-Regular.ttf')},
  {'rubicon-icon-font': require('./node_modules/@shoutem/ui/fonts/rubicon-icon-font.ttf')},

  ...    using Exponent.Font.loadAsync(font)

【问题讨论】：

试试原生库比shoutem库好
你还有这个问题吗？

标签： fonts react-native shoutem

【解决方案1】：

您似乎在使用 Shoutem UI 时遇到了问题，因为您将它与 Expo 一起使用，它限制了您可以使用哪些本机功能。

这是一个示例，说明您需要做什么才能使其正常工作：https://github.com/shoutem/ui/tree/develop/examples/create-react-native-app

【讨论】：