Flutter 布局属性的总结归纳

Flutter详解传送门

一、child

容器中包含的[子对象]。

如果为null，并且[constraints]是unbounded或也是null，则容器将展开以填充其父容器中的所有可用空间，除非父容器提供了unbounded约束，在这种情况下，容器将尝试尽可能小。

此小部件只能有一个子项。要布局多个子项，请将此小部件的子项设为具有children属性的小部件，如[Row]、[Column]或[Stack]，然后将子项提供给该小部件。

二、 Row

创建子对象的水平数组。

[mainAxisAlignment]、[mainAxisSize]、[crossAxisAlignment]和[verticalDirection]参数不能为空。如果[crossAxisAlignment]是[crossAxisAlignment.baseline]，则[textBaseline]不能为空。

[textDirection]参数默认为环境[Directionality]，如果有的话。如果没有环境方向性，并且需要文本方向来确定布局顺序（除非行没有子行或只有一个子行），或者消除[mainAxisAlignment]的开始值或结束值的歧义，[textDirection]不能为空。

三、Expanded：

创建扩展[Row]、[Column]或[Flex]子级的小部件，以便子级沿着Flex小部件的主轴填充可用空间。

四、Column

创建子对象的垂直数组。

[mainAxisAlignment]、[mainAxisSize]、[crossAxisAlignment]和[verticalDirection]参数不能为空。如果[crossAxisAlignment]是[crossAxisAlignment.baseline]，则[textBaseline]不能为空。

[textDirection]参数默认为环境[Directionality]，如果有的话。如果没有环境方向性，并且需要文本方向来消除[crossAxisAlignment]的起始值或结束值的歧义，[textDirection]不能为空。

1. mainAxisAlignment：如何在flex布局中沿主轴放置子对象。
   * MainAxisAlignment.center：将子对象放置在尽可能靠近主轴中心的位置。
   * MainAxisAlignment.spaceEvenly：在孩子之间以及第一个和最后一个孩子之前和之后均匀地放置空闲空间。

五、Container

创建一个结合了常见绘制、定位和大小调整小部件的小部件。

高度和宽度值包括填充。

不能同时提供color和decoration参数，因为这可能会导致在背景色上绘制装饰。要为装饰提供颜色，请使用decoration:BoxDecoration（color:color）。

1. width：宽度
2. height：高度
3. alignment: Alignment.center,：内容居中

六、Table

创建一个表。

[children]、[defaultColumnWidth]和[defaultVerticalAlignment]参数不能为null。

1. border：绘制表格的边界和内部分区时使用的样式。
2. children：组成这行单元格的小部件。子组件可以封装在[TableCell]小部件中，以向[Table]提供每个单元配置，但不需要将子节点封装在[TableCell]小部件中。
3. TableRow：在[Table]中创建一行。

七、Text

创建文本小部件。

如果[style]参数为null，则文本将使用最近的括起来的[DefaultTextStyle]中的样式。

[data]参数不能为空。

1. style: 如果为非null，则为用于此文本的样式。如果样式的“inherit”属性为true，则该样式将与最近的封闭[DefaultTextStyle]合并。否则，样式将替换最近的括起来的[DefaultTextStyle]。
   • Textstyle：创建文本样式。如果在包中定义了字体系列，则包参数必须为非null。它与fontFamily参数结合起来设置[fontFamily]属性。
   • fontWeight：绘制文本时使用的字体厚度（例如粗体）。
     例：style: TextStyle(fontWeight: FontWeight.bold),
   • fontSize: 绘制文本时要使用的图示符的大小（以逻辑像素为单位）。
     例：style: TextStyle(fontSize: 30.0)
   • decoration：要在文本附近绘制的装饰（例如下划线）。
     例：style: TextStyle(TextDecoration.none) 去掉下划线

八、Icon

创建图标。

[size]和[color]默认为当前[IconTheme]给定的值。

1. Icons： 支持的材质设计图标的标识符。与[Icon]类一起使用可显示特定图标。图标按其名称标识
2. size： 图标的大小（以逻辑像素为单位）。图标占据一个宽度和高度等于大小的正方形。

图标地址

九、Padding

在[装饰]内空白处刻字。[子对象]，如果有的话，放在这个填充中。

这种填充是对[装饰]中固有的任何填充的补充；参见[Decoration.padding]。
用法： padding: EdgeInsets.only(top: 4.0)

十、GestureDetector

创建检测手势的小部件。

“平移”和“缩放”回调不能同时使用，因为“缩放”是“平移”的超集。只需使用scale回调即可。
水平和垂直拖动回调不能同时使用，因为水平和垂直拖动的组合是一个平移。只需使用pan回调即可。
默认情况下，手势检测器向辅助技术使用的树提供语义信息。

1. onTap：出现了带有主按钮的点击。点击手势获胜时触发。如果点击手势没有成功，则调用[onTapCancel]。
   另请参见：
   [kPrimaryButton]，此回调响应的按钮。
   [onTapUp]，它同时被调用，但包含有关指针位置的详细信息。
   例：onTap: _receptionManagement
   => {
   bool _receptionActive = false;
   void _receptionManagement() {
   setState(() {
   _receptionActive = !_receptionActive;
   });
   }}

十一、ElevatedButton

创建一个提升按钮。

[autofocus]和[clipBehavior]参数不能为null。

1. onPressed：按下
   例：点击跳转路由
   * Navigator： 使用堆栈规则管理一组子小部件的小部件。
   许多应用程序在其小部件层次结构的顶部有一个导航器，以便使用[覆盖]显示其逻辑历史，最近访问的页面可视地显示在旧页面的顶部。使用此模式，通过在覆盖中移动小部件，导航器可以从一个页面直观地过渡到另一个页面。类似地，导航器可以通过将对话框小部件定位在当前页面上方来显示对话框。

   onPressed: () {
             Navigator.pushNamed(context, '/ReceptionManagementing');
           },
   

2. 样式：修改背景颜色 style: ButtonStyle(
   backgroundColor: MaterialStateProperty.all(Colors.white),
   ),

十二、FloatingActionButton

创建循环浮动操作按钮。

[mini]和[clipBehavior]参数不能为null。此外，[elevation]、[highlightElevation]和[disabledElevation]（如果指定）必须为非负。

1. extended: 创建一个更宽的[StadiumBorder]形浮动操作按钮，带有可选的[icon]和[label]。

[label]、[autofocus]和[clipBehavior]参数不能为null。此外，[elevation]、[highlightElevation]和[disabledElevation]（如果指定）必须为非负。
例：FloatingActionButton.extended()

十三、SizedBox

创建固定大小的框。[width]和[height]参数可以为null，以指示框的大小不应限制在相应的维度中。

十四、ToggleButtons

创建一组切换按钮。

它沿着[方向]显示在[子对象]的[列表]中提供的小部件。每个按钮的状态由[isSelected]控制，这是一个布尔列表，用于确定按钮处于活动、禁用或选定状态。它们都通过列表中的索引进行关联。[isSelected]的长度必须与[children]列表的长度匹配。

[children]和[isSelected]属性参数都是必需的。

[isSelected]值必须为非null[focusNodes]必须为null或非null节点列表[RenderOrder]和[direction]不能为空。如果[direction]为[Axis.vertical]，[verticalDirection]不能为空。

1. borderRadius: BorderRadius.circular(10), => 边框的圆角半径
2. selectedColor: Colors.blue, => 选中按钮的背景颜色
3. borderColor: Colors.orange, => 边框的圆角颜色
4. borderWidth: 3, => 边框的圆角宽度
5. splashColor: Colors.purple, => 水波纹颜色
6. highlightColor: Colors.yellow, => 按下时的高亮颜色

十五、Center

创建一个小部件，使其子部件居中。

十六、Offstage

创建一个小部件，以直观地隐藏其子级。

1. offstage: !isSelected[1] => 孩子是否隐藏在树的其他部分。如果是真的，那么孩子的布局就像在树上一样，但是没有画任何东西，没有让孩子可以进行命中测试，也没有占用家长的任何空间。
   台下的孩子们仍然很活跃：他们可以接收焦点，并将键盘输入定向给他们。动画继续在后台子级中运行，因此使用电池和CPU时间，而不管动画最终是否可见。如果为false，则子级将正常包含在树中。

十七、ListView

从显式的[List]创建一个可滚动的、线性的小部件数组。

1.scrollDirection: Axis.vertical 垂直滚动