android 屏幕适配二:手写百分比布局适配

原理:以父容器尺寸为参考,在View的加载过程,根据当前父容器的实际尺寸计算出目标尺寸,再做用在view上。java

例如:设计师给的布局像素是720 * 1080,布局中有一个view的宽度是360px,为屏幕宽度的一半,若是咱们再手机像素为1080 * 1920的手机上设置宽度为360px时,显然不合适,正常的宽度应该是540px,这里咱们能够经过设置比例的方式来实现,好比设置为屏幕宽度的0.5。android

下面以RelativeLayout为例自定义布局。建立PercentLayout继承RelativeLayout。在attr.xml文件中设置自定义属性。bash

1.代码实现:app

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="PercentLayout">
        <attr name="widthPercent" format="float" />
        <attr name="heightPercent" format="float" />
        <attr name="marginLeftPercent" format="float" />
        <attr name="marginRightPercent" format="float" />
        <attr name="marginTopPercent" format="float" />
        <attr name="marginBottomPercent" format="float" />
    </declare-styleable>
</resources>复制代码

java代码实现:ide

public class PercentLayout extends RelativeLayout {
    public PercentLayout(Context context) {
        super(context);
    }

    public PercentLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public PercentLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //测量以前先对view百分比设置
        //获取父容器的宽高
        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        int heightSize = MeasureSpec.getSize(heightMeasureSpec);

        int count = getChildCount();
        for (int i = 0; i < count; i++) {
            //从新设置子view的布局属性,再进行View的测量
            View child = getChildAt(i);
            ViewGroup.LayoutParams params = child.getLayoutParams();
            if (checkLayoutParams(params)) {
                LayoutParams layoutParams = (LayoutParams) params; //强转成layoutParams
                //获取百分比属性
                float widthPercent = layoutParams.widthPercent;
                float heightPercent = layoutParams.heightPercent;
                float marginLeftPercent = layoutParams.marginLeftPercent;
                float marginRightPercent = layoutParams.marginRightPercent;
                float marginTopPercent = layoutParams.marginTopPercent;
                float marginBottomPercent = layoutParams.marginBottomPercent;
                if (widthPercent > 0) { //赋值成功
                    layoutParams.width = (int) (widthSize * widthPercent); //尺寸大小为:父容器宽*百分比
                }
                if (heightPercent > 0) {
                    layoutParams.height = (int) (heightSize * heightPercent);
                }
                if (marginLeftPercent > 0) {
                    layoutParams.leftMargin = (int) (widthSize * marginLeftPercent);
                }
                if (marginRightPercent > 0) {
                    layoutParams.rightMargin = (int) (widthSize * marginRightPercent);
                }
                if (marginTopPercent > 0) {
                    layoutParams.topMargin = (int) (heightSize * marginTopPercent);
                }
                if (heightPercent > 0) {
                    layoutParams.bottomMargin = (int) (heightSize * marginBottomPercent);
                }

            }
        }
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    //用于LayoutParams的判断,判断是否为当前类的子类(参考RelativeLayout中的此方法)
    @Override
    protected boolean checkLayoutParams(ViewGroup.LayoutParams p) {
        return p instanceof LayoutParams; //判断是不是PercentLayout.LayoutParams
    }

    //重写此方法,用于返回咱们内部建立的LayoutParams(参考RelativeLayout中的此方法)
    @Override
    public LayoutParams generateLayoutParams(AttributeSet attrs) {
        return new LayoutParams(getContext(), attrs);
    }


    //这里参考RelativeLayout中将自定属性封装在LayoutParams中
    public static class LayoutParams extends RelativeLayout.LayoutParams {

        private float heightPercent;
        private float widthPercent;
        private float marginLeftPercent;
        private float marginRightPercent;
        private float marginTopPercent;
        private float marginBottomPercent;

        public LayoutParams(Context c, AttributeSet attrs) {
            super(c, attrs);
            //添加自定义属性
            TypedArray typedArray = c.obtainStyledAttributes(attrs, R.styleable.PercentLayout);
            heightPercent = typedArray.getFloat(R.styleable.PercentLayout_heightPercent, 0);
            widthPercent = typedArray.getFloat(R.styleable.PercentLayout_widthPercent, 0);
            marginLeftPercent = typedArray.getFloat(R.styleable.PercentLayout_marginLeftPercent, 0);
            marginRightPercent = typedArray.getFloat(R.styleable.PercentLayout_marginRightPercent, 0);
            marginTopPercent = typedArray.getFloat(R.styleable.PercentLayout_marginTopPercent, 0);
            marginBottomPercent = typedArray.getFloat(R.styleable.PercentLayout_marginBottomPercent, 0);
            typedArray.recycle();
        }
    }
}
复制代码

2.xml布局文件中设置子view的百分比:布局

这里咱们设置了宽高都是为屏幕的0.5。ui

<?xml version="1.0" encoding="utf-8"?>
<com.xuwei.screenpercentlayout.PercentLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:background="@color/colorPrimary"
        android:text="宽50%,高75%"
        app:heightPercent="0.5"
        app:widthPercent="0.5" />

</com.xuwei.screenpercentlayout.PercentLayout>复制代码

3.运行效果:spa

相关文章
相关标签/搜索