Container 布局
1. Container 没有子widget， 大小是父widget 大小
Container(
color: Colors.yellow，
)
2. Container 有子widget， 大小是子widget 大小
Container(
color: Colors.yellow
child: Text('container'),
)
3.Container 有子widget，并且设置alignment 大小是父widget 大小
Container(
color: Colors.yellow,
alignment: Alignment(0,0),
child: Text('container'),
)
Row 或 Column 布局
主轴：MainAxisAlignment
spaceBetween: 小部件两端对齐，剩下的空间平均分布
spaceAround: 剩下的空间平均分布到小部件周围！！
spaceEvenly：剩下的空间和小部件一起平均分！！
start 向主轴开始的方向对齐。
end 向主轴结束的方向对齐。
center 主轴方向居中对齐
交叉轴：CrossAxisAlignment 垂直于主轴方向
baseline：文字底部对齐
center：交叉轴方向居中对齐。
end：向交叉轴结束的方向对齐。；
start：向交叉轴开始的方向对齐；
stretch：填满交叉轴方向；
Expanded 在主轴方向填充剩下间隙
crossAxisAlignment: baseline, 使用方法
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
crossAxisAlignment: CrossAxisAlignment.baseline,
textBaseline: TextBaseline.ideographic,
）
Stack 布局
方向从里到外
Stack 大小 是包含第一个widget的大小， 与Positioned 部件配套使用
Container(
color: Colors.yellow,
alignment: Alignment(0,0),
child: Stack(
children: [
Container(color: Colors.red, width:80, height:80,),
Positioned(
child: Container(
color: Colors.green,
width:60,
height:60,
),
right:5,
),
Container(
color: Colors.blue,
width:40,
height:40,
),
],
),
)
宽高比布局
AspectRatio 部件对父widget 起作用
创建宽度是屏幕宽，宽高比2/1
Container(
color: Colors.yellow,
alignment: Alignment(0,0),
child:Container(
color: Colors.red,
// width: 100,
child: AspectRatio(
aspectRatio:2 /1,
child: Text('aspectRatio'，
),
),
),
)
