1. 程式人生 > >Android的supportV7中預設按鈕的顏色設定

Android的supportV7中預設按鈕的顏色設定

我們知道,在styles.xml檔案裡面可以設定主題,在主題中設定的一些顏色,將會應用到預設的AppCompat控制元件上,從而很簡單的就可以保持整個APP在UI上的一致性。下面是一個例子:

<style name="AppBaseTheme" parent="Theme.AppCompat.Light.NoActionBar">

    <item name="colorPrimary">@color/colorPrimary</item>
    <!-- 狀態列顏色 -->
    <item name="colorPrimaryDark"
>@color/colorPrimaryDark</item> <!--按鈕選中或者點選獲得焦點後的顏色--> <item name="colorAccent">@color/colorAccent</item> <!--控制searchView的icon顏色的設定--> <item name="colorControlNormal">@color/colorControlNormal</item> <!--Button按鈕正常狀態顏色--> <item
name="colorButtonNormal">@color/accent_material_light</item> <!--EditText 輸入框中字型的顏色--> <item name="editTextColor">@android:color/white</item> <!-- 視窗的背景顏色 --> <item name="android:windowBackground">@android:color/white</item> <!--導航欄上的標題顏色-->
<item name="android:textColorPrimary">@color/black</item> <item name="android:listDivider">@drawable/card_list_divider</item> <item name="textAppearanceLargePopupMenu">@style/splashPopUpMenuStyle</item> <item name="textAppearanceSmallPopupMenu">@style/splashPopUpMenuStyle</item> </style>

至於各種控制元件是如何應用這些顏色設定的,則需要經過更多的嘗試了。
比如Activity導航欄預設的圖示顏色是colorControlNormal,導航欄的底色是colorPrimary,沉浸式狀態列預設的顏色是colorPrimaryDark;
比如FAB的預設顏色是colorAccent;
比如AppCompatCheckBox預設的選中狀態的顏色是colorAccent,而預設的未選擇狀態的顏色的colorControlNormal;
比如AppCompatSpinner的下拉圖示的預設顏色也是colorControlNormal。
……

其實涉及到的主要的就是下面這幾個引數:

<item name="colorPrimary">?attr/colorPrimary</item>
<item name="colorPrimaryDark">?attr/colorPrimaryDark</item>
<item name="colorAccent">?attr/colorAccent</item>
<item name="colorControlNormal">?attr/colorControlNormal</item>
<item name="colorControlActivated">?attr/colorControlActivated</item>
<item name="colorControlHighlight">?attr/colorControlHighlight</item>
<item name="colorButtonNormal">?attr/colorButtonNormal</item>

那麼問題來了,如果你使用藍色的沉浸式狀態列,導航欄上的圖示則使用白色,那在這個Activity中使用AppCompatCheckBox的時候,未選擇狀態就也是白色的,此時如果在白色的背景色下,使用者就看不出這是個AppCompatCheckBox了。這時候怎麼辦?如下圖(圖中使用的是AppCompatSpinner):

顏色不正確

其實很簡單,在這個AppCompatCheckBox上使用app:theme=”@style/MyCheckBox”,然後在styles.xml中新增新的

<style name="MyCheckBox" parent="Widget.AppCompat.CompoundButton.CheckBox">
    <item name="colorControlNormal">@color/colorControlNormal</item>
</style>

但是需要注意的是,這樣可能引起控制元件其他預設屬性的變化,比如CheckBox的textSize會變成1(不使用app:theme的時候和APP的預設字型大小一樣)。

使用了app.theme之後