Column和Row使用的方法一样,这里就写一个
Row的构造方法
Row({
Key key, // key
MainAxisAlignment mainAxisAlignment = MainAxisAlignment.start, // 子控件放置方式
MainAxisSize mainAxisSize = MainAxisSize.max, // 子控件应该如何沿着主轴放置
CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center, // 子控件对齐方式
TextDirection textDirection, // 从左到右,还是从右到左排序
VerticalDirection verticalDirection = VerticalDirection.down, // 垂直排序
TextBaseline textBaseline, // 对齐文本的水平线
List<Widget> children = const <Widget>[], // 子控件
})
MainAxisAlignment
这个是跟空间中的主轴等有关,而不能使多个子控件对齐
MainAxisAlignment.start, // 尽可能靠近主轴的起点
MainAxisAlignment.end, // 尽可能靠近主轴末端的地方
MainAxisAlignment.center, // 尽可能近主轴中间的地方
MainAxisAlignment.spaceBetween, // 在子控件中间均匀地放置自由空间,第一个前和最后一个后无空间
MainAxisAlignment.spaceAround, // 在子控件中间均匀地放置自由空间,同时也放置一半空间在第一个前和最后一个控件后。
MainAxisAlignment.spaceEvenly, // 在第一个控件和最后一个控件之前和之后均匀地放置自由空间
crossAxisAlignment
子控件对齐方式,当子控件高度不一样时,如何被放置在中心轴,而MainAxisAlignment 决定了子控件间的间隔
CrossAxisAlignment.start, // 子控件都父控件的项部
CrossAxisAlignment.end, // 子控件都在父控件的底部
CrossAxisAlignment.center, // 子控件居父控件的中部
CrossAxisAlignment.stretch, // 子控件填满横轴,( 使用此值时,子控件一定要设置width)
比如:
crossAxisAlignment 没设置之前
设置之后:
MainAxisAlignment设置之前
设置之后: