Android 屏幕适配不完全梳理

Android系统由于其开源性质，碎片化问题一直被人诟病。今天想梳理一下自己这些日子下来总结的屏幕适配的经验。恩，开始了。

• 屏幕尺寸，分辨率
• 基本概念（dp,dip,sp,px,dpi）
• 图片放入mdpi,hdpi,xhdpi,xxhdpi,xxxdpi文件夹的正确姿势
• 书写布局文件时候需要注意什么
• 开源的屏幕适配解决方案

屏幕尺寸，分辨率

我们先来看一张图（数据来自友盟2016年8月）

分辨率.png

图中我们看到，排名前六的机型分辨率占到了九成以上的市场，因此适配他们基本就可以了。分别是：

1. 1280 x 720
2. 1920 X 1080
3. 854 x 480
4. 960 x 540
5. 800 x 480
6. 1184 x 720

随着时间的推移，屏幕分辨率会越来越高，低分辨率屏手机市场份额会逐年递减。

屏幕尺寸：指屏幕对角线的长度。单位是英寸，1英寸=2.54厘米。平时我们说的几寸屏就是对角线的长度。

基本概念（dp,dip,sp,px,dpi）

这边我把他们分成三类

1. px
2. dpi
3. dp,dip,sp

px:1个像素点，我们平常说这个手机分辨率1280 x 720，就是屏幕上有1280 乘以 720个像素点。

dpi:屏幕像素密度的单位。上面说到一英尺是2.52cm对吧，dpi的概念就是一英尺就这个2.54cm里面包含多少个像素点。

dp == dip
dip全拼：Density Independent Pixels（密度无关像素）的缩写。

他们之间的关系可以用这个公式表示：px = dp * (dpi / 160)

sp:Google推荐些字体大小的时候用sp，概念和dp完全一样。（Android设置里面可以改字体大小，你用了sp就会有效果）

图片放入mdpi,hdpi,xhdpi,xxhdpi,xxxdpi文件夹的正确姿势

一般公司都会给两套图来做图片适配。然后我们公司UI妹子给的两套图就是适配ios那边的两套图。原型图是iPhone5的1136x640分辨率的。之后生成的一倍图与两倍图，然后丢了过来。然后我就斯巴达了，因为图片如果用wrap_content的话，要么太大要么太小，然后我每次就估摸着自己摸索是多少dp,也还算能凑合过去。一次写底部导航栏的时候，radiobutton在xml里面是不能设置图片大小的只能在代码中改。我其实当时内心是哟欧草泥马奔腾的。为了让这些个草泥马不奔腾，我觉得去找UI妹子要图。

先看张图

dpi.png

手机的像素密度不同就会去加载对应文件夹下面的图片。那要是没有怎么办，放心他会自动去找最相近文件夹下面的同名图片，不过会有那么一点变化，不是加载其图片真实大小，而是经过一定比例的缩放，我们来看一下这个比例是多少：

mdpi：hdpi：xhdpi：xxhdpi：xxxhdpi=2：3：4：6：8 的尺寸比例进行缩放。

假设我的手机是1280 x 720分辨率,经过计算我应该去xhdpi文件夹下面找图片资源，丫的没有，去xxhdpi里面一找，发现有了。是一张120px x 120px的图片，那么好我们换算一下 120 x（2/3）= 80 px，也就是我其实加载到内存里面是进行2/3倍的缩放的，同理放大也是一样的。不过这边提到一点，低分辨率图片放大会失真，建议放正确分辨率的图片到高分辨图片文件夹中，这样会避免失真的烦恼。

总结（根据主流分辨率）：

hdpi 对应 854 x 480 960 x 540 800 x 480
xhdpi 对应 1280 x 720 1184 x 720
xxhdpi 对应 1920 X 1080

基本上我要的两套图我就丢 xhdoi xxhdpi里面。

接着上面那个梗，最后和ui妹子给出了个方案原型图是750*1334，输出两套图，两倍于三倍图。虽然不是最理想的（最理想就是720 x 1280就给我这个机型切出来的大小，但是一个公司就一个UI妹子，所以折中了一下），不过相差不是很大了，能接受了。这边提供一个链接，说的挺不错。

点我，切图就要这么切

书写布局文件时候需要注意什么

使用wrap_content、match_parent、weight，dp，sp这是官方给出的方案，的确有道理。我写布局就是尽量用权重，其实原来就是百分比布局。

不过还是有一些坑的，例如：

1. dp写布局要小心一点，因为在同分辨率不同尺寸下的手机里面出来效果是不一样的，Android机子还真有这种情况。
2. 关于sp，说实话从内心来讲我是拒绝的，因为啊，在设置中改变字体大小，调最大，我了个去，你会发现自己写的好好的布局显现出来超级难看，不忍直视。虽然官方是推荐sp，但是我内心还是向往dp的（项目中还是sp,习惯了，毕竟少有闲人去调整字体大小，真改了，我呵呵）
3. 在你的UI给你一些不那么正常图的时候（分辨率乱来），wrap_content写imageview控件就有那么点风险了。

最终结论就是一句话：原型图是750*1334的，2x与3x图分别丢到xhdpi与xxhdpi里面去就OK了。（原型图出来就是2x图，3x的分辨率是2x的1.5倍）

开源的屏幕适配解决方案

屏幕适配终结者，百分比适配。

鸿洋的解决方案，直接接入

参考

凯子哥

鸿洋

stormzhang