flutter的布局方法

Flutter一切皆组件widget。
使用Scaffold是最容易的，它是 Material Components库中的一个widget，它提供了一个默认banner，背景颜色，并且具有添加drawer，snack bar和底部sheet的API。

Row /column垂直和水平放置多个widget

• 行和列都需要一个子widget列表。
• 子widget本身可以是行、列或其他复杂widget。
• 您可以指定行或列如何在垂直或水平方向上对齐其子项
• 您可以拉伸或限制特定的子widget.
• 您可以指定子widget如何使用行或列的可用空间.

Contents

• 对齐 widgets
• 调整 widgets
• 聚集 widgets
• 嵌套行和列

要在Flutter中创建行或列，可以将一个widget列表添加到Row 或Column 中。 同时，每个孩子本身可以是一个Row或一个Column，依此类推。

对齐 widgets

您可以控制行或列如何使用mainAxisAlignment和crossAxisAlignment属性来对齐其子项。

调整 widget

也许你想要一个widget占据其兄弟widget两倍的空间。您可以将行或列的子项放置在Expandedwidget中， 以控制沿着主轴方向的widget大小。Expanded widget具有一个flex属性，它是一个整数，用于确定widget的弹性系数,默认弹性系数是1。

聚集 widgets

默认情况下，行或列沿着其主轴会尽可能占用尽可能多的空间，但如果要将孩子紧密聚集在一起，可以将mainAxisSize设置为MainAxisSize.min。

常用布局widgets

以下widget分为两类：widgets library中的标准widget和Material Components library中的专用widget 。 任何应用程序都可以使用widgets library中的widget，但只有Material应用程序可以使用Material Components库。

标准 widgets

• Container添加 padding, margins, borders, background color, 或将其他装饰添加到widget.可让您创建矩形视觉元素。container 可以装饰为一个BoxDecoration, 如 background、一个边框、或者一个阴影。 Container 也可以具有边距（margins）、填充(padding)和应用于其大小的约束(constraints)。另外， Container可以使用矩阵在三维空间中对其进行变换。
• GridView将 widgets 排列为可滚动的网格.
• ListView将widget排列为可滚动列表
• Stack将widget重叠在另一个widget之上.

Material Components

• Card将相关内容放到带圆角和投影的盒子中。
• ListTile将最多3行文字，以及可选的行前和和行尾的图标排成一行
• Container 概要 :
• 添加padding, margins, borders
• 改变背景颜色或图片
• 包含单个子widget，但该子widget可以是Row，Column，甚至是widget树的根
• 使用GridView用途：
• 在网格中放置widget
• 检测列内容超过渲染框时自动提供滚动
• 自定义grid，或使用一下提供的grid之一：GridView.count指定列数 GridView.extent指定项的最大像素宽度
• 在显示二维列表时，重要的是单元格占用哪一行和哪一列时， 应该使用Table或 DataTable。
• ListView 摘要:
• 用于组织盒子中列表的特殊Column
• 可以水平或垂直放置
• 检测它的内容超过显示框时提供滚动
• 比Column配置少，但更易于使用并支持滚动
• Stack来组织需要重叠的widget。同absolute
• 用于与另一个widget重叠的widget，
• Stack允许子 widget 堆叠，可以使用 Positioned 来定位他们相对于Stack的上下左右四条边的位置。
• 子列表中的第一个widget是base widget; 随后的子widget被覆盖在基础widget的顶部
• Stack的内容不能滚动
• 您可以选择剪切超过渲染框的子项
• Card 是Material Components 库里的widget
• Card有一个子项， 但它可以是支持多个子项的列，行，列表，网格或其他小部件。默认情况下，Card将其大小缩小为0像素。您可以使用SizedBox来限制Card的大小。
• 接受单个子项，但该子项可以是Row，Column或其他包含子级列表的widget
• 显示圆角和阴影
• Card内容不能滚动
• ListTile是Material Components库中的一个专门的行级widget，用于创建包含最多3行文本和可选的行前和行尾图标的行。ListTile在Card或ListView中最常用.是Material Components 库里的widget