它们看起来是居中对齐的，但实际上并不是，右边箭头形状的按钮中的文字在物理上并未居中对齐，它距离左右两边的边距是不一样的，这种形状的按钮文字必须靠左一些才能看起来对齐。

　　说完了水平居中，垂直居中也有非常多的细节要注意。这里告诉大家一个东西，对于大部分操作系统而言或者说较为成熟的设计语言而言，垂直居中必定以按钮文字的首一位大写字母的高度开始算起，但在 Sketch 中，所有的文字都会默认地带上行距，所以在制作文字按钮时，无论是中文还是英文，一定要注意调整行距，这样才能做到你所需要的垂直居中。

　　以次为排列原则基本上都会让文字(以首位大写字母算起)上下边距相等。大家都这样做的原因是在英文里面，有升部的字母(而大写字母的高度与升部字母的高度大体相似)(l,t,d,b,k,h)要多于有降部的字母(y,j,g,p)。

　　虽然我们不常用英文，但是多知道一些小常识没有坏处。

　　说完了文字按钮，再来说说 icon 按钮，相信这个问题你也经常看到过。看看下图，哪一个按钮看起来对齐得比较好?

　　好吧，希望你能够看出来左边那颗按钮是有问题的，实际上我在画这枚按钮的时候确实点了对齐，但是为什么还会出问题呢?跟文字按钮对齐一样，对齐的方式选错了。一般来说，我们都会默认将飞机当做是一个正方形来进行对齐，但由于图形形状的缘故，这样做必然是错的，将会导致 icon 过于靠左。

　　右边侧那枚按钮看起来就是对的，面对这种特殊的，带角的形状，一定要保证每个角距离按钮边缘的距离是一样的，而这种对齐的方式不能再将 icon 当做是一颗正方形来看。

　　这就不能依赖 Sketch 的对齐工具了，你要自己画个圆形作为参考线来进行对齐。

　　如下图，播放按钮也有三个角，那么做它的对齐工作也要注意啦。左边图那枚按钮就是直接点对齐的产物，看起来非常奇怪，对吧?

　　记住了，有角的 icon 要保证对齐的唯一方式是保证三个角到对应边的距离相等。

　　记住这些点

　　边缘有角的图形要拉长一些才能在视觉上与方形边缘的长度对齐。

　　制作文字按钮时一定要记得调整行距。

　　有角 icon 的对齐方法是保证每个角到边的距离相等。

　　三.视觉圆角

　　圆角也有细节?不是设置一下就好了么?当然不是，一个简简单单的圆角也有很丰富的细节。我们前面说过了，眼睛看到的东西并不能尽信，先来看看下面五个圆并尝试回答哪个圆最圆。

　　我问过了很多人，大部分的回答都是 3 和 4 比较圆。第一个圆有点瘦，而第五个又有点胖，都不是很圆。还是学上面用到的套路，我们把 3 和 4 叠起来看。实际上 3 号是一个正圆形，而 4 号圆被做胖了一点点，并不是一个正圆，不过也正因如此，很多人会认为 4 才是一个正圆。

　　这里存在一个现象，经过一点点修改(变胖)的圆对于人的肉眼来说会比正圆更像正圆，这句话有点拗口，但是就是这个道理。看看下图，左手边的圆是一个正圆，右手边的圆是一个经过修改的圆，你瞧瞧是不是这个感觉。

　　那么我们又该如何利用这种无法规避的错觉呢?利用这一点最常见的地方就是圆角啦，而最著名的实例当然就是在 iOS 里面最常见的圆角了。

　　我们常用的几款设计软件，Sketch、PS、Ai 提供的圆角设置用的是非常直接的计算，就是用一个物理正圆来计算你要的圆角，我们上面说到，人眼不会认为正圆是正圆，所以这也是你无法在 Sketch 直接画出 iOS 圆角的最大原因。