P74 图层中元素的排列和分布 (Arranging & Distributing Elements in Layers)
课程主题与核心目标
学会对多个图层元素进行对齐(Align)和分布(Distribute)操作,以及利用自动选择功能快速定位图层。
核心概念解析
- 自动选择 (Auto-Select):移动工具选项,在画布上点击即可自动选中对应图层
- 默认按"组"选择,可切换为按"图层"选择
- 对齐 (Align):将选中图层的元素按指定边缘或中线对齐
- 顶对齐/垂直居中/底对齐/左对齐/水平居中/右对齐
- 分布 (Distribute):将选中图层的元素等间距均匀分布
- 按顶分布/垂直居中分布/按底分布/按左分布/水平居中分布/按右分布
- 智能参考线吸附:拖动图层时会显示间距和对齐参考线
核心实操步骤
- 开启自动选择:移动工具 → 选项栏勾选"自动选择" → 选择"图层"
- 多选图层:
Shift + 点击画布上的元素或图层面板中的图层 - 对齐:选中≥2个图层 → 选项栏点击对齐按钮(顶/中/底/左/中/右)
- 分布:选中≥3个图层 → 选项栏点击分布按钮
- 取消多选:在图层面板空白处点击
快捷键速查表
| 快捷键 | 功能 |
|---|---|
Shift + 点击 (画布上) | 多选图层元素 |
Shift + 点击 (图层面板) | 连续多选图层 |
V | 移动工具 |
| 点击图层面板空白处 | 取消多选 |
避坑指南与注意事项
- 对齐和分布按钮在移动工具选项栏中,需先选中移动工具才可见
- 分布操作需要至少选中3个图层
- 自动选择默认为"组"模式,切换到"图层"模式更精确
- 建议保持自动选择常开,能极大提高图层选择效率
- 排列和分布常用于UI设计、多图排版等需要精确对齐的场景