RadioButton的排版，图标样式修改和图标文字间距修改

RadioButton排版

1.使用RadioGroup排版

RadioGroup本身只支持横向或者纵向排版，不支持多行

public class RadioGroup extends LinearLayout

可以看到RadioGroup 继承自LinearLayout，RadioGroup 的排版就是LinearLayout的排版功能；RadioGroup 只是在LinearLayout的基础上实现了，RadioButton的单选互斥功能

2.使用其他的布局控件排版RadioButton

LinearLayout
RelativeLayout
ConstraintLayout
//其他的等等

使用如ConstraintLayout等布局排版，也就意味着失去RadioGroup的单选互斥功能；需要自己来实现

单选RadioButton互斥功能实现工具类

//单选RadioButton互斥功能工具类
    public static class RadioButtonSelectOnlyOneHelper {
        private ArrayList<RadioButton> radioButtons;
        private CompoundButton.OnCheckedChangeListener mChildOnCheckedChangeListener;
        // when true, mOnCheckedChangeListener discards events
        private boolean mProtectFromCheckedChange = false;
        private OnCheckedChangeListener mOnCheckedChangeListener;
        private int checkedIndex = -1;

        public RadioButtonSelectOnlyOneHelper() {
            radioButtons = new ArrayList<>();
            mChildOnCheckedChangeListener = new CheckedStateTracker();
        }
        public void setOnCheckedChangeListener(RadioButtonSelectOnlyOneHelper.OnCheckedChangeListener listener) {
            mOnCheckedChangeListener = listener;
        }
        /**
         * 添加单个RadioButton到分组里
         * @param item
         */
        public void addRadioButton(RadioButton item) {
            if (item == null) return;
            if (item.isChecked()) {
                //处理有多个RadioButton的默认值为选中状态，只保留第一个
                mProtectFromCheckedChange = true;
                if (checkedIndex == -1) {
                    checkedIndex = radioButtons.size();
                } else {
                    item.setChecked(false);
                }
                mProtectFromCheckedChange = false;
            }
            item.setOnCheckedChangeListener(mChildOnCheckedChangeListener);
            radioButtons.add(item);
        }
        private void addView(View item) {
            if (item == null) return;
            if (item instanceof RadioButton) {
                addRadioButton((RadioButton) item);
            } else if (item instanceof ViewGroup) {
                addRadioButtonParent((ViewGroup) item);
            }
        }
        /**
         * 添加的ViewGroup中的RadioButton到分组里
         *
         * @param radioButtonParent
         */
        public void addRadioButtonParent(ViewGroup radioButtonParent) {
            if (radioButtonParent == null) return;
            int childCount = radioButtonParent.getChildCount();
            for (int i = 0; i < childCount; i++) {
                View view = radioButtonParent.getChildAt(i);
                addView(view);
            }
        }
        /**
         * <p>Interface definition for a callback to be invoked when the checked
         * radio button changed in this group.</p>
         */
        public interface OnCheckedChangeListener {
            public void onCheckedChanged(RadioButton checkedRadioButton);
        }
        private class CheckedStateTracker implements CompoundButton.OnCheckedChangeListener {
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                if (mProtectFromCheckedChange || !buttonView.isChecked()) {
                    return;
                }
                mProtectFromCheckedChange = true;
                if (checkedIndex != -1) {
                    radioButtons.get(checkedIndex).setChecked(false);
                }
                checkedIndex = radioButtons.indexOf(buttonView);
                mProtectFromCheckedChange = false;
                if (mOnCheckedChangeListener != null) {
                    mOnCheckedChangeListener.onCheckedChanged((RadioButton) buttonView);
                }
            }
        }
    }

工具类使用

        View view = inflater.inflate(R.layout.my_layout, null);
        RadioButtonSelectOnlyOneHelper radioButtonSelectOnlyOneHelper = new RadioButtonSelectOnlyOneHelper();
        radioButtonSelectOnlyOneHelper.addRadioButtonParent(view.findViewById(R.id.radio_1));
        radioButtonSelectOnlyOneHelper.addRadioButtonParent(view.findViewById(R.id.radio_2));
        radioButtonSelectOnlyOneHelper.setOnCheckedChangeListener(new RadioButtonSelectOnlyOneHelper.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioButton checkedRadioButton) {
                LogUtil.e(TAG,"onCheckedChanged:"+checkedRadioButton.getText().toString());
            }
        });

radio_1和radio_2是RadioButton 的父布局控件

RadioButton样式修改

RadioButton的图标样式修改是通过配置android:button属性
RadioButton控件xml配置android:button属性

    <style name="RadioButtonStyle" parent="android:Widget.CompoundButton.RadioButton">
        <item name="android:button">@drawable/checkbox_bg</item>
    </style>

checkbox_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/check_checked" android:state_checked="true" />
    <item android:drawable="@drawable/check_normal" android:state_checked="false" />
</selector>

check_checked和check_normal图片

RadioButton中引用style

                <RadioButton
                    android:id="@+id/cater"
                    style="@style/RadioButtonStyle"
                    android:layout_width="wrap_content"
                    android:layout_height="@dimen/dimen_px_40"
                    android:text="@string/cater" />

或者在对应主题中引用style

 <item name="radioButtonStyle">@style/RadioButtonStyle</item>

RadioButton文字和图标之间的间距设置

                <RadioButton
                    android:id="@+id/cater"
                    style="@style/RadioButtonStyle"
                    android:layout_width="wrap_content"
                    android:layout_height="@dimen/dimen_px_40"
                    android:text="@string/cater" />

CheckBoxStyle的style配置

    <style name="RadioButtonStyle" parent="android:Widget.CompoundButton.RadioButton">
        <item name="android:button">@null</item>
        <item name="android:drawableLeft">@drawable/checkbox_bg</item>
        <item name="android:background">@null</item>
        <item name="android:drawablePadding">@dimen/dimen_px_16</item>
    </style>

原本RadioButton设置图标样式，是通过设置android:button属性；现在需要设置文字和图标之间的间距，需要android:drawableLeft和android:drawablePadding属性配合使用，使用android:drawableLeft修改图标样式，使用android:drawablePadding修改文字和图标之间的间距

最终效果：