暗色模式
图层操作
图层是 MasterGo 设计的核心概念。本章介绍如何选择、管理、编排和美化图层,帮助你高效组织设计内容。
选择图层
图层就像是含有文字或图形等元素的图像,一张张按顺序叠放,组合形成页面的最终效果。图层中可以加入文本、形状、图片等,也可以在里面再嵌套图层。
选择单个图像
从画布中选择: 单击画布中的图像,边缘周围会出现带有手柄的蓝色边框。如果嵌套在另一个图像、组或图层中,可以双击逐步深入选择,或者按住 Command 键直接穿透选择到目标图层。
从左侧图层栏选择: 图层按页面排列在图层面板中,根据图像类型命名。点击容器或组旁边的箭头可展开查看子图层。鼠标悬停在面板中的图层上,画布上的图像会以蓝色框突出显示。
选择多个图像
从画布中选择:
- 选择一个图像后,按住 Shift 键并单击另一个图像
- 使用框选:单击并按住画布的空白部分,拖动光标覆盖需要选择的图像
从左侧图层栏选择:
- 选择两个图层之间的所有图层:选择一个图层,按住 Shift 键选择另一个图层
- 单独选择多个图层:按住 Command (Mac) 或 Ctrl (Windows) 键选择
选择嵌套图层
设计复杂时可能有很多嵌套在其他组或容器中的图像。单击属于组或容器的图像时,默认选择整个框架/组。选中嵌套图像时,单击时按住 Command (Mac) 或 Ctrl (Windows) 键。
测量图层间距离
MasterGo 中每个图层之间都有距离,查看距离数值可以帮助精准调节图层位置。
用快捷键测量间距
选中一个图层后按住快捷键:
- Mac:Option
- Windows:Alt
然后将光标移动到目标图层上,即可查看选中图层和目标图层之间的距离数值。
特殊情况说明
测量文字、多边形等图层与其他图层的距离:
文字、三角形、多边形、星形等图层框默认不会贴合本身形状。想精准测量它们的实际距离,需要先将图层框贴合形状:
- 选中图层,右键菜单选择"拼合"
- 或使用快捷键:Command + E (Mac) / Ctrl + E (Windows)
测量外部图层与编组内子图层的距离:
- 方式一:选中编组内子图层,按住 Option / Alt,将鼠标移动到编组外目标图层
- 方式二:选中编组外图层,按住 Command + Option / Ctrl + Alt,将鼠标移动到编组内子图层上穿透选择
移动测距
打开偏好设置中的"移动测距"后,挪动图层时可以直观看到与其他图层间的距离变化,更精准调整位置。
修改图层名称
清晰的图层结构和命名有利于高效管理设计稿和协作。
重命名单个图层
- 在左侧图层树上双击想要修改的图层,进入编辑状态,按回车或点击空白处完成修改
- 在画布上,容器、区域、组件的左上角显示图层名称,双击名称也可以直接修改
批量重命名
同时选中多个需要重命名的图层,在图层树上点击右键,在菜单中选择"重命名"。 或使用快捷键:Command + R (Mac) / Ctrl + R (Windows)。
批量重命名
概述
使用批量重命名功能,可对容器、分组、组件、形状、文本、图片等图层进行批量命名操作,也可批量重命名样式。此功能对于维护团队库特别有用。
入口
- 同时选中多个需要重命名的图层,在图层树上右键选择"重命名"
- 在画布右侧面板上同时选中多个样式,右键选择"重命名"
- 快捷键:Command + R (Mac) / Ctrl + R (Windows)
容器名称显示
容器(Frame/Section/Group)的名称在画布上的显示取决于容器类型和画布缩放级别。放大到一定比例时,容器名称会显示在容器左上角。名称的长度和位置由系统自动计算,无法单独控制。
创建图层
使用顶部工具栏快捷键创建图层:
| 图层类型 | 快捷键 |
|---|---|
| 矩形 | R |
| 椭圆 | O |
| 文本 | T |
| 钢笔 | P |
| 容器 | F |
编组与解组
- 选中图层后按 Command + G (Mac) / Ctrl + G (Windows) 编组
- 按 Command + Shift + G / Ctrl + Shift + G 解组
- 双击组可进入编辑模式
图层排序
- Command + ] (Mac) / Ctrl + ] (Windows):上移一层
- Command + [ / Ctrl + [:下移一层
- 在左侧图层面板中拖拽调整顺序
图层搜索与筛选
在图层面板顶部的搜索框中输入关键词,可按名称、类型筛选图层。
描边、填充与特效
MasterGo 提供丰富的样式属性,详见独立文档:
隐藏与锁定
隐藏
图层处于隐藏状态时,将不会在画布中出现,也无法在画布中选中,但在图层栏中可以选中该图层。
锁定
如果对象或图层被锁定时则无法通过正常的单击进行选择,但可以通过图层选择菜单选择它。已锁定图层会显示在图层选择菜单中并带有锁图标。
锁定图层快捷键:
- macOS:Command + Shift + L
- Windows:Ctrl + Shift + L
对齐分布与调整大小
对齐分布
在右侧栏顶部可以找到对齐分布的选项:
对齐选项:
- 左对齐
- 左右居中对齐
- 右对齐
- 顶对齐
- 上下居中对齐
- 底对齐
分布选项:
- 垂直平均分布
- 水平平均分布
调整大小
画布调整:
- 拖拽图形某一边中间的点来调整长或宽
- 按住 Shift 键,图层长宽按等比例变化
- 按住 Option 键,图层从中间向四周改变大小
键盘调整:
- Command + 方向键:调整图层宽高,每次 1px
- 按住 Shift 键:每次调整 10px
- 可在汉堡菜单 -> 设置 -> 微调 中调整默认数值
智能排列
智能排列允许你快速轻松地调整画布上对象的间距和排列,非常适合快速调整复杂布局。
适用场景
- 调整多个图像之间的垂直或水平间距
- 将选择的图像排列为均匀和非均匀网格
- 将图像重新排列或排序
什么是智能排列
智能排列允许在画布中快速选择 3 个或更多图像,并轻松调整它们的排列和间距。需要满足的条件:在 X 轴或 Y 轴上,至少有两个图层都经过一条轴。
智能排列的识别标志:
- 每个图像中心出现粉色的环状选择手柄
- 图像之间出现粉色线状控制柄,用于调整间距
- 对于水平轴或垂直轴,图像将仅基于重叠的轴排列
调整间距
将鼠标悬停在图像之间的紫色手柄上,光标处出现箭头,单击并拖动:
- 向上:减少图像之间的垂直间距
- 向下:增加图像之间的垂直间距
- 向左:减少图像之间的水平间距
- 向右:增加图像之间的水平间距
重新排列图像
将光标 hover 到图层上时,该图层会显示一个可拖动的原点,拖动原点可将该图层与其他图层交换位置。
约束与自动布局
图层行为和响应式布局详见独立文档:
复制粘贴
在 MasterGo 中,除了最常用的 Command/Ctrl + C(复制)和 Command/Ctrl + V(粘贴)外,还支持以下方法:
粘贴到这里
复制图层后,右键点击需要放置的位置,在右键菜单中选择"粘贴到这里",即可将图层粘贴到光标指向的位置。
- 右键画布无内容区域,选择"粘贴到当前位置"
- 快捷键:Command + Shift + V (Mac) / Ctrl + Shift + V (Windows)
粘贴并替换
复制图层后,选中一个或多个图层,使用粘贴替换功能,可以用剪贴板中的图层替换选中图层的效果。
- 右键点击选中的图层,在菜单中选择"粘贴替换"
- 主菜单 -> 编辑 -> 粘贴替换
- 快捷键:Shift + Command + R (Mac) / Shift + Ctrl + R (Windows)
比例锁定
当你需要保持图层原始比例时,锁定比例功能将宽高属性联动,调整其中一个属性时另一个会自动按比例跟随变化,保证图层不会变形。