Sketch从入门到精通-Sketch3布尔运算

 

在Sketch里面,如果你发现一些基本的图形都不适合你,你想组合或者用更多的图形时,这时候就离不开布尔运算。当然,如果钢笔工具用的熟练的话,用钢笔工具也可以画出自己想要的复杂图形,但有些时候我们其实可以通过拆分合并等方式也可以创造出你想要的更多图形。

在Sketch里面,有四种布尔运算,分别是合并形状(Union),减去顶层形状 (Subtract),与形状区域相交 (Intersect),排除重叠形状 (Difference)。

 

clip_image001

1. 合并形状: 两个矢量元素合并成为一个整体,相当于加起来的总和。

2. 减去顶层形状: 上面的图层矢量区域会从下面的矢量区域减去。

3. 与形状区域相交:两个矢量元素相交的时候,只会留下中间交集的部分。

4. 排除重叠形状: 这个会把重叠的部分去掉,只会保留重叠之外的区域。

在Sketch里面,这几种布尔运算都显示在工具栏里,你会很容易找到他们,如下图,工具栏上右上角的四个蓝色符号就是布尔运算的四种形式:

clip_image003

而且当你进行布尔运算的时候,左边图层区域也会有变化,比如我先做一个简单的合并形状,我先画一个圆,然后在圆的上方在画一个五角星,居中对齐,选择布尔运算的第一种合并形状,然后看下图右侧图层里面的变化:

clip_image005

进行布尔运算后,左边的图层自动把圆和五角星分成两个图层,而且五角星的右侧有两个小方块重叠,其实就是工具栏里的第一种布尔运算,它会显示在图层里,当你进行布尔运算的时候。

这样有个好处就是,即使你已经进行布尔运算的情况下,仍然可以改动图层里的原图形,你可以随意修改后在合并,非常的方便又规范。看吧,我用一个圆和一个五角星,通过四种不同的布尔运算,就可以得到下面的四种形式(如下图),当然我都是很简单的图形,为了大家明白,你们可以练习的时候,自己画一些复杂的图形,来用用布尔运算,开开脑洞。

clip_image007

原创文章,作者:ioued,如若转载,请注明出处:https://www.iamue.com/7393/

(0)
iouedioued
上一篇 2015-07-20
下一篇 2015-07-20

相关推荐

  • Sketch从入门到精通-Sketch3 颜色填充

    颜色在做设计中是重要又必不缺少的组成部分,颜色有很多变化,丰富的颜色变化会给你的设计加分,Sketch里边,就对颜色有各种填充的效果,下面具体介绍一下,Sketch里边一共有六种填充效果,虽然你平常只用一两种,…

    2015-07-29
  • Sketch从入门到精通 怎样切图及导出图片尺寸 免费版

    怎样切图及导出图片尺寸 在讲这一章之前,先把上一章提到的布尔运算给大家讲一下(如下图) 这是顶部工具栏区域的一小部分。布尔运算有四种形式,你可以根据你的需求来选择不同的方式。 合并形状 (Union):合并的结果…

    2015-07-03
  • UE网出品:Sketch从入门到精通[免费精品课程] | 阿西UED&Smiler

    Sketch从入门到精通  讲师:阿西UED Smiler 参加时间:2015年6月24日 17:40 最后更新:2015年6月24日 17:40 适用人群: UI设计师、美工、视觉设计师、 对UI有兴趣的人。 简介 Sketch从入门到精通是由www.iamue.com …

    2015-06-25
  • 使用 Sketch 搭建动态布局

    如果你在设计交互,你可能会经常遇到一些重复性的元素,比如列表中的行,或者网格化元素。尽管Sketch提供了一些方法,通过使用Symbols将一些样式应用到元素中,但如果你想让布局更有适应性或者动态变化,它恐怕就很…

    2017-12-28
  • Sketch从入门到精通-Sketch3四种模糊方式

    现在经常能看到界面上各种模糊效果,或者是背景模糊,然后上面排字,放图片;通常是做背景的时候用到的模糊效果。在Sketch里面就有基本的四种模糊方式,分别介绍一下。 首先是最常见的高斯模糊(Gaussian Blur),…

    2015-08-03
  • Sketch汉化插件: SketchI18N 一键汉化

    推广:五丰 美仑达 赣南脐橙 【国家地理标志产品】供港央企品质保障,原产地直采,进口专业分选设备,品质始终如一,脆嫩香甜,味美多汁 SketchI18N SketchI18N is multi-language plugin for Sketch.app Language …

    2017-03-16
  • sketch 3.6.1(破解版涵盖3.0以上版本) 安装and使用指南(20160303更新)

     截至2015  6月23 日  SKetch 常用版本  3.2.2 、 3.3.1 、3.3.2    3.4.4 截至2016 3月2日  常用版本 3.5.1 ,3.5.2  ,3.6.0  3.6.1 Sketch 安装指南 安装版本 : 3.2.2  3.3.1  3.3.2 安装环境:mac book pro 20…

    2016-04-13
  • Sketch从入门到精通 第一章 初识Sketch 免费版

    第一章 初识Sketch 1. Sketch 是什么? Sketch 是一款非常适合UI界面设计师们使用的矢量绘图应用。集合了PS和AI的优点,很容易上手使用。它可以很方便的进行网页,图标及移动端界面的设计制作和切图。 2. 为什么要…

    2015-07-03
  • Mirror镜像的运用- Sketch从入门到精通

    Mirror镜像这个只针对于设计手机界面的同学来说,比较有用。因为这是一个可以电脑做图和手机显示同步的一个功能。在Sketch的工具栏,你会发现这个Mirror,如下图: 看见了么?怎么样能实现和手机同步呢?首先你要在…

    2015-07-13
  • Sketch3.9 终于发布了原生的响应式设计解决方案

    Sketch3.9 终于发布了原生的响应式设计解决方案。

    只需要设置一个属性,便可以快速实现任意尺寸的适配。

    2016-06-27