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

怎样切图及导出图片尺寸

在讲这一章之前，先把上一章提到的布尔运算给大家讲一下(如下图)

这是顶部工具栏区域的一小部分。布尔运算有四种形式，你可以根据你的需求来选择不同的方式。

合并形状 (Union)：合并的结果是会得到两个矢量区域的总和。

减去顶层形状 (Subtract)：这一项的结果是顶层矢量的区域会从下一层的图形上移去。

与形状区域相交 (Intersect)：与形状区域相交的结果是会保留原图形重叠的部分。

排除重叠形状 (Difference)：排除重叠形状的结果是只保留原图形不重叠的部分，它是“与形状区域相交”这一运算的反向。相当于AI里面的相加，相减，合并，交集，是不是更容易理解一些。在图层中，图标也可以用布尔运算(如下图)也是同样的四种形式，使你更好的创作图标。

切图及导出

切图是在做Web设计和APP设计中比较常用，你想把你做的效果图，可以在手机上或者网站实现出来，就需要给程序员们切图文件，这时就需要在Sketch里面切图。举个例子，首先，我先建一个画板，

然后在画板里画一个圆，

现在我想把这个圆在sketch里单独切出来然后导出，怎么做呢？看下图

首先选中这个圆，然后按住快捷键S单击，就会看见选中的圆边缘出现了一个边框，然后注意观察左侧图层区和右侧检查器，会发现分别多了一个带切刀的框(就是切片)和切好的圆。右边的检查器的圆单独变成了一个，这说明图已经切好了。

接下来把切好的图导出成想要的倍数给程序员们。如下图，点击检查器里的中间的那个Export右侧的小加号，就自动出现1x,2x,3x的图，默认是png格式的，一般都要背景是透明的图，所以要导出PNG格式的，然后这时点击工具栏里的Export(也就是导出)

­­

就会出现下图的界面，你刚刚要导出的圆已经选好，然后点击蓝色按钮，Export就导出成功了。

怎么样？是不是很简单？

(给大家布置个作业，大家可以练习一下。自己在Sketch里，先新建一个画板，然后画一个矩形，和一个三角形，分别导出来。矩形个三角形在工具栏里，直接可以拖出来，我会截个图，找不到的小伙伴可以看一下。就在工具栏里第一个带框的加号，英文是Insert)。