[31→100]Android界面开发精要1：尺寸

界面依附于具体的运行设备，更准确说是一块有一块的屏幕，所以我们首先要弄清屏幕有哪些特性。

Android设备通用型号一栏表

这里面有2个核心概念：

1. 屏幕的物理尺寸，也即是通常说的屏幕大小（Screen Size），用屏幕对角线长度来表示，单位是英寸（"），比如图中3.7"、4.0"、3.2"等

2. 屏幕分辨率（Resolution），表示屏幕有多精细，单位是像素（px），比如图中480*800、1280*720等。

3. 这两个值相除，产生了一个新的概念屏幕密度（Screen Density），即单位长度像素点数，单位是 像素/英寸(dpi)。

以小米4为例，屏幕size = 4.6英寸（2.25英寸*4英寸），1080*1920像素。
所以，屏幕密度为 480 = 1080/2.25 = 1920/4。

由于Android的开放性，运行它的设备大小和分辨率并不一样，如果采用px作为基础的计算单位，在不同设备上的视觉效果是不一致的。比如，同样一个300px*100px的矩形，在480*800的手机上很显眼，而在1920*1080上可能就只是一点点了。所以我们面临了界面开发的经典问题——适配

怎么适配——使用DP

为了方便开发人员适配，Android提出了一个新的概念独立像素单位dp（Density-independent pixel），代替原来的像素单位px。dp与屏幕密度挂钩。Android规定：

在一个屏幕密度为160的设备上，1dp=1px。

此后，随着屏幕密度的变化，dp保持等比缩放。即

1dp = （当前设备的屏幕密度/160) px
1px = （160/当前设备的屏幕密度）dp

由dp这个概念，Android规定了一系列的标准屏幕尺寸：

• ldpi：屏幕密度为120。
• mdpi：屏幕密度为160。
• hdpi：屏幕密度为240。
• xhdpi：屏幕密度为320。
• xxhdpi：屏幕密度为480。
• xxxhdpi：屏幕密度为640。
• tvdpi：屏幕密度为213。

除了这些标准尺寸外，也可自定义其它屏幕密度，包括Google Nexus系列都采用了一些非标准尺寸，比如420dpi、560dpi。

Android常用设备dpi列表

在Android代码DisplayMetrics类中，也为这些常用dpi做了定义：

public static final int DENSITY_280 = 280;
public static final int DENSITY_360 = 360;
public static final int DENSITY_400 = 400;
public static final int DENSITY_420 = 420;
public static final int DENSITY_560 = 560;
public static final int DENSITY_DEFAULT = 160;
public static final int DENSITY_HIGH = 240;
public static final int DENSITY_LOW = 120;
public static final int DENSITY_MEDIUM = 160;
public static final int DENSITY_TV = 213;
public static final int DENSITY_XHIGH = 320;
public static final int DENSITY_XXHIGH = 480;
public static final int DENSITY_XXXHIGH = 640;

DP是一个好的解决方案吗？

在实际开发，设计人员提供的视觉设计图，视觉工具从图上直接取到的像素px，直接采用dp机制，意味着开发人员需要不断地将px转成dp，这工作量大、繁琐、重复。所以对于开发人员而言，更好的机制是利用dimension机制，将dp映射为设计图的px值。如下：

    
    0.50dp
    1.00dp
    1.50dp
    2.00dp
    ……
    358.00dp
    358.50dp
    359.00dp
    359.50dp
    360.00dp
    
    0.50dp
    1.00dp
    1.50dp
    2.00dp
    ……
    638.50dp
    639.00dp
    639.50dp
    640.00dp
    
    0.50sp
    1.00sp
    1.50sp
    2.00sp
    ……
    43.50sp
    44.00sp
    44.50sp
    45.00sp

这样，对界面绘制人员而言，只需要将图片上的px直接写在就可以了，节省了很多重复计算的时间。

怎么制作这样px映射表呢？

1. 确定UI设计基于什么样的分辨率？比如640*1136（这是iPhone5的分辨率）;
2. 确定目标适配的Android尺寸？比如720*1289;
3. 确定dimens的dpi，常用dpi如下：

ldpi：屏幕密度为120。
mdpi：屏幕密度为160。
hdpi：屏幕密度为240。
xhdpi：屏幕密度为320。
xxhdpi：屏幕密度为480。
xxxhdpi：屏幕密度为640。
tvdpi：屏幕密度为213。

4. 执行Python代码：

#!/usr/bin/env python
# -*- coding: utf-8 -*-

import csv
import os
import re
import sys
import zipfile
import xml.etree.ElementTree as ElementTree

'''自动生成相应的dimens.xml文件'''
if __name__ == '__main__':
    # print "srcipt：", sys.argv[0]
    # for i in range(1, len(sys.argv)):
    #     print "argv[", i , "] = ", sys.argv[i]

    # 原型界面提供的尺寸
    uiWidth = 640;
    uiHeight = 1136;

    # 目标设备尺寸，即目标机型界面
    desWidth = 720
    desHeight = 1280

    # 目标屏幕密度
        # ldpi：屏幕密度为120。
        # mdpi：屏幕密度为160。
        # hdpi：屏幕密度为240。
        # xhdpi：屏幕密度为320。
        # xxhdpi：屏幕密度为480。
        # xxxhdpi：屏幕密度为640。
        # tvdpi：屏幕密度为213。
    density = 320

    print " "

    ratio = 1.0*desWidth/uiWidth
    # 输出合理的dimens.xml文件
    for i in range(uiWidth):
        j = i + 1
        # print "%.2fdp" % (desWidth, desHeight, j, 1.0 * j * density)
        print "%.2fdp" % (j, 1.0 * j * ratio * 160/density)

    for i in range(uiHeight):
        j = i + 1
        # print "%.2fdp" % (desWidth, desHeight, j, 1.0 * j * density)
        print "%.2fdp" % (j, 1.0 * j * ratio * 160/density)

    for i in range(90):
        j = i + 1
        # print "%.2fsp" % (desWidth, desHeight, j, 1.0 * j * density)
        print "%.2fsp" % (j, 1.0 * j * ratio * 160/density)

Panda
2016-05-26