自定义百分比布局

2019-05-30  本文已影响0人  石器时代小古董

一、百分比布局

百分比布局是以父容器的尺寸为参考,在 View 加载的过程中算出子 View 的宽高,在作用于子View上。百分比布局只要知道这个 View 大概占据整个布局多少就可以。

二、布局文件的解析

布局 xml 在通过setContentView交给 Activity 后,Activity 传递给了PhoneWinodw。PhoneWindow又会调用 LayoutInflate 的 inflate 方法解析 xml 。在这里可以看到一个控件的 Params 是由父容器来创建的.父容器通过generateLayoutParams来生成子控件的Params。

在使用inflate方法时每次都要传递一个root参数,root就代表父容器。子 View 依赖父容器的LayoutParams这点不难理解。因为子 View 是依托于父容器这个环境的,只知道父容器的种类,才好知道自己可以设置什么种类的参数。如何知道父容器的种类就是通过父容器传递一个Params,子View修改这个Params.这样就好像是父容器告诉你,你可以在我的规则内如何玩,不能超出这个规则(不能设置我的Params不具备的属性)

image.png

三、手动实现一个百分比布局

1.实现自定义百分比属性

2.实现静态的 Params ,继承自被扩展View,这样保证原始的 Params 都可以继续使用

3.父容器拿到子View设置好的百分比属性后,修改子View的宽高即可

4.重写generateLayoutParams,生成自己的Params

package com.netease.screenadapter.percentlayout;

import android.content.Context;
import android.content.res.TypedArray;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup;
import android.widget.RelativeLayout;

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) {
        //获取父容器的尺寸
        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        int heightSize = MeasureSpec.getSize(heightMeasureSpec);
        int count = getChildCount();
        for (int i = 0; i < count; i++) {
            View child = getChildAt(i);
            ViewGroup.LayoutParams params = child.getLayoutParams();
            //如果说是百分比布局属性
            if (checkLayoutParams(params)){
                LayoutParams lp = (LayoutParams)params;
                 float widthPercent = lp.widthPercent;
                 float heightPercent = lp.heightPercent;
                 float marginLeftPercent = lp.marginLeftPercent;
                 float marginRightPercent= lp.marginRightPercent;
                 float marginTopPercent= lp.marginTopPercent;
                 float marginBottomPercent = lp.marginBottomPercent;

                 if (widthPercent > 0){
                     params.width = (int) (widthSize * widthPercent);
                 }

                if (heightPercent > 0){
                    params.height = (int) (heightSize * heightPercent);
                }

                if (marginLeftPercent > 0){
                    ((LayoutParams) params).leftMargin = (int) (widthSize * marginLeftPercent);
                }

                if (marginRightPercent > 0){
                    ((LayoutParams) params).rightMargin = (int) (widthSize * marginRightPercent);
                }

                if (marginTopPercent > 0){
                    ((LayoutParams) params).topMargin = (int) (heightSize * marginTopPercent);
                }

                if (marginBottomPercent > 0){
                    ((LayoutParams) params).bottomMargin = (int) (heightSize * marginBottomPercent);
                }

            }
        }

        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    @Override
    protected boolean checkLayoutParams(ViewGroup.LayoutParams p) {
        return p instanceof LayoutParams;
    }
   // 重写这个方法,让子View拿到自己的LayoutParams
    public LayoutParams generateLayoutParams(AttributeSet attrs){
        return new LayoutParams(getContext(), attrs);
    }
    
    // 定义自己的LayoutParams
    public static class LayoutParams extends RelativeLayout.LayoutParams{

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

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

上一篇下一篇

猜你喜欢

热点阅读