Flutter 3. 页面布局

Flutter中布局组件众多,大致有:

  • Align: 对齐布局组件,指定child的对齐方式
  • AspectRatio: 调整宽高比,根据设置的宽高比调整child
  • Baseline: 基准线布局,所有child的底部在同一条水平线上
  • Center: 居中布局,child处于水平或者垂直方向的中间
  • Column: 垂直布局,对child的垂直方向进行排列
  • ConstrainedBox: 限高布局,限定child的宽高最大值
  • Container: 容器布局,容器布局是一个组合的组件,包含定位和尺寸
  • FittedBox: 缩放布局,缩放以及位置调整
  • FractionallySizedBox: 百分比布局,根据现有空间按照百分比调整child的尺寸
  • GridView: 网格布局,对多行多列同时进行操作
  • IndexedStack: 栈索引布局,IndexedStack继承自Stack,显示第index个child,其他child都是不可见的
  • LimitedBox: 限定宽高布局,对最大宽高进行限制
  • ListView: 列表布局,用列表方式进行布局,比如多项数据的场景通讯录等
  • Offstage: 开关布局,控制是否显示组件
  • OvereflowBox: 溢出父容器显示,允许child超出父容器显示
  • Padding: 填充布局,处理容器与其child的间距
  • Row: 水平布局,对child在水平方向进行排列
  • SizedBox: 设置具体尺寸,用一个特定大小的盒子来限定child的宽高
  • Stack/Alignment: Alignment栈布局,根据Alignment组件的属性将child定位在Stack组件上
  • Stack/Positined: Positined栈布局,根据Positined组件的属性将child定位在Stack组件上
  • Table: 使用表格的行和列进行布局
  • Transform: 做矩阵变换,对child进行缩放、平移和旋转
  • Wrap: 按照宽度或者高度,让child进行自动换行布局

推荐一系列详细的布局介绍文章

猜你喜欢

转载自blog.csdn.net/weixin_34248705/article/details/87334516