Material Designer的低版本兼容實現（二）—— Theme

Theme

material主題可以定義為如下形式：

• @android:style/Theme.Material 
• @android:style/Theme.Material.Light
• @android:style/Theme.Material.Light.DarkActionBar

我們可以在vlues-v21中的styles.xml文件中繼承這些主題，然后定制一些屬性。在v21中可以做如下修改

<resources>  
  <!-- inherit from the material theme -->  
  <style name="AppTheme" parent="android:Theme.Material">  
    <!-- Main theme colors -->  
    <!--   your app's branding color (for the app bar) -->  
    <item name="android:colorPrimary">@color/primary</item>  
    <!--   darker variant of colorPrimary (for status bar, contextual app bars) -->  
    <item name="android:colorPrimaryDark">@color/primary_dark</item>  
    <!--   theme UI controls like checkboxes and text fields -->  
    <item name="android:colorAccent">@color/accent</item>  
  </style>  
</resources> 

 

這里設置了幾個主題顏色

注：

<item name="android:colorAccent">#00FF00</item>

colorAccent是設置像是CheckBox的顏色

 

接下來，我們主要來看看在低版本中應該如何設置

color.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimaryDark">#3367d6</color>
    <color name="colorPrimary">#4285f4</color>
    <color name="windowBackground">#eeeeee</color>
    
</resources>

 

styles.xml

<resources xmlns:android="http://schemas.android.com/apk/res/android">

    <!--
        Base application theme, dependent on API level. This theme is replaced
        by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
    -->
    <style name="AppBaseTheme" parent="Theme.AppCompat">
        <!--
            Theme customizations available in newer API levels can go in
            res/values-vXX/styles.xml, while customizations related to
            backward-compatibility can go here.

        -->
    </style>

    <!-- Application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">

        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/primary_material_light</item>
        <item name="android:textColorPrimary">@android:color/white</item>
        <item name="android:windowNoTitle">true</item>
        <item name="windowActionBar">false</item>
    </style>

</resources>

 

這樣我們就設置好了類似於下面的效果：

現在我們終於在高版本上能改變status bar的顏色了，這個在以前是不可能的。話說4.4也支持這個。下面我們來詳細看看在低版本中我們如何讓自己的主題完美工作。

1.首先繼承一個Compat的主題

在compat包中我們可以看到有很多主題，我們找到給activity用的，發現也就下面紅框里這么幾個，看名字就能知道是什么了。

<resources>

    <!-- Themes in the "Theme.AppCompat" family will contain an action bar by default.
         If Holo themes are available on the current platform version they will be used.
         A limited Holo-styled action bar will be provided on platform versions older
         than 3.0. (API 11)

         These theme declarations contain any version-independent specification. Items
         that need to vary based on platform version should be defined in the corresponding
         "Theme.Base" theme. -->

    <!-- Platform-independent theme providing an action bar in a dark-themed activity. -->
    <style name="Theme.AppCompat" parent="Base.Theme.AppCompat" />

    <!-- Platform-independent theme providing an action bar in a light-themed activity. -->
    <style name="Theme.AppCompat.Light" parent="Base.Theme.AppCompat.Light" />

    <!-- Platform-independent theme providing an action bar in a dark-themed activity. -->
    <style name="Theme.AppCompat.Light.DarkActionBar" parent="Base.Theme.AppCompat.Light.DarkActionBar" />

    <style name="Theme.AppCompat.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="android:windowNoTitle">true</item>
    </style>

    <style name="Theme.AppCompat.Light.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="android:windowNoTitle">true</item>
    </style>

繼承Theme.AppCompat，效果↓

  

 

繼承Theme.AppCompat.Light效果↓

  

繼承Theme.AppCompat.Light.DarkActionBar效果↓

  

 

此外，在Android的4.4添加了View.SYSTEM_UI_FLAG_IMMERSIVE和View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY。這兩個標記可以實現所謂的沉浸式狀態欄，個人感覺翻譯的不好，應該叫做一種狀態欄模式。這些標記的作用是在應用（比如視頻）在需要全屏時抹去狀態欄，但是在退出視頻時又能回來。准確來說是叫：ImmersiveMode或者是Translucent Modes，總之是一種模式。

詳細可以看這篇文章：http://www.tuicool.com/articles/RVRneq

在Smooth中已經實現了4.4上的效果，具體如下：

  

總之呢，在之前的版本上狀態欄上面還是不能由我們隨意定制的，4.4除外。但也有好消息，那就是ActionBar可以被我們再一次定制了，而且可以兼容之前的設備，利用的是ToolBar這個新控件。關於Toolbar的使用，我們以后會講到。