跳过导航

形状遮罩

上次更新于 2023年9月1日
阅读需 4 分钟

遮罩是形状图层,您可以使用它们来隐藏或显示其他形状的部分。

创建遮罩有几种不同的方法,但它们都遵循相同的规则:我们将使用图层列表中最底部的形状作为遮罩。 Sketch 支持两种特定类型的遮罩模式:轮廓和 Alpha,您可以使用它们来遮罩图像或形状图层。

创建简单遮罩

轮廓模式下的遮罩仅显示位于其形状内的一个或多个图层的部分。您可以将轮廓遮罩模式应用于图像和形状图层。

创建轮廓遮罩

观看课程

在画布上选择一个形状,然后选择 **图层** > **遮罩** > **用作遮罩**。或者,按住 Control 键单击该形状并选择 **用作遮罩**,或者使用 M 快捷键。

因为遮罩会影响位于其上方的 *所有* 图层,我们建议将遮罩图层与您要遮罩的图层分组。

如何使用椭圆形状创建简单遮罩

创建遮罩时,您会看到一个被遮罩的 图标,它位于遮罩影响的任何图层或组旁边。图层列表中的遮罩图层图标不显示填充。

请记住,除非遮罩已分组,否则遮罩将影响您在其上方创建的任何新图层或组。

An image showing the Layer List with a mask layer and the layer that’s affected above it

在图层列表中,遮罩图层始终影响其上方的图层

要从图层中移除遮罩,您可以将其关闭。在图层列表中(或直接在画布上)选择遮罩图层,按住 Control 键单击,然后从上下文菜单中选择 **用作遮罩**。您也可以通过取消选中菜单栏中的 **图层** > **遮罩** > **用作遮罩** 来关闭遮罩。

虽然在定位或调整遮罩大小时使用带有填充的遮罩可能很有用,但之后您可以在检查器中关闭填充。即使没有可见的填充,遮罩仍会像往常一样影响其他图层。

如果您想将图层放置在遮罩图层上方,但不希望它们包含在遮罩中,请选择它并选择 **图层** > **遮罩** > **忽略底层遮罩**。您也可以将遮罩的图层和遮罩本身分组,以便不影响该组之外的任何内容。

使用多个选择项进行遮罩

如果选择多个图层,可以通过选择 **图层** > **遮罩** > **遮罩选区** 一次性遮罩它们。这将自动将所选图层的最后一个更改为遮罩,并将它们全部分组。

您可以将多个图层分组,其中最后一层充当遮罩

一个例外是,如果您想使用特定形状遮罩图像。在这种情况下,您可以绘制一个形状并将其放置在图层列表中的图像上方,然后选择形状和图像,并使用 **图层** > **遮罩** > **遮罩选区**。 Sketch 将使用该形状遮罩图像,并自动创建一个组,其中遮罩图层位于图像下方。

如果图像包含任何 Alpha(透明度)值并且是最低层,Sketch 将假定您要使用该图像作为遮罩。

您还可以选择多个图层并按住 Control 键单击以调出上下文菜单中的 **遮罩选区** 选项。

在遮罩组中选择一个图层并选择 **图层** > **遮罩** > **忽略底层遮罩** 将保持图层在组中,但阻止它受到遮罩的影响。

使用图像遮罩

您还可以仅为图像创建遮罩。选择一个图像(没有任何 Alpha 透明度),然后从菜单栏或上下文菜单中使用 **图层** > **遮罩** > **遮罩图像**。这会添加一个遮罩图层并将图像与遮罩分组 — 如果您想快速裁剪图像,这将非常方便。

创建 Alpha 遮罩

创建 Alpha 遮罩

观看课程

Alpha 遮罩隐藏了其形状之外的任何内容 — 并且还会根据遮罩图层的不透明度来控制其遮罩的任何图层的不透明度。

要创建 Alpha 遮罩,请像往常一样创建一个遮罩,然后选择它并选择 **图层** > **遮罩** > **遮罩模式** > **Alpha 遮罩**。

在检查器中,检查遮罩图层的填充是否具有不透明度/Alpha 值,或者包含 Alpha 的渐变填充。 Sketch 会将这些值应用于任何遮罩图层。您还可以添加模糊效果以获得更平滑的外观。

如何使用模糊 Alpha 遮罩

Alpha 与轮廓遮罩模式

理解遮罩的最佳方法是尝试轮廓遮罩和 Alpha 遮罩,并调整遮罩图层的样式设置。

An image comparing outline and alpha masks

轮廓和 Alpha 遮罩的比较

您可以将任何图层用作遮罩,包括图像。如果您使用的是具有透明度的 PNG 图像并将其用作 Alpha 遮罩,则该透明度也将延续到遮罩影响的图层。