Android自定义百分比布局

一、Google的百分比布局

关于百分比布局，其实Google为我们提供了一套方案，使用方式非常简单，跟我们之前使用的布局一样，只是某些属性名字有些差别。

使用Google提供的百分比布局，需要导入依赖：

dependencies {
    implementation 'com.android.support:percent:28.0.0'
}

然后使用如下：

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentRelativeLayout
    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:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="高80%，宽50%"
        android:background="@color/colorAccent"
        app:layout_heightPercent="80%"
        app:layout_widthPercent="50%" />
</android.support.percent.PercentRelativeLayout>

布局必须使用特定的百分比布局控件RelativeLayout
要改成使用：android.support.percent.PercentRelativeLayout

二、自定义百分比布局

今天我们通过自定义实现一个自己的百分比布局，以RelativeLayout为例。

1、第一步，定义属性：
values 下，创建attrs.xml 属性文件

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="MyPercentLayout">
        <attr name="widthPercent" format="float"/>
        <attr name="heightPercent" format="float"/>
    </declare-styleable>
</resources>

2、创建自定义类

package com.example.percent;

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 MyPercentLayout extends RelativeLayout {
    public MyPercentLayout(Context context) {
        super(context);
    }

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

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

    @Override
    public LayoutParams generateLayoutParams(AttributeSet attrs) {
        return new LayoutParams(getContext(),attrs);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, 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;

                //不为空，再做相应转化
                if(widthPercent > 0){
                    params.width = (int)(widthPercent * widthSize);
                }
                if(heightPercent > 0){
                    params.height = (int)(heightPercent * heightSize);
                }
            }
        }


    }

    @Override
    protected boolean checkLayoutParams(ViewGroup.LayoutParams p) {
        return p instanceof LayoutParams;
    }

    //自定义属性，继承 RelativeLayout.LayoutParams
    public static class LayoutParams extends  RelativeLayout.LayoutParams{

        private float widthPercent;
        private float heightPercent;

        public LayoutParams(Context context, AttributeSet attrs) {
            super(context, attrs);
            //解析属性值
            TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.MyPercentLayout);
            widthPercent = a.getFloat(R.styleable.MyPercentLayout_widthPercent,0);
            heightPercent = a.getFloat(R.styleable.MyPercentLayout_heightPercent,0);

            a.recycle();
        }
    }
}

3、使用自定义的布局

<?xml version="1.0" encoding="utf-8"?>
<com.example.percent.MyPercentLayout 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:text="高80%，宽50%"
        android:background="@color/colorAccent"
        app:widthPercent="0.5"
        app:heightPercent="0.8"/>

</com.example.percent.MyPercentLayout>

运行效果如下：

效果图