用 Column 小部件可以在界面上摆放一列小部件。选中 Align 小部件,按下 command + . 执行 Remove this widget ,再选中 Center,按下 command + . 执行 Remove this widget。
然后选中 PlaygroundLayoutItem 小部件,command + . 执行 Wrap with Column ,这样会用一个 Column 小部件包装选中的小部件。这个 Column 小部件有一个 children 属性,它的值是一组要竖排显示的小部件。复制两份这个 PlaygroundLayoutItem 小部件,修改一下参数值,第二个设置成 2 ,第三个设置成 3 。
Column 小部件的主轴是垂直方向的,要设置它的子部件在这个主轴上的对齐,可以在小部件里添加一个 mainAxisAlignment 属性,它的值就是主轴上的对齐位置,比如 MainAxisAlignment.center,你会发现它的这组子部件会在主轴居中位置对齐。
这里我们也可以设置一下这些怎么样分配主轴上剩下的这些空间,比如要平均分配这些空间,可以把 mainAxisAlignment 设置成 MainAxisAlignment.spaceEvenly 。
Column 小部件的主轴是垂直方向的,对应的交叉轴就是水平方向的,要设置它的子部件在交叉轴的对齐,可以设置一下小部件的 crossAxisAlignment 属性,它的值就是对齐位置,比如 CrossAxisAlignment.end,这样这些子部件会在被放在交叉轴的结束位置上。