如何居中对齐文本小部件，然后在文本中添加前导图标？

Question

在“行”窗口小部件中，我添加了一个文本窗口小部件，并且可以使用mainAxisAlignment.center来使文本居中对齐，但是当我在文本之前添加图标时，该文本现在显然未居中对齐，因为两者图标和文本居中对齐。

在屏幕截图下方找到以便更好地理解。

我的设计师建议将“早晨” 文本与屏幕居中对齐，并且在该文本之前添加图标，我该如何实现？ / p>

Answer 1

您可以使用透明的颜色技巧：

      Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Icon(Icons.wb_sunny, color: Colors.yellow),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 8.0),
            child: Text('Morning'),
          ),
          Icon(Icons.wb_sunny, color: Colors.transparent),
        ],
      )

只需要右图标即可保持平衡，并具有透明的颜色。

Answer 2

您尝试过使用wrap widget吗？

因为列视图是水平中心。然后它将调整您的视图为中心，还可以在图像和文本之间添加空格。