??????小菜一直在處理動態(tài)配置頁面顏色方面的工作庐船,包括各布局,各控件等榄棵,而小菜卻在最常用最基本的 CheckBox 選項(xiàng)框這個(gè)控件卻栽了跟頭敲长,折騰了好久,今天有機(jī)會總結(jié)整理一下秉继。
??????大家都很熟悉祈噪,xml 在很多時(shí)候大大節(jié)省了我們的開發(fā)時(shí)間,但 xml 里面配置的樣式只有默認(rèn)的尚辑,在動態(tài)修改方面還是要靠 Java/Kotlin 代碼優(yōu)化辑鲤。基本上 xml 中可以配置的屬性在 Java/Kotlin 代碼中都有相對應(yīng)的方法杠茬,然而小菜在對應(yīng)使用 CheckBox 控件的 android:buttonTint="@color/colorAccent" 屬性時(shí)月褥,卻不盡如人意弛随,不僅在設(shè)置過程中需要版本大于21,更重要的是設(shè)置完之后并不起效果宁赤。小菜也查閱了不少資料舀透,請教了幾位大神,依舊沒有解決問題决左。
??????實(shí)在沒辦法懊缺,小菜決定放棄 CheckBox 轉(zhuǎn)投 v7 包中的 AppCompatCheckBox暂刘,通過設(shè)置 setSupportButtonTintList 方法來動態(tài)修改選項(xiàng)框顏色。
小菜的步驟如下:
- 設(shè)置兩個(gè)默認(rèn)的 CheckBox 選中/未選中 狀態(tài)作為參照,如圖中第一行号坡;
- 設(shè)置兩個(gè) AppCompatCheckBox 默認(rèn)通過設(shè)置 style.xml 主題色配置吨凑,可實(shí)現(xiàn)與 CheckBox 效果一致耕捞,如圖中第二行负溪,但并非小菜想要的方式;
<style name="MyCheckBox" parent="Theme.AppCompat.Light">
<item name="colorControlNormal">@color/avoscloud_feedback_text_gray</item>
<item name="colorControlActivated">@color/colorPrimary</item>
</style>
<style name="MyCheckBox2" parent="Theme.AppCompat.Light">
<item name="colorControlNormal">@color/avoscloud_feedback_text_gray</item>
<item name="colorControlActivated">@color/colorPrimaryDark</item>
</style>
- 設(shè)置兩個(gè) AppCompatCheckBox 在 Java/Kotlin 代碼中設(shè)置 setSupportButtonTintList 方法婴渡,但是在未選中狀態(tài)下幻锁,選擇框依舊是配置的主題色,與 CheckBox 默認(rèn)的灰色不一致边臼,如圖中第三行越败,仍需優(yōu)化;
accb.setSupportButtonTintList(ColorStateList.valueOf(getResources().getColor(R.color.colorAccent)));
- 設(shè)置兩個(gè) AppCompatCheckBox 在 Java/Kotlin 代碼中不僅設(shè)置 setSupportButtonTintList 方法硼瓣,且監(jiān)聽 CompoundButton.OnCheckedChangeListener 方法究飞,再監(jiān)聽選中和未選中狀態(tài)中對選項(xiàng)框顏色做處理。
accb.setSupportButtonTintList(BitmapUtil.createColorStateList(Color.GRAY, Color.RED, Color.RED,Color.RED));
accb.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton compoundButton, boolean b)
{
if(b){
accb.setSupportButtonTintList(BitmapUtil.createColorStateList(Color.RED, Color.RED, Color.RED,Color.RED));
}else{
accb.setSupportButtonTintList(BitmapUtil.createColorStateList(Color.GRAY, Color.RED, Color.RED,Color.RED));
}
}
});
Tips1: 若 Java/Kotlin 代碼與 style.xml 均設(shè)置樣式堂鲤,以 Java/Kotlin 代碼樣式為主亿傅。
Tips2: 在設(shè)置 setSupportButtonTintList 方法時(shí),初始狀態(tài)為選中時(shí)瘟栖,顏色列表第一個(gè)應(yīng)為配置的顏色值葵擎;若為未選中時(shí),顏色列表第一個(gè)應(yīng)為默認(rèn)系統(tǒng)灰色半哟。
// 工具類 繪制不同狀態(tài)的顏色
public class BitmapUtil {
/**
* 對TextView設(shè)置不同狀態(tài)時(shí)其文字顏色
* @param normal
* @param pressed
* @param focused
* @param unable
* @return
*/
public static ColorStateList createColorStateList(int normal, int pressed, int focused, int unable) {
int[] colors = new int[] { pressed, focused, normal, focused, unable, normal };
int[][] states = new int[6][];
states[0] = new int[] { android.R.attr.state_pressed, android.R.attr.state_enabled };
states[1] = new int[] { android.R.attr.state_enabled, android.R.attr.state_focused };
states[2] = new int[] { android.R.attr.state_enabled };
states[3] = new int[] { android.R.attr.state_focused };
states[4] = new int[] { android.R.attr.state_window_focused };
states[5] = new int[] {};
ColorStateList colorList = new ColorStateList(states, colors);
return colorList;
}
}
// Java 對 AppCompatCheckBox 繪制顏色
public class CheckBoxActivity extends AppCompatActivity {
AppCompatCheckBox accb1, accb2, accb3, accb4, accb5, accb6;
TextView mTitleTv;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_checkbox);
mTitleTv = (TextView) this.findViewById(R.id.tv_toolbar_title);
mTitleTv.setText("Java 動態(tài)修改 CheckBox 顏色");
accb1 = (AppCompatCheckBox) this.findViewById(R.id.accb1);
accb2 = (AppCompatCheckBox) this.findViewById(R.id.accb2);
accb3 = (AppCompatCheckBox) this.findViewById(R.id.accb3);
accb4 = (AppCompatCheckBox) this.findViewById(R.id.accb4);
accb5 = (AppCompatCheckBox) this.findViewById(R.id.accb5);
accb6 = (AppCompatCheckBox) this.findViewById(R.id.accb6);
accb3.setSupportButtonTintList(ColorStateList.valueOf(getResources().getColor(R.color.colorAccent)));
accb4.setSupportButtonTintList(ColorStateList.valueOf(Color.GREEN));
accb5.setSupportButtonTintList(BitmapUtil.createColorStateList(getResources().getColor(R.color.colorAccent), getResources().getColor(R.color.colorAccent), getResources().getColor(R.color.colorAccent), getResources().getColor(R.color.colorAccent)));
accb5.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
if (b) {
accb5.setSupportButtonTintList(BitmapUtil.createColorStateList(getResources().getColor(R.color.colorAccent), getResources().getColor(R.color.colorAccent), getResources().getColor(R.color.colorAccent), getResources().getColor(R.color.colorAccent)));
} else {
accb5.setSupportButtonTintList(BitmapUtil.createColorStateList(Color.GRAY, getResources().getColor(R.color.colorAccent), getResources().getColor(R.color.colorAccent), getResources().getColor(R.color.colorAccent)));
}
}
});
accb6.setSupportButtonTintList(BitmapUtil.createColorStateList(Color.GRAY, Color.GREEN, Color.GREEN, Color.GREEN));
accb6.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
if (b) {
accb6.setSupportButtonTintList(BitmapUtil.createColorStateList(Color.GREEN, Color.GREEN, Color.GREEN, Color.GREEN));
} else {
accb6.setSupportButtonTintList(BitmapUtil.createColorStateList(Color.GRAY, Color.GREEN, Color.GREEN, Color.GREEN));
}
}
});
}
}
// xml 布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="@layout/common_title" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="12dp"
android:paddingTop="12dp"
android:text="系統(tǒng)默認(rèn) CheckBox"
android:textColor="@color/colorAccent" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="12dp">
<CheckBox
android:id="@+id/cb1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:checked="true"
android:text="默認(rèn)已選中" />
<CheckBox
android:id="@+id/cb2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:checked="false"
android:text="默認(rèn)未選中" />
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="12dp"
android:paddingTop="12dp"
android:text="AppCompatCheckBox style.xml 主題色配置"
android:textColor="@color/colorPrimary" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="12dp">
<android.support.v7.widget.AppCompatCheckBox
android:id="@+id/accb1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:checked="true"
android:text="默認(rèn)已選中"
android:theme="@style/MyCheckBox" />
<android.support.v7.widget.AppCompatCheckBox
android:id="@+id/accb2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:checked="false"
android:text="默認(rèn)未選中"
android:theme="@style/MyCheckBox2" />
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="12dp"
android:paddingTop="12dp"
android:text="AppCompatCheckBox Java 代碼顏色配置"
android:textColor="@color/colorAccent" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="12dp"
android:paddingTop="12dp"
android:text="但未選中狀態(tài)中與系統(tǒng)灰色不一致,需修改" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="12dp">
<android.support.v7.widget.AppCompatCheckBox
android:id="@+id/accb3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:checked="true"
android:text="默認(rèn)已選中"
android:theme="@style/MyCheckBox" />
<android.support.v7.widget.AppCompatCheckBox
android:id="@+id/accb4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:checked="false"
android:text="默認(rèn)未選中"
android:theme="@style/MyCheckBox" />
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="12dp"
android:paddingTop="12dp"
android:text="與系統(tǒng)默認(rèn)的 CheckBox 樣式基本一致" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="12dp">
<android.support.v7.widget.AppCompatCheckBox
android:id="@+id/accb5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:checked="true"
android:text="默認(rèn)已選中" />
<android.support.v7.widget.AppCompatCheckBox
android:id="@+id/accb6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:checked="false"
android:text="默認(rèn)未選中" />
</LinearLayout>
</LinearLayout>
來源: 阿策小和尚