小编Alt*_*ora的帖子

Flutter:是否可以在高度 > 1.0 的文本行中设置垂直对齐?

Figma中的所有文本都有一定的高度,例如1.5,但是当我将该高度设置为TextStyle时,具有新高度的所有行都会与底部对齐。

看图片

如果使用居中对齐小部件 - 结果错误。示例的行中具有底部垂直对齐方式。就像底部的屏幕截图一样。

[文字截图2

是否可以在 flutter Text wiget 中为每一行设置垂直对齐?或者也许有人有一些有用的提示来解决问题?

    Text(
      'Example\nExample',
      textAlign: TextAlign.center,
      style:TextStyle(
        height: 2.5,
        fontSize: 20,
      ),
    );
Run Code Online (Sandbox Code Playgroud)

解决方案:

正如user1032613所建议的,这样的解决方案很有帮助。

结果文字图片

    final text = 'Example Example\nExample Example';
    const double height = 2.5;
    const double textSize = 16.0;
    const double bottomPadding = (height * textSize - textSize) / 2;
    const double baseline = height * textSize - height * textSize / 4;
    final Widget textWidget = …
Run Code Online (Sandbox Code Playgroud)

material-design flutter flutter-layout figma

9
推荐指数
1
解决办法
4194
查看次数

标签 统计

figma ×1

flutter ×1

flutter-layout ×1

material-design ×1