自动布局
自动布局主要用于:
- 让画框中的元素根据内容变化自动排列和调整大小,无需手动重新定位
- 创建响应式设计,如自动伸缩的按钮、自适应的列表和仪表盘布局
- 通过嵌套不同方向的自动布局画框,构建复杂的多维界面
如何使用自动布局
添加自动布局
1.选择一个或多个图层,添加自动布局:
- 按
⇧ Shift+A - 或点击右侧边栏中的添加自动布局

2.选择合适的排列方式
- ↕ 垂直 — 对象沿 Y 轴排列。适用于列表项、时间线帖子等。
- ↔ 水平 — 对象沿 X 轴排列。适用于一排按钮、导航图标等。选择水平后可启用换行,将溢出对象推到下一行。

固定尺寸和适应内容
设为固定后,图层尺寸不受内容或父子对象变化影响。手动调整大小或输入数值时,会自动切换为固定。
在自动布局画框上设为适应内容,画框会保持最小尺寸包裹子对象,同时保留间距值。
例如:文本图层 40px 宽 + 左右内边距各 10px = 画框宽度 60px。文本变为 50px 后,画框自动变为 70px。

使用填充容器
将子对象设为填充容器,它会拉伸占满父画框中所有可用空间。只能应用于自动布局画框的子对象。

设置最小和最大尺寸
最小/最大尺寸是附加设置,可与其他大小调整属性同时使用。
- 打开宽度或高度下拉菜单。
- 选择添加最小宽度/高度或添加最大宽度/高度。
- 输入数值或应用变量。
要移除限制,从下拉菜单中选择移除最小值和最大值。

嵌套自动布局画框
将自动布局画框嵌套在另一个自动布局画框中,可以组合水平、垂直和网格排列,创建多维布局。嵌套画框同时具有父级和子级属性,各有独立的内边距和元素间距。
