Android-屏幕适配解决方案总结

Android 屏幕适配总结.png

为什么要进行Android屏幕适配

• 由于Android系统的开放性，很多开发者、厂商、都可以对Android手机进行定制。于是就有了很多基于Google原生系统定制的小米的MIUI、魅族的flyme、华为的EMUI等等
• Android 机型屏幕尺寸多样化 类似 2.4、2.8、3.5、3.7、4.2、5.0、5.5、6.0等
• Android 机型屏幕分辨率多样化 类似 480x800, 480x854, 540x960, 720x1280, 1080x1920等

定义 & 本质

• 一个页面，在不同尺寸，不同分辨率的手机上显示的效果或者比例相同。
• 个人认为本质就是页面的布局、布局控件、图片、字体等根据屏幕的尺寸不同而进行相对的显示。

Android屏幕适配中一些用到的相关概念

屏幕尺寸

• 手机屏幕对角线的物理尺寸
• 单位：英寸（inch），1英寸=2.54cm

屏幕分辨率

• 手机在横向、纵向上的像素点数总和
• 屏幕分辨率是指屏幕显示的分辨率。屏幕分辨率确定计算机屏幕上显示多少信息的设置，以水平和垂直像素来衡量。屏幕分辨率低时（例如 640 x 480），在屏幕上显示的像素少，但尺寸比较大。屏幕分辨率高时（例如 1600 x 1200），在屏幕上显示的像素多，但尺寸比较小。
  显示分辨率就是屏幕上显示的像素个数，分辨率160×128的意思是水平方向含有像素数为160个，垂直方向像素数128个。屏幕尺寸一样的情况下，分辨率越高，显示效果就越精细和细腻。
• 单位：px（pixel），1px=1像素点

UI设计师的设计图会以px作为统一的计量单位

dp ： device independent pixels

• 在android系统中单位DP也就是DIP：device independent pixels(设备独立像素).【注:为了和sp统一，dip=dp】
• 其实dp就是为了使得开发者设置的长度能够根据不同屏幕(分辨率/尺寸也就是dpi)获得不同的像素(px)数量。比如：我将一个控件设置长度为1dp，那么在160dpi上该控件长度为1px，在240dpi的屏幕上该控件的长度为1*240/160=1.5个像素点
• 也就是dp会随着不同屏幕而改变控件长度的像素数量
• dp最终都要化为像素数量来衡量大小的，因为只有像素数量最直观
• 与设备上的实际物理像素点无关

dpi（Dots Per Inch） 屏幕像素密度

• 每英寸内的像素点数

例如某设备一英寸内有480像素点，那么这个设备的屏幕像素密度就是480dpi

• 安卓手机对于每类手机屏幕大小都有一个相应的屏幕像素密度

密度类型	代表的分辨率（px）	屏幕像素密度（dpi）
低密度（ldpi）	240x320	120
中密度（mdpi）	320x480	160
高密度（hdpi）	480x800	240
超高密度（xhdpi）	720x1280	320
超超高密度（xxhdpi）	1080x1920	480

屏幕尺寸、分辨率、像素密度三者关系

• 一部手机的分辨率是宽x高，屏幕大小是以寸为单位，那么三者的关系是：

  
  
  

• dp与px之间的相互转换

UI设计都是用px来进行标注的，Android 开发的时候用的是pd作为计量单位，所以这其中需要进行转换。
在Android中，规定以160dpi（即屏幕分辨率为320x480）为基准：1dp=1px

密度类型	代表的分辨率（px）	屏幕像素密度（dpi）	换算（px/dp）	比例
低密度（ldpi）	240x320	120	1dp=0.75px	3
中密度（mdpi）	320x480	160	1dp=1px	4
高密度（hdpi）	480x800	240	1dp=1.5px	6
超高密度（xhdpi）	720x1280	320	1dp=2px	8
超超高密度（xxhdpi）	1080x1920	480	1dp=3px	12

sp (scale-independent pixel)独立比例像素

• 但它会按用户首选的文本尺寸进行缩放（属于缩放无关像素）
• 设置字体的时候大多用 sp
• 字体会随着用户手机设置的字体而改变

用布局进行屏幕适配

让布局元素自适应屏幕

• 1、在使用布局的时候尽量使用相对布局（RelativeLayout） ，禁用绝对布局（AbsoluteLayout）
• 2、根据需求灵活选择使用线性布局（LinearLayout）、帧布局（FrameLayout）、相对布局（RelativeLayout）

根据设备屏幕的大小自动加载相应布局文件

1、尺寸（size）限定符 适用于3.2之前的版本

• 通过配置限定符使得程序在运行时根据当前设备的配置（屏幕尺寸）自动加载合适的布局资源

2、最小宽度（Smallest-width：缩写 sw***dp）限定符 适用于 3.2版本以及后面的版本

通过指定某个最小宽度（以 dp 为单位）来精确定位屏幕从而加载不同的UI资源

• sw xxxdp，即small width的缩写，其不区分方向，即无论是宽度还是高度，只要大于 xxxdp，就采用次此布局
• 例子：使用了layout-sw 600dp的最小宽度限定符，即无论是宽度还是高度，只要大于600dp，就采用layout-sw 600dp目录下的布局

这中间会有文件名重复的问题，为了解决这种问题考虑用 布局别名

• 适配手机的单面板（默认）布局：res/layout/main.xml
• 适配尺寸>7寸平板的双面板布局：res/layout/main_twopanes.xml
• 然后加入以下两个文件，以便进行Android 3.2前和Android 3.2后的版本双面板布局适配：
• 1、res/values-large/layout.xml（Android 3.2之前的双面板布局）

 @layout/main_twopanes

• 2、res/values-sw600dp/layout.xml（Android 3.2及之后的双面板布局）

@layout/main_twopanes

注：

最后两个文件有着相同的内容，但是它们并没有真正去定义布局，它们仅仅只是将main设置成了@layout/main_twopa> nes的别名
由于这些文件包含 large 和 sw600dp 选择器，因此，系统会将此文件匹配到不同版本的>7寸平板上：
a. 版本低于 3.2 的平板会匹配 large的文件
b. 版本高于 3.2 的平板会匹配 sw600dp的文件

屏幕特征	限定符	描述
大小	samall	提供给小屏幕适配的资源(小于3英寸)
大小	normal	提供给中等屏幕设备的资源小于4英寸左右
大小	large	提供给大屏幕设备的资源4英寸-7英寸
大小	xlarge	提供给超大屏幕设备的资源(7-10英寸
分辨率	ldpi	低分辨率设备（120dpi一下）
分辨率	mdpi	中等（120dpi一160dpi）
分辨率	hdpi	高（160dpi一240dpi）
分辨率	hdpi	高（160dpi一240dpi）
分辨率	xhdpi	超高（240dpi一320dpi）
分辨率	xxhdpi	超超高（320dpi一480dpi）
分辨率	xxxhdpi	超超超高480dpi以上,一般都是640dpi
方向	land	横屏
方向	port	竖屏
分辨率	sw***dp	大于*宽度加载此资源

3、屏幕方向（Orientation）限定符

• 根据设备的屏幕放心不同进行布局的调整

• 小屏幕, 竖屏: 单面板
• 小屏幕, 横屏: 单面板
• 7 英寸平板电脑，纵向：单面板，带操作栏
• 7 英寸平板电脑，横向：双面板，宽，带操作栏
• 10 英寸平板电脑，纵向：双面板，窄，带操作栏
• 10 英寸平板电脑，横向：双面板，宽，带操作栏
• 电视，横向：双面板，宽，带操作栏

类似上面这些多样化的屏幕适配应该怎样做呢

• 先定义类别：单/双面板、是否带操作栏、宽/窄

定义在 res/layout/ 目录下的某个 XML 文件中

• 再进行相应的匹配：屏幕尺寸（小屏、7寸、10寸）、方向（横、纵）

使用布局别名进行匹配

用布局组件进行适配 （就是使得布局中的组件根据屏幕可以自适应大小）

• 使用"wrap_content"、"match_parent"和"weight“来控制视图组件的宽度和高度

• "wrap_content"
  相应视图的宽和高就会被设定成所需的最小尺寸以适应视图中的内容
• "match_parent"(在Android API 8之前叫作"fill_parent")
  视图的宽和高延伸至充满整个父布局
• "weight"
  1.定义：是线性布局（Linelayout）的一个独特比例分配属性
  2.作用：使用此属性设置权重，然后按照比例对界面进行空间的分配，公式计算是：控件宽度=控件设置宽度+剩余空间所占百分比宽幅
  具体可以参考这篇文章，讲解得非常详细

图片资源 进行屏幕适配

• 使用自动拉伸位图（nine-patch图片），后缀名是.9.png，它是一种被特殊处理过的PNG图片，设计时可以指定图片的拉伸区域和非拉伸区域；使用时，系统就会根据控件的大小自动地拉伸你想要拉伸的部分

1.必须要使用.9.png后缀名，因为系统就是根据这个来区别nine-patch图片和普通的PNG图片的；
2.当你需要在一个控件中使用nine-patch图片时,如
android:background="@drawable/button"系统就会根据控件的大小自动地拉伸你想要拉伸的部分

用户界面流程 进行屏幕适配

只要就是根据用户当时的屏幕设置进行适配，横竖屏切换，或者“单面板”模式还是“双面板”模式

屏幕密度适配

布局控件 适配

• 1、使用密度无关像素dp或者独立比例像素sp
• 2、即根据不同屏幕密度，控件选择对应的像素值大小

屏幕宽度和像素密度没有任何关联关系
介绍一种百分比适配屏幕的方法，类似web前端的 来自鸿阳大神的Android屏幕适配方案

图片资源 适配

• 为了让图片资源在不同屏幕密度上显示相同的像素效果，可以一套分辨率一套位图资源
  但是这样会使得apk的包占的很大，也为UI人员增加很大工作量。不建议这么做 。

更好地方案解决“图片资源”适配问题

• 根据Android 加载资源过程 让UI提供一套你需要支持的最合适dpi分辨率规格的图片资源，目前建议选择xhdpi
  因为 xhdpi手机需求最旺盛，而且 iPhone大部分主流dpi是320所以 UI可以且一套两边共用。