（转）android屏幕知识

不少设计师和工程师都被安卓设备纷繁的屏幕搞得晕头转向&＃xff0c;我既做UI设计&＃xff0c;也做过一点安卓界面布局&＃xff0c;刚好对这块内容比较熟悉&＃xff0c;也曾在公司内部做过相关的讲座&＃xff0c;在此&＃xff0c;我将此部分知识重新梳理出来分享给大家&＃xff01;

1、了解几个概念

&＃xff08;1&＃xff09;分辨率。分辨率就是手机屏幕的像素点数&＃xff0c;一般描述成屏幕的“宽×高”&＃xff0c;安卓手机屏幕常见的分辨率有480×800、720×1280、1080×1920等。720×1280表示此屏幕在宽度方向有720个像素&＃xff0c;在高度方向有1280个像素。

&＃xff08;2&＃xff09;屏幕大小。屏幕大小是手机对角线的物理尺寸&＃xff0c;以英寸&＃xff08;inch&＃xff09;为单位。比如某某手机为“5寸大屏手机”&＃xff0c;就是指对角线的尺寸&＃xff0c;5寸×2.54厘米/寸&＃61;12.7厘米。

&＃xff08;3&＃xff09;密度&＃xff08;dpi&＃xff0c;dots per inch&＃xff1b;或PPI&＃xff0c;pixels per inch&＃xff09;。从英文顾名思义&＃xff0c;就是每英寸的像素点数&＃xff0c;数值越高当然显示越细腻。假如我们知道一部手机的分辨率是1080×1920&＃xff0c;屏幕大小是5英寸&＃xff0c;你能否算出此屏幕的密度呢&＃xff1f;哈哈&＃xff0c;中学的勾股定理派上用场啦&＃xff01;通过宽1080和高1920&＃xff0c;根据勾股定理&＃xff0c;我们得出对角线的像素数大约是2203&＃xff0c;那么用2203除以5就是此屏幕的密度了&＃xff0c;计算结果是440。440dpi的屏幕已经相当细腻了。

2、实际密度与系统密度

尚未发现他处使用“实际密度”和“系统密度”这两个词汇&＃xff0c;暂时由我如此定义吧。

“实际密度”就是我们自己算出来的密度&＃xff0c;这个密度代表了屏幕真实的细腻程度&＃xff0c;如上述例子中的440dpi就是实际密度&＃xff0c;说明这块屏幕每寸有440个像素。5英寸1080×1920的屏幕密度是440&＃xff0c;而相同分辨率的4.5英寸屏幕密度是490。如此看来&＃xff0c;屏幕密度将会出现很多数值&＃xff0c;呈现严重的碎片化。而密度又是安卓屏幕将界面进行缩放显示的依据&＃xff0c;那么安卓是如何适配这么多屏幕的呢&＃xff1f;

其实&＃xff0c;每部安卓手机屏幕都有一个初始的固定密度&＃xff0c;这些数值是120、160、240、320、480&＃xff0c;我们权且称为“系统密度”。大家发现规律没有&＃xff1f;相隔数值之间是2倍的关系。一般情况下&＃xff0c;240×320的屏幕是低密度120dpi&＃xff0c;即ldpi&＃xff1b;320×480的屏幕是中密度160dpi&＃xff0c;即mdpi&＃xff1b;480×800的屏幕是高密度240dpi&＃xff0c;即hdpi&＃xff1b;720×1280的屏幕是超高密度320dpi&＃xff0c;即xhdpi&＃xff1b;1080×1920的屏幕是超超高密度480dpi&＃xff0c;即xxhdpi。

安卓对界面元素进行缩放的比例依据正是系统密度&＃xff0c;而不是实际密度。

3、一个重要的单位dp

dp也可写为dip&＃xff0c;即density-independent pixel。你可以想象dp更类似一个物理尺寸&＃xff0c;比如一张宽和高均为100dp的图片在320×480和480×800的手机上“看起来”一样大。而实际上&＃xff0c;它们的像素值并不一样。dp正是这样一个尺寸&＃xff0c;不管这个屏幕的密度是多少&＃xff0c;屏幕上相同dp大小的元素看起来始终差不多大。

另外&＃xff0c;文字尺寸使用sp&＃xff0c;即scale-independentpixel的缩写&＃xff0c;这样&＃xff0c;当你在系统设置里调节字号大小时&＃xff0c;应用中的文字也会随之变大变小。

4、dp与px的转换

在安卓中&＃xff0c;系统密度为160dpi的中密度手机屏幕为基准屏幕&＃xff0c;即320×480的手机屏幕。在这个屏幕中&＃xff0c;1dp&＃61;1px。

100dp在320×480&＃xff08;mdpi&＃xff0c;160dpi&＃xff09;中是100px。那么100dp在480×800&＃xff08;hdpi&＃xff0c;240dpi&＃xff09;的手机上是多少px呢&＃xff1f;我们知道100dp在两个手机上看起来差不多大&＃xff0c;根据160与240的比例关系&＃xff0c;我们可以知道&＃xff0c;在480×800中&＃xff0c;100dp实际覆盖了150px。因此&＃xff0c;如果你为mdpi手机提供了一张100px的图片&＃xff0c;这张图片在hdpi手机上就会拉伸至150px&＃xff0c;但是他们都是100dp。

中密度和高密度的缩放比例似乎可以不通过160dpi和240dpi计算&＃xff0c;而通过320px和480px也可以算出。但是按照宽度计算缩放比例不适用于超高密度xhdpi和超超高密度xxhdpi了。即720×1280中1dp是多少px呢&＃xff1f;如果用720/320&＃xff0c;你会得出1dp&＃61;2.25px&＃xff0c;实际这样算出来是不对的。dp与px的换算要以系统密度为准&＃xff0c;720×1280的系统密度为320&＃xff0c;320×480的系统密度为160&＃xff0c;320/160&＃61;2&＃xff0c;那么在720×1280中&＃xff0c;1dp&＃61;2px。同理&＃xff0c;在1080×1920中&＃xff0c;1dp&＃61;3px。

大家可以记住下面这个比例&＃xff0c;dp与px的换算就十分easy啦&＃xff01;

ldpi:mdpi:hdpi:xhdpi:xxhdpi&＃61;3:4:6:8:12&＃xff0c;我们发现&＃xff0c;相隔数字之间还是2倍的关系。计算的时候&＃xff0c;以mdpi为基准。比如在720×1280&＃xff08;xhdpi&＃xff09;中&＃xff0c;1dp等于多少px呢&＃xff1f;mdpi是4&＃xff0c;xhdpi是8&＃xff0c;2倍的关系&＃xff0c;即1dp&＃61;2px。反着计算更重要&＃xff0c;比如你用PhotoShop在720×1280的画布中制作了界面效果图&＃xff0c;两个元素的间距是20px&＃xff0c;那要标注多少dp呢&＃xff1f;2倍的关系&＃xff0c;那就是10dp&＃xff01;

当安卓系统字号设为“普通”时&＃xff0c;sp与px的尺寸换算和dp与px是一样的。比如某个文字大小在720×1280的PS画布中是24px&＃xff0c;那么告诉工程师&＃xff0c;这个文字大小是12sp。

5、建议在xdhpi中作图

安卓手机有这么多屏幕&＃xff0c;我到底依据哪种屏幕作图呢&＃xff1f;没有必要为不同密度的手机都提供一套素材&＃xff0c;大部分情况下&＃xff0c;一套就够了。

现在手机比较高的分辨率是1080×1920&＃xff0c;你可以选择这个尺寸作图&＃xff0c;但是图片素材将会增大应用安装包的大小。并且尺寸越大的图片占用的内存也就越高。如果你不是设计ROM&＃xff0c;而是做一款应用&＃xff0c;我建议大家用PS在720×1280的画布中作图。这个尺寸兼顾了美观性、经济性和计算的简单。美观性是指&＃xff0c;以这个尺寸做出来的应用&＃xff0c;在720×1280中显示完美&＃xff0c;在1080×1920中看起来也比较清晰&＃xff1b;经济性是指&＃xff0c;这个分辨率下导出的图片尺寸适中&＃xff0c;内存消耗不会过高&＃xff0c;并且图片文件大小适中&＃xff0c;安装包也不会过大&＃xff1b;计算的简单&＃xff0c;就是1dp&＃61;2px啊&＃xff0c;多好计算啊&＃xff01;

做出来的图片&＃xff0c;记着让界面工程师放进drawable-xhdpi的资源文件夹中。

6、屏幕的宽高差异

在720×1280中作图&＃xff0c;要考虑向下兼容不同的屏幕。通过计算我们可以知道&＃xff0c;320×480和480×800的屏幕宽度都是320dp&＃xff0c;而720×1280和1080×1920的屏幕宽度都是360dp。它们之间有40dp的差距&＃xff0c;这40dp在设计中影响还是很大的。如下图蝴蝶图片距离屏幕的左右边距在320dp宽的屏幕和360dp宽的屏幕中就不一样。

不仅宽度上有差异&＃xff0c;高度上的差异更加明显。对于天气等工具类应用&＃xff0c;由于界面一般是独占式的&＃xff0c;更要考虑屏幕之间的比例差异。

如果想消除这些比例差异&＃xff0c;可以通过添加布局文件来实现。一般情况下&＃xff0c;布局文件放在layout文件夹中&＃xff0c;如果要单独对360dp的屏幕进行调整&＃xff0c;你可以单做做一个布局文件放在layout-w360dp中&＃xff1b;不过&＃xff0c;最好是默认针对360dp的屏幕布局&＃xff08;较为主流&＃xff09;&＃xff0c;然后对320dp的屏幕单独布局&＃xff0c;将布局文件放到layout-w320dp中&＃xff1b;如果你想对某个特殊的分辨率进行调整&＃xff0c;那么你可以将布局文件放在标有分辨率的文件夹中&＃xff0c;如layout-854×480。

7、几个资源的文件夹

在720×1280中做了图片&＃xff0c;要让开发人员放到drawable-xhdpi的资源文件夹中&＃xff0c;这样才可以显示正确。个人认为仅提供一套素材就可以了&＃xff0c;可以测试一下应用在低端手机上运行是否流畅&＃xff0c;如果比较卡顿&＃xff0c;可以根据需要提供部分mdpi的图片素材&＃xff0c;因为xhdpi中的图片运行在mdpi的手机上会比较占内存。

以应用图标为例&＃xff0c;xhdpi中的图标大小是96px&＃xff0c;如果要单独给mdpi提供图标&＃xff0c;那么这个图标大小是48px&＃xff0c;放到drawable-mdpi的资源文件夹中。各个资源文件夹中的图片尺寸同样符合ldpi:mdpi:hdpi:xhdpi:xxhdpi&＃61;3:4:6:8:12的规律。

如果你把一个高2px的分割线素材做成了9.png图片&＃xff0c;你想让细线在不同密度中都是2px&＃xff0c;而不被安卓根据密度进行缩放&＃xff0c;怎么办&＃xff1f;你可以把这个分割线素材放到drawable-nodpi中&＃xff0c;这个资源文件夹中的图片&＃xff0c;将按照实际像素大小进行显示&＃xff0c;而不会被安卓根据密度进行缩放。即在mdpi中细线是2px&＃xff08;2dp&＃xff09;&＃xff0c;在xhdpi中细线是2px&＃xff08;1dp&＃xff09;。

以上是对安卓屏幕的初步总结&＃xff0c;不知道你看完后是豁然开朗&＃xff0c;还是一头雾水&＃xff1f;这篇文章主要为了实用起见&＃xff0c;避开了过多深入的分析&＃xff0c;如果你还有什么疑问&＃xff0c;可以留言。

最后补充一下&＃xff0c;不少朋友问我安卓平板的设计&＃xff0c;提到最多的是1280×800的分辨率&＃xff0c;这个分辨率的平板一般是10.1寸的中密度屏幕&＃xff0c;直接在PS中建立1280×800的画布&＃xff0c;提取之后的素材让开发放到drawable-mdpi中即可。并且中密度的平板中&＃xff0c;1dp&＃61;1px&＃xff0c;比较好换算单位。