Android 5.0以上系統常用控制元件著色指南

Knight_Davion發表於2019-03-04
Android控制元件

當我們新建一個Android工程時，Android studio會預設的給我們生成一個AppTheme，內容如下

<resources>

    <!-- Base application theme. -->
    <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>
    </style>

</resources>複製程式碼

colorPrimary，colorPrimaryDark，colorAccent大家應該都已經非常熟悉了，分別控制如下介面中的顏色

Android 5.0以上系統常用控制元件著色指南

下面我們要說的是其他一些和顏色相關的屬性，這些屬性可能你平時並不常用，但合理運用它們不僅可以使你的介面更加絢麗而且可以達到事半功倍的效果。（再次宣告以下屬性適用於5.0及其以上系統）

colorControlHighlight
colorControlHighlight用於控制所有可點選的View的漣漪效果顏色，以button舉例來說
普通狀態下的button

Android 5.0以上系統常用控制元件著色指南

現在我們在AppTheme中新增下面這條屬性

<item name="colorControlHighlight">@color/colorAccent</item>複製程式碼

Android 5.0以上系統常用控制元件著色指南

colorButtonNormal
用於控制normal狀態下button的顏色（注意和button的background屬性的區別，設定colorButtonNormal後button依舊會具有漣漪效果，而設定background就沒有漣漪效果了）
設定colorButtonNormal後button的normal狀態如下
Android 5.0以上系統常用控制元件著色指南

android:navigationBarColor
控制底部導航欄的背景色（注意前邊必須有android:），例如：
Android 5.0以上系統常用控制元件著色指南

下面說一下常用控制元件的顏色屬性

EditText

  • unfocused —— colorControlNormal
  • focus —— colorAccent
  • cursor —— colorAccent
  • text color —— android:textColorPrimary

RadioButton

  • unselected —— colorControlNormal
  • selected —— colorAccent

CheckBox

  • box unchecked —— colorControlNormal
  • box checked —— colorAccent

Toolbar

  • background —— 佈局檔案中設定android:background="?attr/colorPrimary
  • overflow icon —— android:textColorPrimary
  • navigation icon —— android:textColorPrimary
  • action icons —— android:textColorPrimary
  • overflow menu background —— android:colorBackground
  • overflow text color —— android:textColorPrimary

ActionBar

  • background —— colorPrimary
  • title color —— android:textColorPrimary
  • overflow icon —— android:textColorPrimary
  • up button —— android:textColorPrimary
  • action icons —— android:textColorPrimary
  • overflow menu background —— android:colorBackground
  • overflow text color —— android:textColorPrimary

Spinner

  • indicator (not pressed) —— colorControlNormal
  • indicator (pressed) —— colorAccent
  • selected entry text color —— "android:textColorPrimary

SwitchCompat

  • thumb switch off —— colorSwitchThumbNormal
  • thumb switch on —— colorAccent
  • track overlay —— colorAccent"

相關文章