布局组件
布局组件负责「字段怎么排」，不直接收集业务值。用好布局，表单更易读，也能更好适配不同屏幕宽度。
和子表单、模块的分工
| 能力 | 做什么 |
|---|---|
| 布局组件（本文） | 排版：几列、页签、折叠、间距 |
| 子表单组件 | 结构：可重复明细、分步填写 |
| 模块管理 | 弹窗 / 抽屉等附属界面 |
弹窗、抽屉请到模块管理设计，不要把普通布局当成「假弹窗」滥用。
组件一览
以当前设计器列表为准。下面每个组件附拖入画布后的样子。
栅格布局
按列划分，字段并排。适合姓名 / 工号等短字段。
表格布局
以表格单元格方式排版，标签与控件对齐感强。
行内布局
控件在一行内紧凑排列，适合查询条件条。
盒子布局
弹性 / 块级容器排版，自定义块状分区。
标签页
多页签切换内容，如基本信息 / 证件 / 联系人。
间距
控制区块间隙，增加分区呼吸感。
卡片
分组包裹，带标题区域，如「申请人信息」。
折叠面板
可展开收起的分组，高级选项可默认收起。
描述列表
适合只读详情式排版（审批详情等）。
怎么用（分步）
- 先容器后字段：从 布局组件 拖入容器（卡片 / 栅格 / 标签页等，效果见上文「组件一览」）。
- 把基础组件拖进容器内部。
- 用属性调整列数、间距、页签标题、折叠默认展开等。
- 切换较窄宽度（或手机预览）检查是否拥挤、标签是否折行难看。
- 用大纲确认嵌套层级是否过深。
场景示例
入门：两列基本信息（栅格）
背景：入职表里姓名、工号、部门、岗位都是短字段，希望并排节省纵向空间；备注较长需独占一行。
拖入「栅格布局」→ 短字段两列排放 → 备注放在栅格外整行 → 确认栅格间隔合适。
预期：短字段左右对齐；窄屏预览时注意是否需改为一列。
入门：卡片分区
背景：请假申请希望一眼分成「基本信息」和「请假信息」两块。
拖入两张「卡片」改标题 → 卡片内再放栅格或字段 → 预览看分区是否清晰。
预期：比纯间距更易扫读；卡片本身不产生提交值。
常用：资料采集用标签页
背景：员工资料字段多，一屏过长容易漏填。
拖入「标签页」建页签 → 字段拖进各页（页内仍可用栅格）→ 预览逐页检查必填。
预期：切换页签只显示一块；提交前各页必填均已覆盖。
常用：高级选项折叠
背景：通知偏好里常用项始终可见，高级项默认收起。
常用字段放「卡片」→ 「折叠面板」放高级字段并默认不展开 → 预览确认可展开。
预期：首屏只看到常用项。
常用：查询条行内
筛选区用行内布局：关键字 + 状态下拉 + 查询按钮同一行，结果区另起一块。效果见上文「行内布局」。
常用：审批详情描述列表
只读展示用描述列表排「申请人 / 部门 / 金额」；录入态仍用输入类组件。效果见上文「描述列表」。
响应式与快速布局
注意点
- 布局嵌套不宜过深，否则后期改结构成本高。
- 布局本身一般不承载提交值；业务数据放在内部字段上。
- 标签页 / 折叠里的必填，务必在预览中逐块验证。
- 与「分组」（子表单分组）区分：要可重复明细用子表单；只要视觉分区用卡片 / 折叠即可。