# 1 用户场景
很多客户在使用苍穹平台设计器进行界面设计时，对布局的知识不够了解，导致设计出来的界面有不够美观。本篇知识以平台预置的动态表单模板对话框为需求原型，介绍前端布局设计的主体步骤。
# 2 操作步骤
## 2.1 界面规划
对话框原型界面整体为垂直布局，可以分为两块区域：内容区和按钮区
## 2.2 设置布局方式
对话框结构为上下结构，所以布局方式采用垂直布局的方式比较适合。选中根节点，调整其布局方式为垂直布局、水平充满，并修改其宽、高度等属性。设计器布局页签有快捷的布局选择，点击选中即可。
## 2.3 使用布局控件
布局控件有Flex面板，高级面板，字段布局面板等。高级面板带有操作功能的标签栏，字段布局面板适合放多个字段的布局。在页面元素大纲选中根节点，在控件工具箱中找到Flex面板，添加两个Flex面板作为内容区和按钮区。
添加完成后按需要调整两个Flex面板的高度，将按钮区的Flex面板设置高度为50px，并将Flex面板的扩展比率设为0，这样整体的布局就完成了
## 2.4 放置业务字段/控件
整体布局设置好之后，即可在相应的容器控件中添加字段或控件，并调整相应容器控件的布局和控件的属性。
接下来选中下面的Flex面板，添加两个按钮，然后调整按钮的样式，给第二个按钮设置背景色。完成后后将面板的
