最便捷的 Android 屏幕适配机制,最易懂的今日头条方案讲解

屏幕基础概念

硬件概念

日常中我们一般听到或者用到的就是屏幕的尺寸(XX手机6.5寸大屏blabla),指的就是手机屏幕对角线的长度

其次是分辨率,常见的有1080P(1920x1080)、2k(2560x1440)、4k(4096×2160),其中的数字指的是屏幕两个方向上的像素个数(为什么不说是垂直水平两个方向?因为你能竖屏看,也能横屏看 :)

软件概念

其中关系如下:

举个例子:手机分辨率 1920x1080,屏幕大小是5寸

((1920^2 + 10802) 1/2 ) / 5 = 440

所以dpi就是440

其他关系又如下:

image

为什么会出现屏幕不适配的问题

Android的画面编码,控件的宽高等属性通常使用的单位都是dp

假设我们UI设计图是按屏幕宽度为360dp来设计的,那么在上述举例的dpi440的设备上,屏幕宽度其实为1080/(440/160)=392.7dp,也就是屏幕是比设计图要宽的。这种情况下, 即使使用dp也是无法在不同设备上显示为同样效果的。 同时还存在部分设备屏幕宽度不足360dp,这时就会导致按360dp宽度来开发实际显示不全的情况。

而且上述屏幕尺寸、分辨率和像素密度的关系,很多设备并没有按此规则来实现, 因此dpi的值非常乱,没有规律可循,从而导致使用dp适配效果差强人意。

然而屏幕适配一般都是统一不同机型的宽度或者高度,因为现在手机在屏幕高度上参差不齐,所以常见的屏幕适配方案都是针对宽度是适配。

今日头条的屏幕适配方案

今日头条技术团队给出了一个比较完善的解决方案:

因为android中的dp在渲染前会将dp转为px,

所以从dp和px的转换公式入手:

而density又是通过dpi而来

px是最终的显示效果,dp是我们按照设计图纸进行布局的单位,所以我们就拿density/dpi开刀

通过阅读源码,我们可以得知,density 是 DisplayMetrics 中的成员变量,而 DisplayMetrics 实例通过 Resources.getDisplayMetrics 可以获得,而Resouces通过Activity或者Application的Context获得。

先来熟悉下 DisplayMetrics 中和适配相关的几个变量:

  • DisplayMetrics.density就是上述的density
  • DisplayMetrics.densityDpi 就是上述的dpi
  • DisplayMetrics.scaledDensity 字体的缩放因子,正常情况下和density相等,但是调节系统字体大小后会改变这个值

动手

获取当前的Denisty

DisplayMetrics appDisplayMetrics = application.getResources().getDisplayMetrics();
DisplayMetrics activityDisplayMetrics = activity.getResources().getDisplayMetrics();

计算目标Denisty

// 以设计DP为360为例,density = px / dp
final float targetDensity = (float) (appDisplayMetrics.widthPixels / 360.0);
//计算对应比例大小的字体大小,一般scaledDensity与density相同,防止用户在系统设置调整字体大小的情况
final float targetScaledDensity = targetDensity * (appDisplayMetrics.scaledDensity / appDisplayMetrics.density);
//dpi = density * 160
final int targetDensityDpi = (int)(targetDensity * 160);

加上设置成为完全体

    private static void setCustomDensity(Application application, Activity activity) {
        final DisplayMetrics appDisplayMetrics = application.getResources().getDisplayMetrics();

        // 以设计DP为360为例,获得目标Density
        final float targetDensity = (float) (appDisplayMetrics.widthPixels / 360.0);
        final float targetScaledDensity = targetDensity * (appDisplayMetrics.scaledDensity / appDisplayMetrics.density);
        final int targetDensityDpi = (int)(targetDensity * 160);

        //设置application的Density
        appDisplayMetrics.density = targetDensity;
        appDisplayMetrics.scaledDensity = targetScaledDensity;
        appDisplayMetrics.densityDpi = targetDensityDpi;

        //设置activity的Density
        final DisplayMetrics activityDisplayMetrics = activity.getResources().getDisplayMetrics();
        activityDisplayMetrics.density = targetDensity;
        activityDisplayMetrics.scaledDensity = targetScaledDensity;
        activityDisplayMetrics.densityDpi = targetDensityDpi;
    }

一般的应用场景就是在BaseActivity的onCreate方法中调用setCustomDensity(),即可达成全局适配

目前看来是没问题了,但是还有一个场景:如果用户在运行期间在系统设置例修改了字体,再返回了app。

此时app无感知,所以字体没有变化,所以我们还应该监听一下字体变化,同时调整ScaledDensity
进化为究极体


    private static float aNoncompatDensity;
    private static float aNoncompatScaledDensity;

    private static void setCustomDensity(Application application, Activity activity) {

        final DisplayMetrics appDisplayMetrics = application.getResources().getDisplayMetrics();
        if (aNoncompatDensity == 0) {
            aNoncompatDensity = appDisplayMetrics.density;
            aNoncompatScaledDensity = appDisplayMetrics.scaledDensity;
            application.registerComponentCallbacks(new ComponentCallbacks() {
                @Override
                public void onConfigurationChanged(@NonNull Configuration newConfig) {
                    if (newConfig.fontScale > 0) {
                        aNoncompatScaledDensity = application.getResources().getDisplayMetrics().scaledDensity;
                    }
                }

                @Override
                public void onLowMemory() {

                }
            });
        }

        final float targetDensity = (float) (appDisplayMetrics.widthPixels / 360.0);
        final float targetScaledDensity = targetDensity * (aNoncompatScaledDensity/ aNoncompatDensity);
        final int targetDensityDpi = (int)(targetDensity * 160);

        //设置application的Density
        appDisplayMetrics.density = targetDensity;
        appDisplayMetrics.scaledDensity = targetScaledDensity;
        appDisplayMetrics.densityDpi = targetDensityDpi;

        //设置activity的Density
        final DisplayMetrics activityDisplayMetrics = activity.getResources().getDisplayMetrics();
        activityDisplayMetrics.density = targetDensity;
        activityDisplayMetrics.scaledDensity = targetScaledDensity;
        activityDisplayMetrics.densityDpi = targetDensityDpi;
    }

贫穷的我并没有多台设备可以测试适配效果,所以引用一下今日头条技术团队的测试截图:

这种适配方式侵入性极低,效果稳定,短短几十行代码就可以完成适配问题,简直不要太简单

文章以上简单说明了一下适配的原理,现在有许多开源项目采用了更加简介的实现,就不往下展开了,大家可以自行探索一下有哪些比较方便的实现方案

挖个坑,有空在谈谈其他几种屏幕适配方法以及之间的优缺点比较

推荐阅读更多精彩内容