Skip to content

图层操作

图层是 MasterGo 设计的核心概念。本章介绍如何选择、管理、编排和美化图层,帮助你高效组织设计内容。

选择图层

图层就像是含有文字或图形等元素的图像,一张张按顺序叠放,组合形成页面的最终效果。图层中可以加入文本、形状、图片等,也可以在里面再嵌套图层。

选择单个图像

从画布中选择: 单击画布中的图像,边缘周围会出现带有手柄的蓝色边框。如果嵌套在另一个图像、组或图层中,可以双击逐步深入选择,或者按住 Command 键直接穿透选择到目标图层。

从左侧图层栏选择: 图层按页面排列在图层面板中,根据图像类型命名。点击容器或组旁边的箭头可展开查看子图层。鼠标悬停在面板中的图层上,画布上的图像会以蓝色框突出显示。

选择多个图像

从画布中选择:

  • 选择一个图像后,按住 Shift 键并单击另一个图像
  • 使用框选:单击并按住画布的空白部分,拖动光标覆盖需要选择的图像

从左侧图层栏选择:

  • 选择两个图层之间的所有图层:选择一个图层,按住 Shift 键选择另一个图层
  • 单独选择多个图层:按住 Command (Mac) 或 Ctrl (Windows) 键选择

选择嵌套图层

设计复杂时可能有很多嵌套在其他组或容器中的图像。单击属于组或容器的图像时,默认选择整个框架/组。选中嵌套图像时,单击时按住 Command (Mac) 或 Ctrl (Windows) 键。

测量图层间距离

MasterGo 中每个图层之间都有距离,查看距离数值可以帮助精准调节图层位置。

用快捷键测量间距

选中一个图层后按住快捷键:

  • Mac:Option
  • Windows:Alt

然后将光标移动到目标图层上,即可查看选中图层和目标图层之间的距离数值。

特殊情况说明

测量文字、多边形等图层与其他图层的距离:

文字、三角形、多边形、星形等图层框默认不会贴合本身形状。想精准测量它们的实际距离,需要先将图层框贴合形状:

  1. 选中图层,右键菜单选择"拼合"
  2. 或使用快捷键:Command + E (Mac) / Ctrl + E (Windows)

测量外部图层与编组内子图层的距离:

  • 方式一:选中编组内子图层,按住 Option / Alt,将鼠标移动到编组外目标图层
  • 方式二:选中编组外图层,按住 Command + Option / Ctrl + Alt,将鼠标移动到编组内子图层上穿透选择

移动测距

打开偏好设置中的"移动测距"后,挪动图层时可以直观看到与其他图层间的距离变化,更精准调整位置。

修改图层名称

清晰的图层结构和命名有利于高效管理设计稿和协作。

重命名单个图层

  • 在左侧图层树上双击想要修改的图层,进入编辑状态,按回车或点击空白处完成修改
  • 在画布上,容器、区域、组件的左上角显示图层名称,双击名称也可以直接修改

批量重命名

同时选中多个需要重命名的图层,在图层树上点击右键,在菜单中选择"重命名"。 或使用快捷键:Command + R (Mac) / Ctrl + R (Windows)。

批量重命名

概述

使用批量重命名功能,可对容器、分组、组件、形状、文本、图片等图层进行批量命名操作,也可批量重命名样式。此功能对于维护团队库特别有用。

入口

  1. 同时选中多个需要重命名的图层,在图层树上右键选择"重命名"
  2. 在画布右侧面板上同时选中多个样式,右键选择"重命名"
  3. 快捷键: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)

比例锁定

当你需要保持图层原始比例时,锁定比例功能将宽高属性联动,调整其中一个属性时另一个会自动按比例跟随变化,保证图层不会变形。