android UI 适配小节

一、   像素密度表

• 像素密度表

• 比如UE 给了三张切图分别对应:

mdpi，     xhdpi，     xxdpi

10 * 10,     20 * 20,     30 * 30

上面的值都是px，那么，可以将图片分别放在res/下的对应文件夹中，并在布局文件中为使用到到该图片的地方定义为高宽为10dp(或wrap_content)，则系统在运行时，会根据当前设备的屏幕像素密度值从对应的文件夹下取图片，例如xhdpi时，就会取20*20的图片。

• UI 高宽值设定

有时感觉很恐慌，似乎 mdpi，xhdpi， xxdpi三种屏幕都要适配，其实不然。在AS中，选中一种用来的布局的模拟器屏幕，比如：Nexus 5 （5.0 , 1080 X 1920，xxhdpi）,拿到三张图后，分别丢到三个对应的文件夹下，然后注意到xxhdpi的图片为30px，所以在指定具体的高宽值时，指定为10dp（xxhdpi下，1dp=3px）值即可，其它可以放心忽略；如果你不放心，在回头检查下会发现，xhdpi下，10dp=20px,这是正好系统取xhdpi文件下的图片，它的高宽值也正好适合。

• 一个血的教训

某天晚上，在适配一个UI时，UE给了我两套图，分别是对应放大三倍 (96 X 96)、和放大两倍(64 X 64),我拿到图后，直接将其丢在了xxxhdpi、xxhdpi两个文件下，然后取Nexus 5 （5.0 , 1080 X 1920）模拟器预览，使用wrap_content参数进行指定控件的高宽值，发现图片远远不及屏幕宽度的1/10（96/1080）,而使用直接指定为96px和32dp时都差不多，不管我怎么折腾都是这样的效果，结果就吃到了公司提供的加班夜宵和享受了公司的加班免费打车服务；外加，半夜回去的郁闷了一个晚上。结果第二天早上，资深的同事到来后，一咨询，立马解决问题：

解决步骤：

　　1，       将放大两倍(64 X 64)的图片挪到了xhdpi文件夹下；

　　2，       将放大三倍(96 X 96)的图片挪到了xxhdpi文件夹下；

　　3，       在布局控件中指定高和宽分别为32dp；

　　4，       再一次使用Nexus 5 （5.0 , 1080 X 1920）模拟器预览，

果然和预期中的一模一样。

然后我带着一脸的懵逼，一愣一愣的听大牛说问题的原因：

　　1，没有注意到Nexus 5模拟器的像素密度为xxdpi；

　　2，没理解xhdpi和xxhdpi下的1dp=2dx和1dp=3dx的事实，所以放大三倍的应该是放在xxhdpi文件下，同理放大两倍放在xhdpi下。

　　3，出现使用wrap_content参数时为什么不到1/10？因为那时选中的是xxhdpi文件夹下的图片64*64，当然不到。

　　4，出现使用96px和32dp时为什么就符合预期呢？xxhdpi下，1dp=3px,96px=32dp,这是系统发现xxhdpi文件夹下的图片为64X64,主动把图片拉升以满足我指定的大小，然后我在一次在真机上运行，果然，图片失真了。

二、  常见的屏幕类别

• 4:3

VGA     640*480 (Video Graphics Array)

QVGA  320*240 (Quarter VGA)

HVGA  480*320 (Half-size VGA)

SVGA  800*600 (Super VGA)

• 5:3

WVGA  800*480 (Wide VGA)

• 16:9

FWVGA 854*480 (Full Wide VGA)

HD        1920*1080 High Definition

QHD     960*540

720p    1280*720  标清

1080p  1920*1080 高清

三、记住

• 屏幕大小和屏幕的像素密度没有任何关系，并不能从一个设备的屏幕分辨率区分出它的具体像素密度值。