Android 5.x--使用Material Theme加Palette

標籤：android   theme   android-l   

Android5.0較之以前的版本，有一個比較大的改變：在Android5.x中支援Material Design的主題風格，這對於視覺上將是一個重大的改變。新的主題風格給人的感覺眼前一亮，原來Android也可以這麼美，相信通過不斷完善，Android也將越來越強大。那麼今天就介紹一下，如何使用這讓人眼前一亮的主題吧。

開始使用

目前只有在Android5.0之上的版本才可以支援Material的主題風格，這樣我們首先在res/values-v21/styles.xml檔案中定義使用Material主題。

<resources>    <style name="AppTheme" parent="android:Theme.Material.Light">       </style></resources>

注意直接在values/styles.xml檔案之中修改的話，編譯器會提示：當前支援的最低的API版本中不存在該主題。

定製自己的主題

Android開發人員官網中給出一張圖片，形象的告訴我們Material主題所支援修改的顏色屬性，方便我們定製自己的主題：

這樣我們就可以修改這些值來定製自己的主題了：

<resources>    <style name="AppTheme" parent="android:Theme.Material.Light">        <item name="android:colorPrimary">#00ffff</item>        <item name="android:colorPrimaryDark">#0000ff</item>        <item name="android:navigationBarColor">#0000ff</item>        <item name="android:textColorPrimary">#fff</item>    </style></resources>

在Android5.0的模擬器上運行一下吧，

怎麼樣，連標題列和底部的導覽列都可以改變顏色了，而且連Actionbar都和以前不一樣了，是不是很酷炫。

同時Android也允許你使用android:statusBarColor屬性，或者使用Window.setStatusBarColor方法快速設定狀態列的顏色。

適配較低的Android版本

一切都很好，只是我的主題只能在5.0之上的版本才能用嗎，太掃興了吧。別擔心，Google當然也會為低版本提供支援，讓我們看看怎麼做吧。

1.在Android studio中，首先來增加下面的Gradle相依模組到工程中來：

dependencies {    ......    compile ‘com.android.support:appcompat-v7:22.0.0‘}

接著我們在values/style.xml檔案中添加自己的主題，注意這時我們不再使用android:Theme.Material.XXX的主題，而是使用依賴庫中的主題Theme.AppCompat.XXX，同時不再需要values-v21/style.xml中的android:Theme.Material.XXX主題。

<style name="AppTheme" parent="Theme.AppCompat.Light">        <!-- Customize your theme here. -->        <item name="colorPrimary">#0ff</item>        <item name="colorPrimaryDark">#00f</item>        <item name="colorAccent">#fff</item></style>

測試中發現textColorPrimary屬性的名稱改為了colorAccent

2.在Eclipse中，我們需要升級到最新的ADT以及SDK，在WorkSpace中匯入appcompat-v7的library工程，之後的使用步驟是一模一樣的，大家可以試一試。

Palette的使用

同時，在Android 5.0中Google還發布了一個新的類Palette協助我們提取Bitmap中顏色值，讓我更方便的定製自己的主題，一起來看看吧。

這個類能提取以下突出的顏色：

• Vibrant(清爽的)
• Vibrant dark(清爽的暗色)
• Vibrant light(清爽的亮色)
• Muted(柔和的)
• Muted dark(柔和的暗色)
• Muted lighr(柔和的亮色)

使用Palette

首先在使用之前，我們需要引用該依賴庫到我們的工程中來：

dependencies {      ...      compile ‘com.android.support:palette-v7:21.0.+‘  }  

通過調用Palette的靜態方法generate或generateAsync可以協助我們提取顏色值，提取顏色的過程必須在非同步線程中執行。

注意，generate方法不允許在主線程中調用，如果自己沒有使用非同步線程，可以使用generateAsync方法去協助我們開啟一個非同步線程，並監聽回調事件。

Palette.generateAsync(bitmap,        new Palette.PaletteAsyncListener() {    @Override    public void onGenerated(Palette palette) {         Palette.Swatch vibrant =                 palette.getVibrantSwatch();          if (vibrant != null) {              // If we have a vibrant color             .......          }    }});

從View獲得Bitmap

傳入的對象必須是一個Bitmap對象，那麼如何從一個View轉化為Bitmap呢，我們可以通過畫布繪製來實現：

private Bitmap getViewBitmap(View v) {    v.clearFocus();    v.setPressed(false);    boolean willNotCache = v.willNotCacheDrawing();    v.setWillNotCacheDrawing(false);    int color = v.getDrawingCacheBackgroundColor();    v.setDrawingCacheBackgroundColor(0);    if (color != 0) {        v.destroyDrawingCache();    }    v.buildDrawingCache();    Bitmap cacheBitmap = v.getDrawingCache();    if (cacheBitmap == null) {        return null;    }    Bitmap bitmap = Bitmap.createBitmap(cacheBitmap);    // Restore the view    v.destroyDrawingCache();    v.setWillNotCacheDrawing(willNotCache);    v.setDrawingCacheBackgroundColor(color);    return bitmap;}

接下來我們來用一下吧，通過提取Activity的整個布局中較安的柔和顏色，並把它設定給狀態列上。

package com.example.acer.materialtest;import android.graphics.Bitmap;import android.graphics.Canvas;import android.support.v7.app.ActionBarActivity;import android.os.Bundle;import android.support.v7.graphics.Palette;import android.view.View;import android.widget.LinearLayout;public class MainActivity extends ActionBarActivity {    private LinearLayout containLayout;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        containLayout = (LinearLayout) findViewById(R.id.contain_layout);        Bitmap bitmap = getViewBitmap(containLayout);        if (bitmap != null)            Palette.generateAsync(bitmap,                    new Palette.PaletteAsyncListener() {                        @Override                        public void onGenerated(Palette palette) {                            Palette.Swatch swatch =                                    palette.getDarkMutedSwatch();                            if (swatch != null) {                               getWindow().setStatusBarColor(swatch .getRgb());                            }                        }                    });    }    private Bitmap getViewBitmap(View v) {        v.clearFocus();        v.setPressed(false);        boolean willNotCache = v.willNotCacheDrawing();        v.setWillNotCacheDrawing(false);        // Reset the drawing cache background color to fully transparent        // for the duration of this operation        int color = v.getDrawingCacheBackgroundColor();        v.setDrawingCacheBackgroundColor(0);        if (color != 0) {            v.destroyDrawingCache();        }        v.buildDrawingCache();        Bitmap cacheBitmap = v.getDrawingCache();        if (cacheBitmap == null) {            return null;        }        Bitmap bitmap = Bitmap.createBitmap(cacheBitmap);        // Restore the view        v.destroyDrawingCache();        v.setWillNotCacheDrawing(willNotCache);        v.setDrawingCacheBackgroundColor(color);        return bitmap;    }}

效果如下：

Android 5.x--使用Material Theme加Palette