Flutter Text小部件中的StrutStyle是什么

Question

什么是StrutStyle在颤振Text部件？我读过这个文件，但我无法理解的意义，特别是height，leading和fontSize参数。

我的答案如下。

Answer 1

您可以将StrutStyle视为Text小部件中文本的最小行高。该文档是一个很好的起点。

这是有助于形象化的图像：

左侧的彩色矩形是支撑杆（尽管实际上支撑杆没有宽度）。该矩形的高度是最小线条高度。该行不能短于该行。但是它可以更高。

• 上升是从基线到文本顶部的距离（由字体定义，而不是任何特定的字形）
• 体面的是从基线到文本底部的距离（由字体定义，而不是任何特定的字形）
• 铅字（发音为“铅皮”，如老式排字机用来在字体行之间使用的铅金属）是一行的底部与下一行的顶部之间的距离。在支柱中，一半的领先者放在顶部，另一半则放在底部。这是插图中的灰色区域。

您可以使用乘数来更改支撑的垂直大小。

在StrutStyle类中，height参数是上升和下降的乘数。在图示中，高度大约为1.7，使绿色上升和粉红色下降成比例地大于原始图像。前导高度倍增器可以单独控制。您可以使用leading参数进行设置。不过，我使用了与上升和下降相同的乘数。基线保持不变。

const Text(
  'My text',            // use 'My text \nMy text' to see multiple lines
  style: TextStyle(
    fontSize: 10,
    fontFamily: 'Roboto',
  ),
  strutStyle: StrutStyle(
    fontFamily: 'Roboto',
    fontSize: 14,
    height: 1.7,
    leading: 1.7,
  ),
),

其他设置（例如fontFamily，fontSize仅定义要使用高度倍数的字体指标）。另请注意，TextStyle不必与相同StrutStyle。

strut的想法来自CSS，而CSS则来自TeX。

也可以看看

• 使用StrutStyle控制文字高度