mainAxisSize、mainAxisAlignment、c

Flutter中，Row Widget 和Column Widget 都继承自Flex Widget
借用一张图解释一下什么是Flex的主轴与交叉轴

image.png

mainAxisSize

主轴应占用多少空间
MainAxisSize.max

MainAxisSize.max.png

MainAxisSize.min

MainAxisSize.min.png

mainAxisAlignment

如何在Flex布局中沿主轴放置子节点
需要设置mainAxisSize.max才有效果
MainAxisAlignment.center

MainAxisAlignment.center.png
MainAxisAlignment.spaceEvenly
MainAxisAlignment.spaceEvenly.png
MainAxisAlignment.spaceBetween
MainAxisAlignment.spaceBetween.png

crossAxisAlignment

如何在Flex布局中沿交叉轴轴放置子节点
CrossAxisAlignment.center

CrossAxisAlignment.center.png
CrossAxisAlignment.end
CrossAxisAlignment.end.png
CrossAxisAlignment.stretch
CrossAxisAlignment.stretch.png
CrossAxisAlignment.baseline
CrossAxisAlignment.baseline.png