调整字体大小以适应本机中的视图 - android

Question

我怎样才能使文本的字体大小在本机中的视图内自动更改？

我有不同长度的文本,其中一些不适合视图,因此减小了字体大小.我检查了文档,发现这个
https://facebook.github.io/react-native/docs/text.html#adjustsfontsizetofit
但它只适用于IOS,我需要它用于android.它是否适用于按钮和触摸功能等其他组件？

Answer 1

结合这两个属性，适用于 Android 和 iOS：

adjustsFontSizeToFit={true}
numberOfLines={1}

adjustmentFontSizeToFit 确保字体不超过容器，numberOfLines 确保文本保持在一行中。

如果包含视图具有固定的高度或宽度，则不带 adjustmentFontSizeToFit 的 numberOfLines 会生成省略号，不带 numberOfLines 的 adjustmentFontSizeToFit 会减小文本大小的高度以适合包含视图。

Answer 2

稍微改进的 Jeffy Lee 代码对我有用

const AdjustLabel = ({
  fontSize, text, style, numberOfLines
}) => {
  const [currentFont, setCurrentFont] = useState(fontSize);

  return (
    <Text
      numberOfLines={ numberOfLines }
      adjustsFontSizeToFit
      style={ [style, { fontSize: currentFont }] }
      onTextLayout={ (e) => {
        const { lines } = e.nativeEvent;
        if (lines.length > numberOfLines) {
          setCurrentFont(currentFont - 1);
        }
      } }
    >
      { text }
    </Text>
  );
};

Answer 3

试试这种方法.考虑根据屏幕宽度设置字体大小,如下所示

width: Dimensions.get('window').width

因此,在您的风格中尝试进行百分比计算以使字体大小适合屏幕

style={
  text:{
     fontSize:0.05*width
  }
}

这将适用于所有屏幕(Android和IOS)