Flutter widget - Flex 的使用

同 LinearLayout,属性direction 决定 children 的排列方向

verticalDirection:(布局垂直排列方向)

指定主轴的方向,默认down

down 从上到下(上始下末) up:从下到上(下始上末)

mainAxisAlignment (垂直对齐方式)

主轴对齐方式:

start 头对齐 ,end 尾对齐 ,center 中对齐

spaceAround 将空闲空间均匀地放置在孩子之间,始和末的空闲空间为一半。

spaceBetween 将空闲空间均匀地放在孩子们之间,始和末没有空闲空间。

spaceEvenly 将空闲空间均匀地放置在孩子之间,始和末有同样空闲空间

textDirection-水平排列方向

ltr 从左到右 左始右末(默认) , rtl 从右到左,右始左末

crossAxisAlignment(水平对齐方式)

end 尾对齐 , start 头对齐 ,center 中间对齐

baseline 基线匹配

stretch 要求孩子填满横轴

需要注意的是,Flex 直接嵌套 Flex时,子Flex 的 direction 需跟父级的direction不一样.(不然就没意义了)

猜你喜欢

转载自blog.csdn.net/Changer93/article/details/85336888