布局

弹性布局（Flex Layout）

弹性布局是一种强大的布局系统，能够创建灵活且响应式的用户界面。

当前，有两种类型的组件支持弹性布局：

• Container
• Screen 本身

弹性布局配置步骤

1. 点击 Screen 或 创建一个新 Container 组件
2. 将 layout 属性设置为 flex
3. 配置 flex flow, main align, track align 属性
4. 添加行/列内边距以调整子组件之间的间距
5. 使用基于百分比的尺寸确保子组件能够自适应容器大小
6. 如果子组件有固定尺寸，则可以将 Container 组件的尺寸设置为 Auto 以适应内容

弹性布局示例

以下示例展示了使用嵌套 Container 组件实现的弹性布局。

按钮、下拉菜单和复选框会自动在容器内居中，无需设置明确的位置。