在颤动中对齐 Row 小部件的子项内的文本

Posted 2023-02-23

【中文标题】在颤动中对齐 Row 小部件的子项内的文本

【英文标题】：Align text inside children of Row widget in flutter

【发布时间】：2021-09-10 03:55:00

【问题描述】：

我正在尝试使用Column 和Row 小部件动态生成图表的legends。我面临的问题是对齐下一行​​中的文本。

您可以看到，由于Average 和Sub-Pair 的文本较大，列中的下一项正在向右移动。不确定如何在特定行和列中对齐所有内容。

这里是代码

  Widget _buildLegends() 
    return Column(
      children: List.generate(
        sectionDataList.length,
        (index) 
          return Padding(
            padding: const EdgeInsets.all(8.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  indicatorDataList[index].subText,
                  textAlign: TextAlign.left,
                ),
                Container(
                  height: 25,
                  width: 50,
                  color: indicatorDataList[index].color,
                ),
                Text(indicatorDataList[index].text),
                Text(
                  indicatorDataList[index].value.toString(),
                ),
              ],
            ),
          );
        ,
      ),
    );
  

【参考方案1】：

使用MediaQuery.of(context).size.width 明确给出所有四列的宽度

【讨论】：

抱歉，不知道你在这里想说什么

从上面的图片中你可以看出它有 4 列，对吧？ （好，greenColor ,65%,72）。不要使用扩展或默认宽度。使用 MediaQuery.of(context).size.width

明确给出所有四列的宽度