Sketch基础教程:形状知识
当前位置:贝知网>知识分享>设计开发>Sketch基础教程:形状知识
Sketch基础教程:形状知识
时间:2022-04-11 设计开发

Sketch基础教程:形状知识

形状

形状是Sketch文档中最常见的图层类型之一。你可以添加和编辑预制形状,或使用矢量工具创建自己的形状。

一、添加形状

#如何添加预先制作的形状#

要添加新形状,请单击工具栏中的“ 插入”按钮或菜单栏中的“ 插入”菜单项,选择“ 形状”选项,然后选择要添加的形状的类型。

你还可以使用以下键盘快捷键添加一些预制形状:

R长方形O椭圆U圆角矩形L线

单击并拖动画布或画板中的任意位置以添加形状。拖动时,你会在光标旁边看到形状的尺寸。

按住shift并拖动以使形状的高度和宽度相等。

按住option并单击并拖动以从其中心(而不是左上角)绘制形状。

按住空格键单击并拖动以更改形状的原点(而不是其大小)(如果从错误的位置开始,则很方便)。

#如何添加形状使用铅笔工具#

按P或从“ 插入”菜单中选择“ 铅笔 ” 以启用“铅笔”工具。从那里你可以绘制任何喜欢的形状。完成绘制后,Sketch将平滑曲线并简化你创建的路径。

#如何从SVG代码添加形状#

你可以通过将SVG代码复制并粘贴到画布上的任意位置来创建新的形状图层。

二、编辑形状

#如何编辑形状的检查#

选择形状后,你会在检查器中看到用于编辑该形状的选项。例如,星形可以让你调整其半径和点数。

#如何编辑角半径#

单击圆角矩形以在检查器中调整其角半径。

你可以在“圆角”和“平滑圆角”之间进行选择,以更改图层角的绘制方式。光滑的角具有曲率连续性,可让你创建“原型”形状(Apple在其界面中使用的形状)。

提示:在矢量编辑模式下,你可以选择单个角点来调整单个角的半径。

#如何翻转形状#

你可以使用检查器中的两个按钮来水平或垂直翻转形状。除非你将形状拼合并使用“ 图层”>“结合”>“拼合”提交更改,否则这些按钮将保持选中状态(因此你可以再次单击以撤消更改)。

#如何旋转形状#

有几种方法可以在Sketch中旋转形状。

你可以在检查器中输入以度为单位的值。这可以是正值或负值,分别用于顺时针或逆时针旋转。

或者,选择形状并单击工具栏中的“旋转”按钮。然后单击并拖动到形状外部的任何位置以旋转它。

要更改形状旋转的轴,只需单击十字准线并将其中心拖动到要旋转的点。要重置此设置,只需重新选择形状即可。

最后,你可以通过按住⌘command并拖动其选择手柄之一来快速旋转选择的任何形状。

按住shift旋转形状时即可以15°为增量进行操作。

你可以提交这些更改,并通过拼合形状(“ 图层”>“结合”>“拼合”)将旋转值重置为0° 。

#如何编辑形状的矢量编辑模式#

要在矢量编辑模式下编辑形状,请双击它,或选择它并按Enter键。

当你进入矢量编辑模式,你会看到圆形点连接在一起的路径。单击任何圆形点并将其拖动以更改图层的形状。

要添加新点,请将鼠标悬停在两个点之间的路径上,然后单击以插入。要删除一个点,请选择它,然后按Backspace/delete键。

形状上不同点之间的路径可以是直线或曲线,具体取决于连接它们的点的类型。双击连接直线路径的点,将其更改为弯曲路径。

更改点以创建弯曲路径时,可以使用出现的两个控制柄控制点来编辑曲线本身。

拼合形状(通过选择“ 图层”>“结合”>“拼合”)将在曲线的每一端创建点。

#如何编辑形状使用变换工具#

要使用“变换”工具,请选择一个或多个形状,然后转到“ 图层”>“变换”>“变换”。或者,你可以使用键盘command + shift+ T。你也可以通过“ 视图”>“自定义工具栏...”将“变换”工具添加到工具栏中。

变换工具可将点添加到形状的每个角以及每个角之间的点。单击一个点并将其拖动以变换和倾斜你的形状。

如果单击并拖动两个角之间的点,则将同时移动两个角。

单击并拖动某个角点时,对角将同时沿相反方向移动。要仅控制一个角,请按住command。

#如何编辑形状使用剪刀工具#

你可以使用剪刀工具从形状中切除路径。为此,请选择要编辑的形状,通过“ 图层”>“路径”>“剪刀”启用该工具(也可以通过“ 视图”>“自定义工具栏...”将其添加到工具栏中),然后单击构成形状的任何路径删除它们。

完成后,单击形状外部或按Enter或Esc。

#如何编辑形状与旋转复制工具#

旋转副本采用单个形状,并将其副本绕单个点旋转。要使用它,请选择一种形状,然后转到“ 图层”>“路径”>“旋转副本”(你也可以通过“ 视图”>“自定义工具栏...”将其添加到工具栏的按钮)。在此处,选择要创建的副本数量,然后单击确定。

使用显示的手柄来精确设置副本的放置位置。完成后,按Esc或Enter。

注意:在Sketch 53.1和更早版本中,“旋转副本”将创建副本的复合形状(就像布尔运算一样)。要将其变成单独的图层,请使用“ 图层”>“合并”>“分开”。

三、布尔运算

在Sketch中,可以使用四个布尔运算来组合和创建复杂的形状。选择两个或多个形状,然后单击工具栏中的布尔操作按钮。

联集创建的形状是多个形状的面积之和。

减去顶层从其下方的形状中删除形状的区域。

交集从选定形状重叠的区域创建形状。

差集从原始形状不重叠的区域创建形状。与“交集”相反。

你也可以从触摸栏访问布尔操作按钮。

布尔运算从顶层开始应用。因此,如果要在较大的圆内绘制较小的圆并应用减法运算,则会创建一个甜甜圈形状。

#组合形状#

当你对两个或多个形状应用布尔运算时,Sketch会将原始形状组合到一个新的组合形状组中。

使用组合形状,布尔运算是非破坏性的,因此你可以随时编辑原始形状并更改结果。你甚至可以使用新的布尔运算将两个或多个组合的形状组合在一起。

#如何编辑组合形状在图层列表#

你可以像在“图层列表”中的普通组一样展开组合的形状。执行此操作时,你将看到构成组合形状的所有不同形状以及应用于它们的不同布尔运算。

通过单击形状旁边的布尔操作图标,可以更改应用于该图层的布尔操作。

要隐藏组合形状中的任何原始形状,请在“层列表”中单击小眼睛,然后选择“ 隐藏层”(或使用⌘+ ⇧+ H)。这将改变你组合的形状在“画布”中的显示方式。

你还可以通过将一个形状图层拖到另一层上来在“图层列表”中创建组合形状。默认情况下,这将应用联集布尔操作。

四、形状蒙版

在Sketch中创建蒙版的方法有几种,但是它们都遵循相同的规则:Sketch将使用“图层列表”中最低的形状作为蒙版。

#如何创建一个轮廓蒙版#

轮廓蒙版仅显示属于其形状的一层或多层的一部分。有几种创建它们的方法。

在画布上选择一个形状,然后选择“ 图层”>“蒙版”>“设作蒙版”。或者,你可以按住Control键单击形状,然后选择“ 蒙版”。

创建蒙版时,Sketch会将图标添加到“图层列表”中其上方的任何图层,以显示它们正受到蒙版的影响。如果在蒙版上拖动另一层,它也会受到影响。

如果要将对象放置在蒙版层上方,但又不想将其包含在蒙版中,请选择它,然后选择“ 图层”>“蒙版”>“忽略底层蒙版”。

你还可以将蒙版图层和蒙版本身进行分组,以便不影响该组之外的任何内容。

如果同时选择多个图层,则可以通过选择“ 图层”>“蒙版”>“将选中形状用作蒙版”一次将它们全部蒙版。这会将你选择的“图层列表”底部的形状用作遮罩,并自动将它们全部分组。

当你选择了多个图层时,按住Control键并单击并选择“ 蒙版”,其效果与具有“将选中形状用作蒙版”的效果相同。

在蒙版组中选择一个图层,然后选择“ 图层”>“蒙版”>“忽略底层蒙版”会将其保留在组中,但不会受到蒙版的影响。

#如何创建Alpha蒙版#

Sketch中的Alpha蒙版会隐藏任何超出其形状的内容,并控制要蒙版的任何图层的不透明度。

要创建Alpha蒙版,请像平常一样创建轮廓蒙版,然后选择它并选择“图层”>“蒙版”>“蒙版模式”>“ Alpha蒙版”。

前往蒙版层的“填充”检查器,并确保其具有渐变填充。值得注意的是,Sketch会在渐变中寻找Alpha(而不是颜色)来控制Alpha蒙版设置。