Android可换行的RadioGroup

        Android可换行的RadioGroup,有时候需要换行显示的单选列表，当然可以有多种实现方式，比如recycleview或者listview实现，本文采用的是RadioGroup+rediobutton方式实现。由于RadioGroup仅支持水平布局与垂直布局，故需要自定义控件实现。

一、首先自定义view

public class WrapRadioGroup extends RadioGroup {
    private static final String TAG = "RadioGroupEx";

    public WrapRadioGroup(Context context) {
        super(context);
    }

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

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        int widthMode = MeasureSpec.getMode(widthMeasureSpec);
        int heightSize = MeasureSpec.getSize(heightMeasureSpec);
        int heightMode = MeasureSpec.getMode(heightMeasureSpec);

        //调用ViewGroup的方法，测量子view
        measureChildren(widthMeasureSpec, heightMeasureSpec);

        //最大的宽
        int maxWidth = 0;
        //累计的高
        int totalHeight = 0;

        //当前这一行的累计行宽
        int lineWidth = 0;
        //当前这行的最大行高
        int maxLineHeight = 0;
        //用于记录换行前的行宽和行高
        int oldHeight;
        int oldWidth;

        int count = getChildCount();
        //假设 widthMode和heightMode都是AT_MOST
        for (int i = 0; i < count; i++) {
            View child = getChildAt(i);
            MarginLayoutParams params = (MarginLayoutParams) child.getLayoutParams();
            //得到这一行的最高
            oldHeight = maxLineHeight;
            //当前最大宽度
            oldWidth = maxWidth;

            int deltaX = child.getMeasuredWidth() + params.leftMargin + params.rightMargin;
            if (lineWidth + deltaX + getPaddingLeft() + getPaddingRight() > widthSize) {//如果折行,height增加
                //和目前最大的宽度比较,得到最宽。不能加上当前的child的宽,所以用的是oldWidth
                maxWidth = Math.max(lineWidth, oldWidth);
                //重置宽度
                lineWidth = deltaX;
                //累加高度
                totalHeight += oldHeight;
                //重置行高,当前这个View，属于下一行，因此当前最大行高为这个child的高度加上margin
                maxLineHeight = child.getMeasuredHeight() + params.topMargin + params.bottomMargin;
//                Log.v(TAG, "maxHeight:" + totalHeight + "---" + "maxWidth:" + maxWidth);

            } else {
                //不换行，累加宽度
                lineWidth += deltaX;
                //不换行，计算行最高
                int deltaY = child.getMeasuredHeight() + params.topMargin + params.bottomMargin;
                maxLineHeight = Math.max(maxLineHeight, deltaY);
            }
            if (i == count - 1) {
                //前面没有加上下一行的搞，如果是最后一行，还要再叠加上最后一行的最高的值
                totalHeight += maxLineHeight;
                //计算最后一行和前面的最宽的一行比较
                maxWidth = Math.max(lineWidth, oldWidth);
            }
        }

        //加上当前容器的padding值
        maxWidth += getPaddingLeft() + getPaddingRight();
        totalHeight += getPaddingTop() + getPaddingBottom();
        setMeasuredDimension(widthMode == MeasureSpec.EXACTLY ? widthSize : maxWidth,
                heightMode == MeasureSpec.EXACTLY ? heightSize : totalHeight);

    }

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        int count = getChildCount();
        //pre为前面所有的child的相加后的位置
        int preLeft = getPaddingLeft();
        int preTop = getPaddingTop();
        //记录每一行的最高值
        int maxHeight = 0;
        for (int i = 0; i < count; i++) {
            View child = getChildAt(i);
            MarginLayoutParams params = (MarginLayoutParams) child.getLayoutParams();
            //r-l为当前容器的宽度。如果子view的累积宽度大于容器宽度，就换行。
            if (preLeft + params.leftMargin + child.getMeasuredWidth() + params.rightMargin + getPaddingRight() > (r - l)) {
                //重置
                preLeft = getPaddingLeft();
                //要选择child的height最大的作为设置
                preTop = preTop + maxHeight;
                maxHeight = getChildAt(i).getMeasuredHeight() + params.topMargin + params.bottomMargin;
            } else { //不换行,计算最大高度
                maxHeight = Math.max(maxHeight, child.getMeasuredHeight() + params.topMargin + params.bottomMargin);
            }
            //left坐标
            int left = preLeft + params.leftMargin;
            //top坐标
            int top = preTop + params.topMargin;
            int right = left + child.getMeasuredWidth();
            int bottom = top + child.getMeasuredHeight();
            //为子view布局
            child.layout(left, top, right, bottom);
            //计算布局结束后，preLeft的值
            preLeft += params.leftMargin + child.getMeasuredWidth() + params.rightMargin;
        }
    }

}

二、布局直接引用

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <csu.xiaoya.robotApp.ui.view.WrapRadioGroup
            android:id="@+id/rg_bls"
            android:layout_width="438dp"
            android:layout_height="179dp"
            android:layout_below="@id/monitor_remd"
            android:layout_alignParentRight="true"
            android:layout_marginTop="@dimen/dp_15"
            android:layout_marginRight="@dimen/dp_24"
            android:orientation="horizontal"
            android:padding="1dp"
            app:maxWidth="300dp">

            <RadioButton
                android:id="@+id/rb_date_day"
                android:layout_width="@dimen/dp_84"
                android:layout_height="@dimen/dimen_48"
                android:background="@drawable/bls_am_2h_sg"
                android:button="@null"
                android:checked="true"
                android:layout_marginLeft="@dimen/dp_10"
                android:gravity="center"
                android:text="随机血糖"
                android:textColor="@color/white"
                android:textSize="@dimen/sp_10" />

            <RadioButton
                android:id="@+id/rb_date_week"
                android:layout_width="@dimen/dp_84"
                android:layout_height="@dimen/dimen_48"
                android:layout_marginLeft="@dimen/dp_10"
                android:background="@drawable/bls_am_2h_sg"
                android:button="@null"
                android:gravity="center"
                android:text="空腹血糖"
                android:textColor="@color/white"
                android:textSize="@dimen/sp_10" />

            <RadioButton
                android:layout_width="@dimen/dp_84"
                android:layout_height="@dimen/dimen_48"
                android:layout_marginLeft="@dimen/dp_10"
                android:background="@drawable/bls_am_2h_sg"
                android:button="@null"
                android:gravity="center"
                android:text="早餐后2小时"
                android:textColor="@color/white"
                android:textSize="@dimen/sp_10" />

            <RadioButton
                android:layout_width="@dimen/dp_84"
                android:layout_height="@dimen/dimen_48"
                android:layout_marginLeft="@dimen/dp_10"
                android:background="@drawable/bls_am_2h_sg"
                android:button="@null"
                android:gravity="center"
                android:text="早餐后2小时"
                android:textColor="@color/white"
                android:textSize="@dimen/sp_10" />

            <RadioButton
                android:layout_width="@dimen/dp_84"
                android:layout_height="@dimen/dimen_48"
                android:layout_marginLeft="@dimen/dp_10"
                android:layout_marginTop="@dimen/dp_10"
                android:background="@drawable/bls_am_2h_sg"
                android:button="@null"
                android:gravity="center"
                android:text="早餐后2小时"
                android:textColor="@color/white"
                android:textSize="@dimen/sp_10" />
        </csu.xiaoya.robotApp.ui.view.WrapRadioGroup>
    </LinearLayout>

三、背景样式bls_am_2h_sg

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:width="84dp" android:height="48dp" android:state_checked="false">
        <shape android:shape="rectangle">
            <solid android:color="#ff27b074" />
            <corners android:bottomLeftRadius="5dp" android:bottomRightRadius="5dp" android:topLeftRadius="5dp" android:topRightRadius="5dp" />
        </shape>
    </item>
    <item android:width="88dp" android:height="50dp" android:state_checked="true">
        <shape android:shape="rectangle">
            <solid android:color="#ff27b074" />
            <corners android:bottomLeftRadius="5dp" android:bottomRightRadius="5dp" android:topLeftRadius="5dp" android:topRightRadius="5dp" />
        </shape>
    </item>
</selector>

四、大功告成