UI设计的淘气鬼，你们别跳哦~

对于刚入UI设计不久的设计师们，应该有一些会被关于UI设计中px、pt、dp、sp、dpi这些概念气到，那今天就由小泥来和大家一起收服它们吧！

首先看一张手机配置信息的图：

拉出来这张图就是为了介绍英寸，分辨率，这两个数据，这两个数据属于手机出厂就设定好的数据，所以才让后来的界面设计有对应的设计规范。

1英寸（inch）=2.54cm，屏幕的尺寸就是屏幕对角线的长度了。

然后有了英寸和分辨率这两个“既定”数值，屏幕的密度也就可以用①式得到了（以5.0英寸为例）：

公式①：手机屏幕密度：（dpi或ppi）

这样得到的屏幕密度对界面设计就太有用了，先说在android开发中，非文字的尺寸单位用的是dp（Density-independent pixels），使用的文字大小的单位是sp（Scale-independent pixels），但是我们在设计稿中用的单位一般会是非文字的px和文字的pt。 要想设计和开发在最后的界面效果上保持一致，就需要公式②来搭建桥梁：

公式②：   非文字单位：dp *ppi/160=px       文字单位：sp * ppi/160=pt

所以就很好理解dpi的作用了，如果是对于320ppi的屏幕， 1sp x 320ppi/160 = 2px，如果是对于480ppi的屏幕，1sp*480ppi/160=3px。这样就找到了设计人员在界面设计中可以使用的规范了。

对于为什么是除以160的疑问，在这里也解释一下：Android Design 里把主流设备的 dpi 归成了四个档次，120 dpi、160 dpi、240 dpi、320 dpi。实际开发当中，经常需要对这几个尺寸进行相互转换（比如先在某个分辨率下完成设计，然后缩放到其他尺寸微调后输出），一般按照 dpi 之间的比例即 2:1.5:1:0.75(320dpi:240dpi:160dpi:120dpi)来给界面中的元素来进行尺寸定义。也就是说如果以 160 dpi 为基准的话，只要尺寸的 DP 是 4 的倍数，XHDPI 下乘以 2，HDPI 下乘以 1.5，LDPI 下乘以 0.75 即可满足所有尺寸下都是整数 px 。

但若以 240 dpi 作为标准，需要 DP 是 3 的倍数，XHDPI 下乘以 1.333，MDPI 下乘以 0.666 ，LDPI 下除以 2。其他的就更不合适了，所以就选定了160dpi做基准。

那我们就进行下一步探索吧，为什么要用dp和sp代替设计时用的px和pt呐？原因是他们不会因为屏幕ppi的变化而变化（在经过公式②的运算以后ppi作为运算单位被抵消），这样出来的设计稿在相同物理尺寸和不同ppi下，他们呈现的高度大小是相同。也就是说更接近物理呈现。

说了这么多原理问题，我们针对android做界面设计具体需要怎么执行规范才能和开发更好对接呐？

在这里提供一张Android的分辨率的模式图：（密度名称、密度数值、屏幕分辨率）

当运行在xhdpi模式下时，1dp*320dpi/160dpi=2px ：也就是说设计师在PS里定义一个item高96px，开发就会定义该item高48dp ；

看完上面的介绍，如果你是做一款应用的话，建议用PS在720×1280的画布中作图。以这个尺寸做出来的应用，在720×1280中显示完美，在1080×1920中看起来也比较清晰；而且这个分辨率下导出的图片尺寸适中，内存消耗不会过高，并且图片文件大小适中，安装包也不会过大；计算更是简单，就是1dp=2px。做出来的图片，让界面工程师放进drawable-xhdpi的资源文件夹中就阔以啦（各个资源文件夹中的图片尺寸符合ldpi:mdpi:hdpi:xhdpi:xxhdpi=3:4:6:8:12的规律。）

就剩最后一块内容了，就是切图的问题了，

我们很多时候做APP切图都会有两套，一套是Android的，一套是IOS的。这里先整理一下在Android开发中一些有利于开发的资源图片命名规则。

前缀：是一种简单记忆、节约成本的纯文本标记语言，使用前缀能快速知道切图是用作那一组件类别，好的前缀也无非就以下几种：

一般情况下，所切的图片用于哪个位置、哪个组件，就需要加上这些来命名（紧跟前缀），这样一来，就很清楚切图作用了：

后缀：一般是来表示切图的颜色、透明度、状态等信息

一般就是前缀+位置用途+再加后缀的形式啦。

今天的分享就到这里吧，祝愿和我一样有一个想成为UI设计师梦想的小伙伴们都能够坚持到底，实现梦想鸭~

很久没来了，最近忙着找实习和工作，码字不易，支持就点个赞吧~