有质感的应用界面

    程序逻辑要严谨，界面效果也要细腻。有时候设计给出设计图，明明很好看的，程序出来却很生硬。因为我们忽略了太多的细节。

    细节一：线条

    有的设计图很好看，是因为它的线条是阴影画的。如果程序里线条只是粗暴的用一个像素来展开，效果肯定不一样。下图，我把导航栏定义为一个纯白色的View，给它添加阴影效果。数值设置包括了阴影颜色、透明度、扩散程度。如果设计非常专业，能给我们提供准确的数值那非常舒服。不行的话我们也可以自己来调，成品就会很细腻，甚至别人不知道我们写的程序有什么不一样的，就是好看些。

    说到线条，模块之间的分割线是，模块的边线也是。同下同，每一个格子的边缘不使用像素来画线，阴影的效果非常好。这个时候要额外关注阴影的方向了，导航里面的阴影偏移(0,1)，格子的阴影便宜是(0,0)。

    另外：不是所有时候都用阴影替代线条，像iOS系统自带的Cell的分割线就非常自然，但它不是纯粹的1个像素。（控件的最小操作尺寸是1pt，无法再小）那么我们可以用API提供的绘图方法来绘制不足1像素的线条，因为不同语言和平台实现起来千差万别就不上代码了。

    细节二：边距

    不要盲目相信设计的标尺图。作为iOS开发应该适当了解一下苹果的设计规范Human Interface Guildeline，作为Android开发也应该了解一下Material Design，Web开发等等同样亦然。设计只有一份，在安卓端和苹果端程序出来的效果不可能是同步的，一定程度上坚守设计规范，稍稍改变一些规范推荐的元素，能帮助设计变得更自然，完整。

    同样是上图，返回按钮左边距是16pt，下面文本的排列也跟随16pt，右面的icon边距也是16pt，每个模块的左右边距同样是16pt，我觉得就比较自然。      

    补坑：设计也有忙或粗心的时候，图标切的不规范，没有对齐，这时候就要程序自己用屏幕放大镜来对比像素差距了。用程序逻辑补上这个差距，完美产品生产的最后关卡一直由程序员掌握。

    细节三：层次

    设计可能跟别人解析设计意图，但不一定跟“无趣”的程序解析自己的设计。如果我们不能分辨设计图里面的层次并且在代码级别去实现，我们就无法还原效果图的感觉。

    下图双层控件的实现逻辑是制作小页卡作为一个控件，同一层分选中和未选中两个图层，每个图层对应一层阴影。一层选项的下方还要添加一个纯色遮挡的图层再盖一个偏移上方的阴影，细节才会体现出来。这一层阴影会遮挡选中的图层下方，逻辑中这部分是不需要阴影的？那么这个选中的图层移动到最上方。

    除此之外，我们还要关注每个页卡的排列和遮挡关系，相信只要注意到这些细节，实现起来并不会难倒逻辑能力爆表的程序员。

    细节四：间距

    大量出现的底部标签栏，你是单纯的平分区域再放置图标文本的吗？可能用下面的效果会更佳。

    布局逻辑1：( 屏幕宽度 - 控件宽度 * 个数 ) / (个数+1) = 空白区域宽度

    布局逻辑2：屏幕宽度 / ( 个数 + 1 )  *  控件序号 = 控件中心点 [其中序号从0开始]