我们在做项目时经常会碰到要求改变系统的自带控件如CheckBox、RadioButton、AlertDialog等的颜色或者样式的要求，采用的方式往往也有很多种，这里将常用的几种方式记录一下。
以RadioButton为例，通常UX会给两张切图，分别是选中和非选中状态的圆形选择框图标，然后在drawable中新建一个radio_button_bg.xml的文件作为选择框的背景：
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@drawable/radio_button_on" />
<item android:drawable="@drawable/radio_button_off" />
</selector>
接着采用的方式可以是
1、直接设置android:button属性：
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:button="@drawable/radio_button_bg"
android:text="选项一"/>
这种方式的缺陷是UX给的图标往往是固定尺寸的，可能显示出来的大小效果很差，但又无法设置button图标的尺寸。
2、采用RadioButton和TextView结合的方式，其中RadioButton仅用于显示图标，因此可以直接设置宽高，由TextView来显示文字：
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<RadioButton
android:layout_width="@dimen/x36"
android:layout_height="@dimen/x36"
android:button="@drawable/radio_button_bg"
android:checked="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="选项一"/>
</LinearLayout>
然而这种方式仅在点击RadioButton的时候有效果，点击文字无反应，如果需要点击整个视图都选中，必须实现自定义View，并且这样封装后，即使放在RadioGroup中，也无法实现单选的效果，必须自己实现单选逻辑以及选择的监听。另外还可以将RadioButton换成ImageView，但同样也需要自定义View来完成点击整个选中以及单选的功能。
3、实现继承自RadioButton的自定义View：
public class CustomRadioButton extends RadioButton {
public CustomRadioButton(Context context) {
super(context);
initDrawable();
}
public CustomRadioButton(Context context, AttributeSet attrs) {
super(context, attrs);
initDrawable();
}
public CustomRadioButton(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initDrawable();
}
private void initDrawable() {
int size = Utils.getDimen(R.dimen.x36);
int padding = Utils.getDimen(R.dimen.x10);
Drawable drawable = Utils.getDrawable(R.drawable.radio_button_bg);
drawable.setBounds(0, 0, size, size);
setCompoundDrawables(drawable, null, null, null);
setCompoundDrawablePadding(padding);
setButtonDrawable(null);
}
}
这里通过设置leftDrawable来设置图标，由于leftDrawable可以设置Bounds和Padding，因此可以将图标设置成合适的尺寸。另外需要将ButtonDrawable设成null，以去掉系统自带的图标。接着就可以像使用RadioButton一样使用CustomRadioButton了。
4、之前我往往采用的第三种方式，直到今天突然发现了一种更好更方便的方式，那就是利用系统的Theme。
起因在于UX对项目中的弹框AlertDialog的按钮文字颜色不满意，想要换成应用统一的主题色，但是我们的AlertDialog是直接采用的系统的，并没有做自定义的弹框，又不想为了这个小细节另外做自定义的弹框，然后搜寻一下，就看到了这篇文章：http://www.jianshu.com/p/fb671e11e455 在此感谢一下作者。总的来说，就是根据应用的Theme一层层点进去寻找跟自己要改动的目标有关的属性，找到后仿照系统的属性值，在自己的styles.xml里面重写：
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<!--弹框样式-->
<item name="alertDialogTheme">@style/AlertDialog</item>
<!--单选框-->
<item name="android:listChoiceIndicatorSingle">@drawable/radio_button_bg</item>
<!--多选框-->
<item name="android:listChoiceIndicatorMultiple">@drawable/checkbox_bg</item>
</style>
<style name="AlertDialog" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="colorAccent">#12b7f5</item>
</style>
找寻AlertDialog的按钮文字颜色的过程这里就不重复了，可以参考上面提到的文章，这里主要讲一下RadioButton和CheckBox的图标的修改。同样从Theme.AppCompat.Light.DarkActionBar的parent一层层点进去，最后找到Platform.AppCompat.Light里面的：
<item name="android:listChoiceIndicatorSingle">@drawable/abc_btn_radio_material</item>
<item name="android:listChoiceIndicatorMultiple">@drawable/abc_btn_check_material</item>
这两个属性分别对应单选框RadioButton和多选框CheckBox的图标，点开abc_btn_radio_material和abc_btn_check_material可以看到这两个xml文件的内容分别是：
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@drawable/abc_btn_radio_on_mtrl" />
<item android:drawable="@drawable/abc_btn_radio_off_mtrl" />
</selector>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:drawable="@drawable/abc_btn_checkbox_checked_mtrl" />
<item android:drawable="@drawable/abc_btn_checkbox_unchecked_mtrl" />
</selector>
再次点进里面的具体图片如abc_btn_radio_on_mtrl，发现是svg格式的图片，难怪尺寸不用适配就很合适：
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
android:name="btn_radio_to_off_mtrl"
android:width="32dp"
android:viewportWidth="32"
android:height="32dp"
android:viewportHeight="32">
<group
android:name="btn_radio_to_off_mtrl_0"
android:translateX="16"
android:translateY="16" >
<group
android:name="ring_outer" >
<path
android:name="ring_outer_path"
android:strokeColor="#FF000000"
android:strokeWidth="2"
android:pathData="M 0.0,-9.0 c 4.9705627482,0.0 9.0,4.0294372518 9.0,9.0 c 0.0,4.9705627482 -4.0294372518,9.0 -9.0,9.0 c -4.9705627482,0.0 -9.0,-4.0294372518 -9.0,-9.0 c 0.0,-4.9705627482 4.0294372518,-9.0 9.0,-9.0 Z" />
</group>
<group
android:name="dot_group" >
<path
android:name="dot_path"
android:pathData="M 0.0,-5.0 c -2.7619934082,0.0 -5.0,2.2380065918 -5.0,5.0 c 0.0,2.7619934082 2.2380065918,5.0 5.0,5.0 c 2.7619934082,0.0 5.0,-2.2380065918 5.0,-5.0 c 0.0,-2.7619934082 -2.2380065918,-5.0 -5.0,-5.0 Z"
android:fillColor="#FF000000" />
</group>
</group>
</vector>
其中里面的 android:strokeColor 和 android:fillColor 就是我们想要改变的选择框的边框和内部填充的颜色。因此，直接将这四个svg图片和两个selector的xml文件都拷到自己的res/drawable下面，改个名字，然后将svg文件里面的 android:strokeColor 和 android:fillColor 改成想要的颜色就可以了。
其实之前的主要问题就在于图标的尺寸不好做适配，如果UX直接提供了svg的图标，那么直接采用第一种方式也是ok的，当然，采用第四种方式可以避免在每个RadioButton和CheckBox里面去设置android:button属性，更加方便。总的来说，以后要是想修改系统的控件的样式，可以先尝试去寻找Theme里面对应的属性，然后仿造系统的属性值来实现我们自己的属性值。
