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

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

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

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

1.代码实现:

<?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代码实现:

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。

<?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.运行效果:


转载于:https://juejin.im/post/5c95d2386fb9a070d53fe417

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值