React Native 设置字体大小以填充父级

Question

有没有办法设置一个文本的字体大小来占据所有不负责任的space？

例如我有一个包含多个元素的屏幕，我希望在橙色元素中有一个文本，并告诉文本占据所有可用的 space（橙色）。

Answer 1

可以设置font-size: 100%

BUT! 这个 100% 基于父元素 font-size，而不是当前元素 size.

所以如果你想让你的字体充满当前元素，你可以做一个方法：

<div style={{fontSize: `800px`}}>
  <div style={{height: `800px`, fontSize: `100%`}}>
    Some Text
  </div>
</div>

并且您可以根据您的需求以编程方式进行更多设置。

参考：相关问答：CSS: 100% font size - 100% of what?

Answer 2

我不知道这是否是最佳答案，但我认为您可以使用 React Native Dimensions API.

查看我在 snack.expo.io 中创建的示例：

希望对您有所帮助:)

React Native set font size to fill parent