Android – ActionBarCompat (AppCompat) 的基本套用

Action Bar 是從 Android 3.0 (API Level 11) 開始,Google 官方所使用在 Android 裝置上一個通用的介面,如下圖所示

ActionBar

他是位在每個 APP 最上面狀態列之下的一個主要介面,而這個除了被列在 Android Design Guide 之中,更是現階段官方大力推動的介面之一,這無非是期待所有 Android 使用者在非遊戲類的 APP 中,其使用體驗是一致的。

而為什麼說是現階段呢?因為,現在正是 Android 系統處於新舊版的接交世代時期,在 Android 3.0 之前,也就是 Android 2.x 以前的版本是沒有 Action Bar 這個介面,而各設備的開發廠商也沒有為舊系統提供升級方案。因此,在西元 2013 年末的這個時間點,搭載著 2.x 的裝置在世界上仍有 3x% 的佔有率。

在這樣的狀況下,對諸多有心的開發者來說,要讓自己的 APP 能夠在大多數的裝置上可以呈現出 Action Bar 這個介面,就變成是一個很麻煩的課題,所幸,網路上有很多熱心的開發者,提供出他們開發的 Action Bar Library,其中,最為開發者所知的套件就是 ActionBarSherlock;可是,就算我們使用了這些套件,也仍是會遇到一些問題,比如說,以 ActionBarSherlock 為例,當 Android 釋出了最新一代的系統版本,他就需要升級,以支援最新版本的系統,在這個時候,身為開發者的我們就需要跟著一起升級,嗯~若是我們對該套件的原始碼最變動時,就是一件很麻煩的事情了!

有鑑於此(其實也隔很久了 XD),Android 官方在今年的 Google I/O 2013,為開發者釋出了這個套件:ActionBarCompat,算是替眾開發者解圍了!而這個支援套件的使用方式很頗為簡單,這個套件是 Support Library v7 的其中之一裡,也就是說,官方釋出的這個套件,讓我們可以從 API Level 7 也就是 2.1 以後的版本都可以使用 Action Bar 這個介面。

現在~就為各位介紹如何使用(講了這麼久,終於進入主題了 XD)

接下來先說明一下我們的目標:建立一個新專案,並在新的專案中順利使用 Support Library V7 – ActionBarCompat (在 Library 目錄中的名稱為 appcompat)。

而此範例中的操作步驟目前先以 Eclipse 為主。

範例程式請到 Mosil’s GitHub 取得。再來我們就正式開始了

0. 匯入 Library (Import Library)


Library 的目錄,被放在我們的 ADT Bundle 目錄裡:

<Your ADT Bundle Path>\sdk\extras\android\support\v7\appcompat

找到之後,就在 IDE 裡將之匯入。

File > Import > Android > Existing Android Code Into Workspace

 

1. 建立新專案(Create New Android Application Project)


若您也有將 IDE 的 SDK 升級到最新,在這個時間點之下,我們開啟的新專案版本都會支援到 4.3(API Level 18),而在本範例中最低支援到 2.2 (API Level 8)。

File > New > Android Application Project

建立新專案之後,我們馬上就先分別將他執行在 2.x 以及 4.x 的環境上,可以依序看到下面的兩個畫面

BeginOnAPI8BeginOnAPI15

左邊是用模擬器跑 2.2 的畫面,右邊是 4.x 的設備畫面,很明顯地差異,2.2 的畫面就是非常的…簡單…嗯~您知道我的意思 : P!

 

2. Action Bar Style Generator


Action Bar Style Generator 是一套線上針對 ActionBar 所需之圖片、Layout 以及相關色調的產生器,如下圖所示

ActionBar Generator

需要注意到的有兩個地方,1. Style Name 以及 2. Style compatibility ;前者是我們要呼叫的風格名稱,後者是我們這個風格要相容於哪一個預設主題,請注意,這個項目我們要選擇「AppCompat」,而其他的就隨意嘍!全部的選項都確定之後,只要點擊3. DOWNLOAD .ZIP 下載到本機的壓縮檔裡就是我們專案所需要的資源目錄-「res」,解壓縮後,直接複製進我們的專案裡面即可。若是懶得自己設定的朋友,可以直接拿本範例的設定去嘗試修改看看

ActionBar Style Generator Files

 

3. 引用 ActionBar Compat Library (Include Support Library – ActionBar Compat)


當我們把整個資源目錄「res」複製進我們的專案時,會先面臨到第一個問題- Style 本身就會發生諸多錯誤,如下圖

ActionBar Error

這時候,我們只需要將在一開始匯入的 Library 加進專案裡即可

Project > Properties > Android > Add

Add Support Library
等他引用完畢後,我們原本看到紅色叉叉就不見了~看起來順眼多了!

再來我們打開 res\values\style.xml ,可以看到下面這段程式碼

這邊只需要更動一個地方,將

<style name=”AppBaseTheme” parent=”android:Theme.Light”>

更改為

<style name=”AppBaseTheme” parent=”Theme.Mosil“>

而  Theme.Mosil 是來自於我們從 ActionBar Style Generator 所得來的 Style name,可以在放進來的資源檔裡 res\values\styles_<your_style_name>.xml看到。風格檔改完之後,我們就能到 MainActivity.java 裡最做後的更改了,一樣也只需要修改一處。

public class MainActivity extends Activity {

將本來繼承的 Activity 改為 ActionBarActivity 即可,如下

public class MainActivity extends ActionBarActivity

這個時候,我們就能夠將他執行在我們 2.2 的模擬器上了!如下圖

ActionBar On API 8

開心吧!我們在 2.2 的環境下,也看得到我們自定義 ActionBar Style 嘍!不過!別急,還沒有結束~

 

4. 問題與例外 (Problem & Exception)


其實,在最後這裡,您依著步驟這樣做下來,將他執行在 4.x 的環境上是會發生 「Caused by: java.lang.IllegalStateException: You need to use a Theme.AppCompat theme (or descendant) with this activity.」 這個 Exception ;或是心急一點的,在還未將 Activity 的繼承改為 ActionBarActivity 時就執行他,我們會在 4.x 的環境看不到自定義的風格,同時在 2.x 的環境中,上面的 標題列 都直接不見了!

我們先來看一張圖

ActionBar Style Generator Files

這張圖是我們從 AndroidBar Style Generator 打包回來的所有資源目錄內容,再來我們先看到下圖的左邊

FileListByDefault

左邊是我們在建立專案時,系統預設建立的目錄檔案,其中多了「values-v11」這個 3.x 的風格目錄這是其一;另外「values-v14」裡面雖然也有帶入了 styles_<your_style_name>.xml 這個檔案,但是,其 styles.xml 裡跟 values-v11 是一樣的,所以只要將兩個目錄裡 styles.xml 中的 style parent

<style name=”AppBaseTheme” parent=”android:Theme.Holo.Light”>

做如下修改即可

<style name=”AppBaseTheme” parent=”Theme.Mosil“>

這時候,我們再實際地另之分別在 2.2 的模擬器上,以及 4.x 的設備上,如此便可以在 2.1 以上的平臺上看到 ActionBar 嘍!

FinalOnAPI16

 

本部落格採用創用CC 姓名標示-非商業性-禁止改作 3.0 台灣 授權條款授權,如欲轉載請記得註明「莫希爾(Mosil) 手札

Loading Facebook Comments ...

2 關於 “Android – ActionBarCompat (AppCompat) 的基本套用” 的評論

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *