如何使Flutter中的字符具有相同的宽度？

Question

如下图所示，文本具有相同数量的字符，但是由于数字“ 1”比“ 5”和“ 2”更细，因此两个文本的宽度不同。

如何在Flutter中进行调整？

Answer 1

您可以将字体功能设置为使用tabularFigures。

// import 'dart:ui';

Text(
  _getTimeString(),
  style: TextStyle(
    fontFeatures: [
      FontFeature.tabularFigures()
    ],
  ),
),

之前：

之后：

另请参阅：

• Font Features in Flutter

Answer 2

使用等宽字体，也称为固定间距，固定宽度或非比例字体，该字体的字母和字符各自占据相同的水平空间。

维基百科对此进行了很好的解释。 https://en.wikipedia.org/wiki/Monospaced_font

Answer 3

Hiepav建议似乎是个好方法，因为您没做错什么，但是字体中的每个字符都有不同的宽度，因此必须进行调整以提供足够的空间。

但是，作为一种变通办法，您实际上可以将文本包装在固定宽度的框中，以便为两个小部件提供足够的空间以显示其字符宽度的变化，例如SizedBox，ConstrainedBox甚至是{{ 1}}，并具有宽度限制和居中对齐子级。这样，使用该字体，您至少应该使Container垂直对齐。