Android中的屏幕适配

一、屏幕适配的个人理解

                跌跌撞撞也好，摸爬滚打也罢。在Android编程圈子中也徘徊一年有余。对于较多基础概念并不十分清楚，现在是时候回到更贴近底层的地方去的时候了。

            Android系统的硬件覆盖电子产品的方方面面，这也是硬件屏幕多样化，形成Android碎片化重要原因。碎片化是一个难题，但并不表示，Android程序开发就不必做兼容考虑。所以，屏幕适配成为其中很重要的环节。

           在市面上依旧没有一劳永逸，一次适配所有的绝佳方案。但是，我们可以应用现有的技术手段能够将我们App适用对象优化到更好，逐渐靠近百分百。通过不断地创新与优化，找到最后的解决途径。以下，将来聊聊实际中的适配处理。

1，适配中的核心关键词

           dpi：像素密度比，是指在固定的物理长度下的像素数量。【dot per inch】

           dp[dip]：屏幕无关像素，不是物理长度，也不是像素点。只有在具体的像素密度比下，可以转换为像素。dp*dpi = px；一款手机已经定制成功，像素密度比确定，dp也确定。

           屏幕分辨率：屏幕高和宽的像素数。分辨率类型大致有：1920*1080（xxh）;1280*720（xh）;960*540，800*400，854*480（h）;480*320（m）;240*320（l）;

          low:medium:high:extra-high:extra-extra-high=3:4:6:8:12，即是：ldpi:mdpi:hdpi:xhdpi:xxhdpi=3:4:6:8:12。



不同像素密度下合理展示图标大小：



2，适配的理解

         适配的理解就是在程序运行的时候，程序在不同硬件上能够展示如设计那样的效果。

        不适配的情形有：带文字的控件宽度不够，文字展示不全；图标，Bar，按钮过小或者过大。

个人理解，需要做好Android系统硬件的适配，需要分为两个方面：

        （1）同一分辨率下，不同屏幕大小【手机 -- IPad -- 电视】；

        （2）同一屏幕尺寸下，不同屏幕分辨率。

         对于第一种情形，处理的更多方式是直接另起一个APP，其内置展示页面以及业务逻辑，因为屏幕之间巨大的差异，已经发生了质的变化，甚至可以说是不同的APP。

         手机本身也存在多种尺寸，但因为其相差不是很大，屏幕长宽的比例依旧保持相差不大。也归纳到同一屏幕尺寸下，不同分辨率的适配。

         当然，在同一APP中，也能够实现屏幕尺寸发生巨大差异的处理。其维护及实现复杂度相比于再开启一个APP的代价似乎更大。有这个方面的兴趣，可以更多研究。Android屏幕适配经验谈
值得你拥有。&_& &_& &_& 当然，这个Android屏幕适配全攻略
也匹配的上更多的深研。

         以下，将实现以“同一”硬件尺寸下的Android系统硬件适配。

二、屏幕适配的方法

1，布局方面

          多使用LinearLayout，RelativeLayout，不使用绝对布局（现在已经过时）；

2，控件属性

          多使用match_parent/wrap_content；可使用dp/sp，不使用px（Android Studio中已经有提醒）；

3，权重

          在长度/宽度为0dp时，使用layout_weight，垂直/水平根据权重分割父控件的对应高度/宽度。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="@+id/desc_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="布局适配"
android:textSize="26sp" />
<!--布局适配-->
<EditText
android:id="@+id/body_et"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/desc_1" />

<Button
android:id="@+id/body_ensure"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="@+id/body_et"
android:text="确认"
android:textSize="26sp" />

<Button
android:id="@+id/body_search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/body_et"
android:layout_toLeftOf="@+id/body_ensure"
android:text="搜索"
android:textSize="26sp" />

<View
android:id="@+id/divider"
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_below="@+id/body_search"
android:background="@color/red" />

<!--单位适配-->
<TextView
android:id="@+id/desc_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/divider"
android:text="单位适配"
android:textSize="26sp" />

<Button
android:id="@+id/bt1"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_below="@+id/desc_2"
android:text="dp"
android:textSize="26sp" />

<Button
android:layout_width="200px"
android:layout_height="wrap_content"
android:layout_below="@+id/desc_2"
android:layout_toRightOf="@+id/bt1"
android:text="px"
android:textSize="26sp" />

<!--权重适配-->
<View
android:id="@+id/divider2"
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_below="@+id/bt1"
android:background="@color/red" />

<TextView
android:id="@+id/desc_3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/divider2"
android:text="权重适配"
android:textSize="26sp" />

<LinearLayout
android:id="@+id/ll_1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/desc_3"
android:orientation="horizontal">

<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="横向权重： 1 "
android:textSize="26sp" />

<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="横向权重： 1"
android:textSize="26sp" />
</LinearLayout>
<!--权重适配-->
<View
android:id="@+id/divider3"
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_below="@+id/ll_1"
android:background="@color/red" />

<LinearLayout
android:id="@+id/ll_2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/divider3"
android:orientation="vertical">

<Button
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="纵向权重： 1"
android:textSize="26sp" />

<Button
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:text="纵向权重： 1"
android:textSize="26sp" />
</LinearLayout>

<View
android:id="@+id/divider4"
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_below="@+id/ll_2"
android:background="@color/red" />

</RelativeLayout>          适配效果：
布局适配：



整体适配效果：



单位适配：



4，使用硬件单位化

         将手机屏幕虚拟的的划分成为固定的份数，以320*480为例，生成对应分辨率资源文件。

public class MakeXml {
private final static String rootPath = "C:\\Users\\Administrator\\Desktop\\layoutroot\\values-{0}x{1}\\";

private final static float dw = 320f;
private final static float dh = 480f;

private final static String WTemplate = "<dimen name=\"x{0}\">{1}px</dimen>\n";
private final static String HTemplate = "<dimen name=\"y{0}\">{1}px</dimen>\n";

public static void main(String[] args) {
makeString(320, 480);
makeString(480, 800);
makeString(480, 854);
makeString(540, 960);
makeString(600, 1024);
makeString(720, 1184);
makeString(720, 1196);
makeString(720, 1280);
makeString(768, 1024);
makeString(768, 1280);//nexus 4
makeString(800, 1280);
makeString(1080, 1812);
makeString(1080, 1920);
makeString(1440, 2560);
makeString(1536, 2048);//nexus 9
makeString(2560, 1600);//nexus 10
}

public static void makeString(int w, int h) {

StringBuffer sb = new StringBuffer();
sb.append("<?xml version=\"1.0\" encoding=\"utf-8\"?>\n");
sb.append("<resources>");
float cellw = w / dw;
for (int i = 1; i < 320; i++) {
sb.append(WTemplate.replace("{0}", i + "").replace("{1}",
change(cellw * i) + ""));
}
sb.append(WTemplate.replace("{0}", "320").replace("{1}", w + ""));
sb.append("</resources>");

StringBuffer sb2 = new StringBuffer();
sb2.append("<?xml version=\"1.0\" encoding=\"utf-8\"?>\n");
sb2.append("<resources>");
float cellh = h / dh;
for (int i = 1; i < 480; i++) {
sb2.append(HTemplate.replace("{0}", i + "").replace("{1}",
change(cellh * i) + ""));
}
sb2.append(HTemplate.replace("{0}", "480").replace("{1}", h + ""));
sb2.append("</resources>");

String path = rootPath.replace("{0}", h + "").replace("{1}", w + "");
File rootFile = new File(path);
if (!rootFile.exists()) {
rootFile.mkdirs();
}
File layxFile = new File(path + "lay_x.xml");
File layyFile = new File(path + "lay_y.xml");
try {
PrintWriter pw = new PrintWriter(new FileOutputStream(layxFile));
pw.print(sb.toString());
pw.close();
pw = new PrintWriter(new FileOutputStream(layyFile));
pw.print(sb2.toString());
pw.close();
} catch (FileNotFoundException e) {
e.printStackTrace();
}
}

public static float change(float a) {
int temp = (int) (a * 100);
return temp / 100f;
}              java生成文件放置在res/目录下。



使用：

<Button
android:layout_width="@dimen/x160"
android:layout_height="@dimen/x240" />效果：



弊端：当没生成对应分辨率的文件时，展示效果为空白，如Nexus 7所示。并且生成文件一直在APP中，相对较耗存储空间。

5，图片适配

            依据不同分辨率，切出对应分辨率的图片，可实现背景、按钮、图片、TabBar、Icon等的屏幕适配。

切图比例如图所示：



为了缩小App的体积，且多套图是不太建议的。可以采用切大图及市场占有率最高的两套来适配所有。

图片适配遍历的流程：



           图片适配还可以采用.9图片来实现。在.9图片的制作中，请注意每边都留上2px，即是不让边框线完全没有。同时也注意缩放范围。保持最核心图标的合理变形，整体符合视觉效果的合理缩放。

           Android SDK中提供了编辑9-Patch图片的工具，在tools目录下draw9patch.bat，能够立刻看到编辑后的拉伸效果。

6，百分比屏幕适配

            浏览器中，Web程序展示的屏幕变化并不会少于手机样式，但是很少出现适配问题。是多采用比例布局的缘故。在Android5.0中，新增百分比布局。

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.percent.PercentRelativeLayout
android:id="@+id/rl1"
android:layout_width="match_parent"
android:layout_height="50dp">

<Button
android:id="@+id/bt1"
android:layout_width="200dp"
android:layout_height="match_parent"
android:text="百分布局的固定宽度"
android:textSize="18sp" />

<Button
android:id="@+id/bt2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_toRightOf="@+id/bt1"
android:background="@color/blue"
android:text="比例：50%"
android:textSize="20sp"
app:layout_widthPercent="50%" />

<Button
android:id="@+id/bt3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_toRightOf="@+id/bt2"
android:background="@color/red"
android:text="比例：50%"
android:textSize="20sp"
app:layout_widthPercent="50%" />

</android.support.percent.PercentRelativeLayout>

<android.support.percent.PercentRelativeLayout
android:id="@+id/rl2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="@+id/rl1">

<Button
android:id="@+id/bt4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:background="@color/green"
android:text="比例：30%"
android:textSize="20sp"
app:layout_widthPercent="30%" />

<Button
android:id="@+id/bt5"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_toRightOf="@+id/bt4"
android:background="@color/purple"
android:text="比例：40%"
android:textSize="20sp"
app:layout_widthPercent="40%" />

<Button
android:id="@+id/bt6"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_toRightOf="@+id/bt5"
android:background="@color/gold"
android:text="比例：30%"
android:textSize="20sp"
app:layout_widthPercent="30%" />

</android.support.percent.PercentRelativeLayout>

<Button
android:id="@+id/bt7"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="@+id/rl2"
android:text="纵向百分布局:20%"
app:layout_heightPercent="20%" />

<Button
android:id="@+id/bt8"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="@+id/bt7"
android:background="@color/navy"
android:text="纵向百分布局:20%"
app:layout_heightPercent="20%" />

</android.support.percent.PercentRelativeLayout>布局展示效果：



百分布局中，控件是相对与父控件的对应属性。所以，在指定过某些控件的固定长度后，依旧不能完全适配。如视图第一行所示。在完全分割父控件对应属性100%的情形下，百分布局的适配性很好。

三、个人感慨

             编程路上因为有很多兴趣相似、相同的人共同前行而变得更有意义。若你看到这篇文章，有什么建议、优化记得分享一下哦~_~

             一个普通男孩，充实着自己的脑袋，也把这个作为一个标注。愿大家前行更美好~~

戳这里，有源码~_~

专注下来！！！！【  让一件事的发生成为必然   】

                                                                                                每篇一句鼓励，愿你我前行更美好~~