在Flutter中,容器(Widgets)是构建用户界面的基本组件。它们可以是简单的元素,如文本或图片,也可以是更复杂的布局容器。以下是一些在Flutter中常用的容器和基本控件:
### 容器(Containers):
1. `Container`:最基本的布局容器,用于包装其他Widget,可以设置边距(margin)、填充(padding)、边框(border)、颜色(color)等样式属性。
2. `Column`:垂直排列的布局容器,类似于HTML中的`<div>`元素,用于创建垂直的布局结构。
3. `Row`:水平排列的布局容器,类似于HTML中的`<div>`元素,用于创建水平的布局结构。
4. `Expanded`:扩展布局,使得子组件填充可用空间。
5. `Flexible`:类似于`Expanded`,但它允许子Widget在空间足够时扩展,而当空间不足时缩小。
6. `Wrap`:用于垂直或水平环绕布局的Widget,当空间不足时会换行。
7. `GridView`:用于显示网格布局的Widget,类似于HTML中的`<table>`元素。
8. `ListView`:用于显示列表布局的Widget,是构建滚动列表的常用选择。
9. `Center`:将子Widget居中显示的Widget。
10. `Align`:用于对齐子Widget的Widget,可以设置对齐方式和尺寸。
11. `Padding`:在子Widget周围添加内边距的Widget。
12. `Column` 和 `Row` 中的 `MainAxisAlignment` 和 `CrossAxisAlignment`:这些是控制主轴和交叉轴上子Widget对齐方式的枚举。
### 基本控件(Basic Elements):
1. `Text`:用于显示文本的控件。
2. `Image`:用于显示图片的控件。
3. `Icon`:用于显示图标的控件,常用于图标按钮。
4. `Button`:用于创建按钮的控件,可以触发事件。
5. `RaisedButton`:创建一个带有圆角和点击效果的按钮。
6. `FlatButton`:创建一个扁平风格的按钮,没有圆角和点击效果。
7. `IconButton`:带有图标的按钮,通常用于导航和交互。
8. `TextField`:用于创建文本输入字段的控件。
9. `PasswordField`:类似于`TextField`,但输入内容会隐藏显示为星号。
10. `Checkbox`、`Radio`、`Switch`:用于创建选择控件,如复选框、单选框和开关。
11. `Slider`:用于创建滑动条控件。
12. `ToggleButtons`:用于创建一组可切换的按钮。
13. `DropdownButton`:用于创建一个下拉菜单,允许从一组选项中选择一个值。
14. `Chip`:用于创建类似于 Material Design 中的小标签或按钮。
这些控件和容器可以嵌套使用,以创造出各种复杂的用户界面布局和元素。Flutter的UI设计非常灵活,能够适应各种不同的设计需求。