Flutter入门 - 布局

Container  容器
一. 属性
  constraints - 约束
  child - 子部件
  decoration - 装饰 (!!!)
  alignment - 对齐方式
Flutter入门 - 布局_第1张图片
image.png
Row  水平
Colum 垂直
mainAxisAlignment - 主轴方向
crossAxisAlignment - 交叉轴方向
Flutter入门 - 布局_第2张图片
image.png
Stack 可以存放一堆小部件
alignment 对齐方式
Flutter入门 - 布局_第3张图片
image.png
Positioned 小部件
 left - 左边距
 right - 右边距
 top - 上边距
bottom - 下边距
Flutter入门 - 布局_第4张图片
image.png
SizeBox - 小格子 小部件
可以做间隔使用

AspectRatio - 百分比
AspectRatio(
      aspectRatio:  1/2,
      child: Container(child: Icon(Icons.ac_unit),),
    )
ConstrainedBox 约束
ConstrainedBox(
                      constraints: BoxConstraints(
                          minWidth: 100,
                          maxWidth: 200,
                          minHeight: 100,
                          maxHeight: 200
                      ),
                      child: Container(
                        height: 300,
                        color: Colors.white,
                      ),
                    )

你可能感兴趣的:(Flutter入门 - 布局)