越来越多的人开始用Sketch进行UI设计，Sketch作为一款非常容易上手的软件，很多人完全可以依靠自学便能熟练掌握这款软件，但是大部分人都只是掌握Sketch的基本实用方法，对于一些实用的小技巧，了解的并不是特别多。

从今天开始，我将向大家介绍Sketch的一系列实用小技巧，这些小技巧能帮助大家更好的使用Sketch，提升工作效率。

这是该系列教程的第二篇——灵活运用描边属性。

本教程的第一篇：http://www.jianshu.com/p/109aac030ded

在进行UI设计时，经常会遇到需要设计圆形进度条的情况，特别是给数据类APP或者Apple Watch进行设计时。一般情况下，我们可以使用布尔运算或者钢笔工具绘制出来，但是通过灵活运用描边属性也同样可以绘制出相同的形状，如�下图所示，可以看到圆弧本质上是一个描边。

具体的绘制方法如下：

1

使用快捷键R创建一个尺寸为800×800的正方形，然后去掉描边，并将填充色设置为#000000，作为背景，如下图所示。

2

使用快捷键O并按住shift键绘制一个400×400的圆，去掉填充，然后将描边宽度设置为30px，并将描边颜色设置为#D18F09，不透明度设置为20%，接着将该圆形图层完全居中于背景，如图所示。

3

选中该圆形图层，使用快捷键command+D进行复制，确保复制的图层和原图层完全重叠，且在原图层的上方，然后将新复制图层的不透明度调整为100%，如图所示。

4

此步非常关键！单击Borders右侧的齿轮图标，在出现的设置窗口中，将描边结束和间断点的形状设置为如下图所示的参数，然后在第1个输入框填写数字1，第2个输入框填写数字1256，1256是通过3.14×400得出。可以看到描边变成一个圆点。在第2个输入框的数字代表描边点的间隔，这个数字取决于圆的大小，若此处圆形图层的尺寸为500×500px，则应输入为3.14×500，这个数值应大于等于这个圆圈的周长。

5

为了让弧形的增长是顺时针方向，选中设置好的图层后，单击检查器Transform中Flip处的水平翻转按钮，将该图层水平翻转，如图所示。

6

再次打开描边设置，选中第1个输入框Dash后按住shift键，并按下键盘的上箭头，可以看到数值以10的倍数增加，这里数字的增加也同时让弧形增加，等长度合适后停止。当然也可以直接输入数值，这里的数值可以理解为整个圆圈周长的一部分，如图所示。

7

到此已经完成设计，若要添加渐变效果，单击描边填充设置为渐变即可，如图所示。

这是对描边属性灵活运用的一个例子，我们在日常设计中，一定要善于对形状进行分析重组，即使面对教程，也一定要明白，要设计出某一形状的方法一定不止一种。

对于上面第4步，输入框中大家有看到我直接进行的乘法运算，Sketch的输入框可以直接进行简单的四则运算，关于这部分的知识，我会在后续的文章中提到，敬请关注。