美文网首页适配
Android屏幕适配

Android屏幕适配

作者: Alan_兰哥 | 来源:发表于2019-11-04 11:05 被阅读0次

    前言

    在Android开发中,由于Android碎片化严重,屏幕分辨率千奇百怪,而想要在各种分辨率的设备上显示基本一致的效果,适配成本越来越高。虽然Android官方提供了dp单位来适配,但其在各种奇怪分辨率下表现却不尽如人意。

    想要完美解决屏幕适配问题。首先,必须要了解的几个概念。

    屏幕尺寸、屏幕分辨率、屏幕像素密度

    屏幕尺寸:屏幕对角线长度,单位是英寸,我们常说的多少多少寸,比如4.7存手机、5.7存手机,指的就是这个。
    屏幕分辨率:如 1920×1080,是指在手机屏幕的像素点的个数,单位是px,1px = 1 像素点,一般是纵向像素 × 横向像素,意味着高有 1920 个像素点,宽有 1080 个像素点。
    屏幕像素密度:是指每英寸上的像素点数,单位是 dpi(dotper inch)。像素密度和屏幕尺寸和屏幕分辨率有关,它是由对角线的像素点数除以屏幕的大小得到的,关系如下:


    屏幕像素密度算法

    dp、dip、dpi、sp、px

    dp:是Android 特有的,意为密度无关像素,Google 发布的 BASELINE(基准线)为 160,以此为基准。
    dip:Density Independent Pixels,同dp一个意思,目前废弃了,一般都写dp。
    dpi:即为屏幕像素密度的单位
    sp:Scale-IndependentPixels的缩写,可以根据文字大小首选项自动进行缩放。Google推荐我们使用12sp以上的大小,通常可以使用12sp,14sp,18sp,22sp,为避免精度损失,建议最好不要使用奇数和小数。
    px:就是我们常说的像素

    mdpi、hdpi、xhdpi、xxhdpi、xxxhdpi

    像素密度范围对应表 Google各种尺寸对应密度表

    屏幕适配

    屏幕分辨率限定符(不推荐)

    屏幕分辨率限定符适配需要在 res 文件夹下创建各种屏幕分辨率对应的 values-xxx 文件夹,如下图:


    屏幕分辨率限定符

    然后根据一个基准分辨率,例如基准分辨率为 1280x720,将宽度分成 720 份,取值为 1px~720px,将高度分成 1280 份,取值为 1px~1280px,生成各种分辨率对应的 dimens.xml 文件。如下分别为分辨率 1280x720 与 1920x1080 所对应的横向dimens.xml 文件:

    image

    假设设计图上的一个控件的宽度为 720px,那么布局中就写 android:layout_width="@dimen/x720" ,当运行程序的时候,系统会根据设备的分辨率去寻找对应的 dimens.xml 文件。例如运行在分辨率为 1280x720 的设备上,系统会自动找到对应的 values-1280x720 文件夹下的 lay_x.xml 文件,由上图可知 x720 对应的值为
    720.px,可铺满该屏幕宽度。运行在分辨率为 1920x1080 的设备上,系统会自动找到对应的 values-1920x1080 文件夹下的 lay_x.xml 文件,由上图可知 x720 对应的值为 1080.0px,可铺满该屏幕宽度。这样就达到了屏幕适配的要求!

    smallestWidth 限定符

    smallestWidth 限定符适配原理与屏幕分辨率限定符适配原理一样,系统都是根据限定符去寻找对应的 dimens.xml 文件。例如程序运行在最小宽度为 360dp 的设备上,系统会自动找到对应的 values-sw360dp 文件夹下的 dimens.xml 文件。区别就在于屏幕分辨率限定符适配是拿 px 值等比例缩放,而 smallestWidth 限定符适配是拿 dp 值来等比缩放而已。需要注意的是“最小宽度”是不区分方向的,即无论是宽度还是高度,哪一边小就认为哪一边是“最小宽度”。如下分别为最小宽度为 360dp 与最小宽度为 640dp 所对应的 dimens.xml 文件:


    image

    获取设备最小宽度代码为:

    DisplayMetrics dm = new DisplayMetrics();
    getWindowManager().getDefaultDisplay().getMetrics(dm);
    int heightPixels = ScreenUtils.getScreenHeight(this);
    int widthPixels = ScreenUtils.getScreenWidth(this);
    float density = dm.density;
    float heightDP = heightPixels / density;
    float widthDP = widthPixels / density;
    float smallestWidthDP;
    if(widthDP < heightDP) {
        smallestWidthDP = widthDP;
    }else {
        smallestWidthDP = heightDP;
    }
    
    为什么选择 smallestWidth 限定符适配?

    既然原理都一样,都需要多套 dimens.xml 文件,那为什么要选择 smallestWidth 限定符适配呢?

    屏幕分辨率限定符适配是根据屏幕分辨率的,Android 设备分辨率一大堆,而且还要考虑虚拟键盘,这样就需要大量的 dimens.xml 文件。因为无论手机屏幕的像素多少,密度多少,90% 的手机的最小宽度都为 360dp,所以采用 smallestWidth 限定符适配只需要少量 dimens.xml 文件即可。
    屏幕分辨率限定符适配采用的是 px 单位,而 smallestWidth 限定符适配采用的单位是 dp 和 sp,dp 和 sp 是google 推荐使用的计量单位。又由于很多应用要求字体大小随系统改变,所以字体单位使用 sp 也更灵活。
    屏幕分辨率限定符适配需要设备分辨率与 values-xx 文件夹完全匹配才能达到适配,而 smallestWidth 限定符适配寻找 dimens.xml 文件的原理是从大往小找,例如设备的最小宽度为 360dp,就会先去找 values-360dp,发现没有则会向下找 values-320dp,如果还是没有才找默认的 values 下的 demens.xml 文件,所以即使没有完全匹配也能达到不错的适配效果。

    自定义布局组件适配

    ##ScreenAdapterLayout 
    public class ScreenAdapterLayout extends RelativeLayout {
        private boolean flag;
    
        public ScreenAdapterLayout(Context context) {
            super(context);
        }
    
        public ScreenAdapterLayout(Context context, AttributeSet attrs) {
            super(context, attrs);
        }
    
        public ScreenAdapterLayout(Context context, AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
        }
    
        @Override
        protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
            if (!flag) { //防止两次测量
                flag = true;
                //获取横竖方向等比
                float scaleX = Utils.getInstance(getContext()).getHorizontalScale();
                float scaleY = Utils.getInstance(getContext()).getVerticalScale();
                //子View个数
                int childCount = getChildCount();
                for (int i = 0; i < childCount; i++) {
                    View child = getChildAt(i);
                    LayoutParams params = (LayoutParams) child.getLayoutParams();
                    params.width = (int) (params.width * scaleX);
                    params.height = (int) (params.height * scaleY);
                    params.leftMargin = (int) (params.leftMargin * scaleX);
                    params.rightMargin = (int) (params.rightMargin * scaleX);
                    params.topMargin = (int) (params.topMargin * scaleY);
                    params.bottomMargin = (int) (params.bottomMargin * scaleY);
                    child.setPadding((int) (child.getPaddingLeft() * scaleX), (int) (child.getPaddingTop() * scaleY),
                            (int) (child.getPaddingRight() * scaleX), (int) (child.getPaddingBottom() * scaleY));
                }
            }
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        }
    }
    
    ##Utils 
    public class Utils {
        private static Utils utils;
        private Context mContext;
        //这里是设计稿参考宽高
        private static final float STANDARD_WIDTH = 1080;
        private static final float STANDARD_HEIGHT = 1920;
        //这里是屏幕显示宽高
        private int mDisplayWidth;
        private int mDisplayHeight;
    
        public Utils(Context context) {
            mContext = context;
            //获取屏幕宽高
            if (mDisplayWidth == 0 || mDisplayHeight == 0) {
                WindowManager windowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
                if (windowManager != null) {
                    //宽高获取
                    DisplayMetrics displayMetrics = new DisplayMetrics();
                    //如果不是NavigationBar沉浸式(不包含NavigationBar)
                    windowManager.getDefaultDisplay().getMetrics(displayMetrics);
    //                windowManager.getDefaultDisplay().getRealMetrics(displayMetrics);//真实屏幕宽高
                    //判断当前的横竖屏
                    if (displayMetrics.widthPixels > displayMetrics.heightPixels) {
                        //横屏
                        mDisplayWidth = displayMetrics.heightPixels;
                        mDisplayHeight = displayMetrics.widthPixels - getStatusBarHeight(context);
                    } else {
                        //竖屏
                        mDisplayWidth = displayMetrics.widthPixels;
                        mDisplayHeight = displayMetrics.heightPixels - getStatusBarHeight(context);
                    }
                }
            }
        }
    
        public static Utils getInstance(Context context) {
            if (utils == null) {
                utils = new Utils(context);
            }
            return utils;
        }
    
        //获取状态栏高度
        public int getStatusBarHeight(Context context) {
            int resId = context.getResources().getIdentifier("status_bar_height", "dimen", "android");
            if (resId > 0) {
                return context.getResources().getDimensionPixelSize(resId);//获取具体的像素值
            }
            return 0;
        }
    
        //获取水平方向的缩放比例
        public float getHorizontalScale() {
            return mDisplayWidth / STANDARD_WIDTH;
        }
    
        //获取垂直方向的缩放比例
        public float getVerticalScale() {
            return mDisplayHeight / STANDARD_HEIGHT-getStatusBarHeight(mContext);
        }
    }
    
    ##activity_pixel.xml
    <?xml version="1.0" encoding="utf-8"?>
    <com.dn_alan.myapplication.pixel.ScreenAdapterLayout
        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">
    
        <TextView
            android:id="@+id/textView"
            android:layout_width="540px"
            android:layout_height="960px"
            android:background="@android:color/holo_red_dark"
            android:paddingLeft="20px"
            android:gravity="center"
            android:text="动脑学院"
            android:onClick="pixel"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    
    </com.dn_alan.myapplication.pixel.ScreenAdapterLayout>
    

    作者:Alan
    原创博客,请注明转载处....

    相关文章

      网友评论

        本文标题:Android屏幕适配

        本文链接:https://www.haomeiwen.com/subject/bvxlbctx.html