Flutter：如何根据设备的屏幕大小调整文本大小

Question

在flutter中，如何根据设备屏幕大小调整应用程序中的文本大小？该应用程序用于阅读文本，我需要用户在设备尺寸增加时看到更大的文本，并设置可能的最大尺寸。我知道的一种方法是这样做；

Text(
  'Some text here',
  style: TextStyle(
    fontSize: 20 * MediaQuery.of(context).size.width * some_ratio
  ),
)

是否有其他不同的方法也将考虑显示高度？

Answer 1

对于基于屏幕的字体大小，我建议Height用作参考。

例如：

 double unitHeightValue = MediaQuery.of(context).size.height * 0.01;
 double multiplier = 25;
 return Text(
  'Some Text', 
  style: TextStyle(
    fontSize: multiplier * unitHeightValue,
  ),
 );

通过这种方法，您将获得像素完美的文本大小，并具有您选择的乘数值的额外优势。

这类似于 dpspAndroid 中or概念。

更新：

经过几次额外的体验后，我意识到选择 Height作为参考仅适用于移动设备，尤其是在纵向模式/方向。

简单来说，当设备的主滚动轴在设备的纵向模式下是垂直的。

因此，我建议根据您的应用程序的需要选择/更改引用。

即，如果您正在开发的应用程序绝对是仅具有纵向方向且不支持旋转的移动应用程序，则上述代码应该可以正常工作而不会出现任何问题。

但是，在移动应用程序中支持 flutter web 或仅支持旋转的情况下，当用户旋转设备时，上述方法可能无法给出预期的结果。

在这种情况下，由于 web 可被水平显示访问，因此参考屏幕宽度对于 flutter web 是有意义的。但是在旋转支持的情况下，您可以选择在所有方向上都使用宽度作为参考，或者根据方向更新参考。