Flutter中MainAxisAlignment.spaceEvenly未实现组件均匀分配间距问题

问题原因 #

嵌套在Container内部的Row没有获取到足够的可用主轴宽度，MainAxisAlignment.spaceEvenly的生效前提是Row的主轴宽度大于所有子元素的宽度总和，有多余空间可供分配。
你当前代码里，外层父Row的子元素默认是收缩到自身内容宽度的，包裹内部Row的Container没有指定宽度，会自适应内部三个Text的总宽度，没有多余的空白空间用来做间距分配，所以spaceEvenly设置不会生效。

解决方案 #

把包裹内部Row的Container替换为Expanded组件，让这部分区域自动占满外层父Row剩余的所有水平空间，内部的Row有了足够宽度后spaceEvenly就会正常生效。
修改后的代码示例：

body: Center(
  child: Column(
    children: [
      Row(
        children: [
          CircleAvatar(
            backgroundImage: NetworkImage(
                'https://raw.githubusercontent.com/flutter/website/master/examples/layout/sizing/images/pic1.jpg'),
            radius: 50,
          ),
          SizedBox(
            width: 30,
          ),
          // 把原Container替换为Expanded
          Expanded(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                Text('Post'),
                Text('Followers'),
                Text('Following')
              ],
            ),
          )
        ],
      ),
    ],
  ),
),

如果需要固定这部分区域的宽度，也可以直接给原来的Container设置明确的width属性，只要宽度大于三个Text的总宽度，也能让spaceEvenly生效，使用Expanded的适配性更好，适配不同屏幕宽度的表现更稳定。

内容的提问来源于stack exchange，提问作者Kavach Dheer