Android设备兼容处理(二):屏幕适配

96
08_carmelo
2017.06.12 00:26* 字数 1284

前言

要做好屏幕适配最重要的是了解当前市场设备分布,目前主流设备可以分为三类,4.7-5.5英寸的中屏手机,5.5-7.0的大屏手机,以及7.0英寸以上的平板。分辨率则是720P,1080P和2K。

看一下实际开发场景:比如现在一台5.0英寸1080P(1080x1920)的手机,屏幕密度就是440dpi,dpi等级都是和160做比较,属于xxhdpi(超超高),也就是常说的3X,屏幕宽度就是1080/(440/160) = 392dp, 如果有个Button的宽度是196dp那么在这部手机显示就是宽度一半。 假设另一部手机是6.0英寸1080P,那么屏幕密度是366dpi屏幕宽度是1080/(366/160)= 471dp,刚才那个Button就占了不到一半,看起来就显得“小了”。可见,dp也不是那么靠谱啊。

有人已经想到了解决方案,直接把Button的宽度设为屏幕宽度一半就OK了。可如果Button不是在线性布局中呢,weight属性是不能用了,现在假设可以设置为屏幕宽度一半。如果app运行在10英寸的平板上,你脑补一下是什么效果,半屏幕长的按钮。。。

我用一个按钮的例子,引出了屏幕适配的问题,下面看下解决办法,分为三个阶段。

屏幕密度适配:手机(4.7寸-5.5英寸)

1.在 XML 布局文件中指定尺寸时使用 wrap_content、match_parent 或 dp 单位 。
2.不要在应用代码中使用硬编码的像素值,用dp转换
3.不要使用 AbsoluteLayout(已弃用)
4.为不同屏幕密度提供多套图片,放到对应的目录,不能只提供最小大批的图片,因为图片拉伸消耗内存而且拉伸后效果不好。
5.对需要拉伸的有内容图片提供.9图片

为何叫屏幕密度适配,就是4.7-5.5的机型我们就当做尺寸一样的来处理,只不过dpi不一样而已,那么Android本身提供的dp单位就可以解决这个问题。

这是适配的第一阶段,如果你能做到这些适配已经完成了一大半,针对市场上流行的4.7-5.5英寸的手机,不管是720P,1080P还是2K的屏幕,Android会帮我们处理优化,在这些设备上不能完全精确但也不至于用户看着难受。

屏幕尺寸适配:手机(5.5寸-7英寸)

image.png

首先要知道dpi是个范围不是特定的数值,比如440dpi和500dpi都会划分到xxhdpi,前言中举的例子一个设备尺寸变大了,但是分辨率却没变大会导致dp失效。这种情况如果你的app在大尺寸手机上有用户量,并且你的界面控件有很多是dp做为宽度,那么建议做一下适配。
解决办法:
1.LinearLayout的weight属性
2.如果是其他布局类型,需要引入百分比布局(在Android提供的supprt库)

 compile 'com.android.support:percent:22.2.0'

用法:

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.app2.MainActivity">
    <Button
        android:text="right:30%"
        android:layout_width="0dp"
        app:layout_widthPercent="30%"
        android:layout_height="50dp"
        android:id="@+id/btn3"
        android:layout_alignBaseline="@+id/btn2"
        android:layout_alignBottom="@+id/btn2"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />
    <Button
        android:text="left:30%"
        android:layout_width="0dp"
        app:layout_widthPercent="30%"
        android:layout_height="50dp"
        android:id="@+id/btn2"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />
</android.support.percent.PercentRelativeLayout>
image.png

这是屏幕适配的第二阶段,基本可以适配所有的手机设备了,还剩下一种就是平板

屏幕尺寸适配:平板(7英寸以上的平板)

上面讲的两种都是同一份布局文件,里面的控件的宽高用dp或者百分比来处理,在手机上看着还行,但是在平板上可能效果很差,控件宽度被拉伸太多不协调


image.png

这时只能针对设备尺寸,需要采用不同的布局文件,重新让UI设计大屏的布局。
1.采用res/layout-sw480dp,res/layout-sw600dp来区分不同的屏幕宽度,放多套布局文件在不同文件夹,app会根据设备款来自行选择的。


image.png

解释下这里res/layout-sw480dp的意思,sw的意思是smallest width最小宽度,用于指定屏幕两边的最小值,而不管设备 当前的方向如何。5.0英寸1080P(1080x1920)的手机屏幕宽度就是1080/(440/160) = 392dp,同样的1080P分辨率随着设备尺寸越来越大,屏幕宽度的dp值也会越来越大,大屏手机和小平板可能到480dp,再大点就是600dp,720dp等等。
2.为横屏平板增加layout-land布局文件
上面说到layout-sw480dp跟屏幕方向无关,那横屏其实也有属性字段,可以和sw结合起来用,比如


image.png

会在屏幕最小宽度大于480dp并且是横屏模式下展示,测试一下,还是上面那个布局,我在layout-sw480dp-land改成两个Button竖向排列,然后手动开启横屏看看看
1.gif

调试方法

布局写好了,可以在AndroidStudio2.2的布局预览中已经支持很多设备的调试了,不多介绍

image.png
Android经验分享
Web note ad 1