一个优秀的手机软件，不仅要有精巧的功能，流畅的速度，让人赏心悦目的UI也往往是用户选择的重要理由。作为移动产品的PM，也需要了解一些在UI设计中的基本知识。

1. px和pt，一对好伙伴

在视觉设计中，我们经常会见到以下两个单位： px和磅数pt。

Px ，是英文单词pixel的缩写，意为像素。在设计领域中，像素是用来计算数码影像的一种单位。计算机中显示的图像并非连续的线条组成，而是由许多肉眼看不见的小点组成。如果把把影像放大数倍，会发现这些连续色调其实是由许多色彩相近的小点所组成，这些小点就是构成影像的最小单位“像素”。由于是最小的独立显示单位，px均为整数，不会出现0.5px的情况。

图一 看这个色彩鲜艳的LED灯（原图大小）

图二 你能想象这才是他的本来面目吗？（放大之后）

Pt，则是point的缩写，一般音译为磅数，也有人直译为点数，请大家自行转换。这是使用在印刷领域的单位，一磅等于1/72英寸。在国际上一般会用pt作为字体的单位。

一般情况下，设计师们采用px来进行标注设计图中的图形，用pt来标注文字。在过去很多年的视觉设计中，px和pt的配合堪称天衣无缝，把PC打扮得花枝招展，堪称史上最佳配合的好伙伴。

2. 那些年，我们一起追过的Android

在突如其来的移动互联网时代，px和pt的配合变得不那么和谐。原因就在于Android携众高矮不一，胖瘦各异的爱妃来到世人面前，给他们化妆就变成横看成岭侧成峰，远近高低各不同了。

由于Google对Android的开放政策，使得所有厂商都可以加入到智能手机的研发中来。于是乎，Android手机一时间百花齐放，出现了各种不同的手机样式。比如：

表一 Android分辨率规格（宽*高）：

240*320 320*240 320*480 480*800 480*854 640*960 720*1280，……还有平板

图三 Android屏幕物理尺寸规格

屏幕物理尺寸3.2、3.5、3.75、4.0、4.3、5.0、7、9.3、10.1

为了更好的描述这种多样化引发的问题，我们需要引入一个新的概念density，也就是密度。它指的是在一定尺寸的物理屏幕上显示像素的数量，一般使用dpi(dots per inch，每英寸像素数)作为单位。比如一台分辨率为240x320，屏幕物理尺寸为1.5英寸x2英寸的手机，他的密度可以用分辨率/尺寸，240/1.5或者320/2，密度为160dpi。对于用户来说，密度越大的屏幕显示效果越精细，因为每英寸显示的像素数量更多。

如果是要使用px和pt给程序贴图，假设生成了一条240px的直线，在240*320的屏幕上刚好可以铺满，而放到480x800的分辨率下才刚刚到一半的位置。

如果要解决这样的问题，那么程序在实现的时候就必须为每个分辨率都写一个配置，否则就会出现图形在低密度的屏幕上显示的更大，而在高密度的屏幕上显示的更小。最麻烦的事情在于，一旦出现新的分辨率，所有程序都没办法直接运行了。这明显不符合手机快速发展的客观规律。

3. 新的搭档，dp和sp

为了解决这个问题，Google为Android引入了一套新的单位dp和sp。

首先登场的是dp，Density Independent Pixel，可以翻译为密度无关像素。和px相比，dp在不同密度的屏幕中实际显示比例将保持一致。根据规定，一个dp相当于160dpi屏幕中的一个px。在320dpi的屏幕中，一个dp相当于2个px。通过这样的成比例放缩，Android解决了需要多个不同屏幕中的大小显示问题。

为了便于对多屏幕进行管理，Android对屏幕密度做了重新的规定，将密度与分辨率绑定起来，如下表

表二 Android屏幕密度

具体而言，当屏幕的的分辨率为320x480时，无论实际的物理尺寸大小，密度都会被设置为160dpi，也就意味着这个设备上，一行最多可以放置320dp，而对于480x800的设备，只需屏幕尺寸在3寸到4.3寸之间，密度都会被设置为240dpi，一行同样可以放置320dp。

因此在开发中，用dp作为单位，只需要设置一次，就可以适配到多个屏幕上。

同样，sp，scaled pixels，这个单位也采用了和dp同样的设计理念，将需要独立设置的pt转化为可以自动适配的sp，从而解决了文字的优化显示。

4. 设计的疑惑

既然android提供了这么方便的适配机制，设计师的效果图也如此惊艳，为什么最后实现出来的效果经常会让人大跌眼镜，列表的高度不对，文字的大小不对。原因何在呢？

原因也正好出现在设计和实现的单位转换上。

设计师在设计的过程中，一般仍然采用了px和pt作为标注单位。根据目前的主流分辨率和发展趋势来看，我们将480x800定义为设计图的基准版本。通过查询上边的密度对应表，我们可以看到在这个分辨率下1dp=1.5px。

举例而言，19px的线条，转化成dp，应该使用19px/1.5= 12.67，由于dp无法支持小数点，所以一般会增加0.5dp，再四舍五入，变为13dp。当他显示到屏幕中的时候，仍然会对应成为真实的像素13dp*1.5=19.5，最终显示将会变为20px。这样的差异可能会体现在软件的各个地方，在每一个px都是体验问题的时代，就变得让人难以接受了。

看看下表的对应关系

表三 dp、sp在屏幕中的实际显示效果（480x800分辨率下测得）

第一列是在android程序中使用的dp/sp单位，第二列是sp实际生成的文字的pt大小，第三列是dp根据密度定义推算出的理论大小，第四列是dp理论大小和实际显示大小的差距，第五列是dp在手机屏幕上实际显示的大小。（以上数值都是在480x800的分辨率下测得）

从图中不难看出，许多在ps中可以轻易实现的线条长度和字体大小在Android的实际显示中无法正确展示。

5. 启示和疑问

对于PM和UI设计来说，我们关注的是在Android平台的开发中，如何保证设计效果被良好的实现。这里提供两个解决方案：

1. 使用320x480作为基础分辨率，因为密度和Android定义的标准设备密度一致，均为160dpi。视觉设计图上的元素可以和屏幕显示一一对应，最大程度保障了设计效果和实现的一致性。缺陷是在适配高分辨率时，需要再出一套高分辨率切图，工作量较大。同时在高分辨率机型上，由于显示不准确仍然需要调整。

2. 使用480x800作为基础分辨率。在设计元素尺寸和间距时，采用系统可以显示的长度和文字大小，从而保证实现时的RD反复调试，但是找不到合适大小的尴尬局面。同时，高分辨率资源可以在低分辨率上自动压缩复用，需要调整的元素相对较少。

Google目前对Android采取的开放式政策，让它的发展势头如火如荼，机型种类众多。但是高速发展中，为开发者埋下无数的隐忧。除了文中分析的显示错位的问题，还有包括像双卡双待，系统数据库字段修改等问题，也很容易引发程序出现各类奇怪的bug。这也提醒Android产品的设计师和PM注意，需要经常切换各种手机试用，发现其中的问题。

最后，存留有一个疑问，笔者尚未能得到答案。Android在修正0.5像素无法显示的问题时采用的修正值非常奇怪，并且没有发现明显的规律。如有同学清楚，望不吝赐教。