對於技術類的部落格，我們永遠追尋最新API腳步，在API22之前我們使用標題欄基本都是在ActionBarActivity的Activity中處理的，而API22之後，谷歌遺棄了ActionBarActivity，推薦我們也可以說是強制我們使用AppCompatActivity。

然而ActionBarActivity與AppCompatActivity的使用大同小異，下面我們將介紹最新的Activity元件之AppCompatActivity的使用。

最後的效果與微信基本相同，圖如下：

1.初探AppCompatActivity

我們按照AndroidStudio的預設順序建立專案，預設Activity繼承自AppCompatActivity。程式碼如下：

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

執行提到如下所示的介面：

其結果與繼承自Activity並無二致，醜爆了。下面我們來一步一步擴充套件其標題欄，讓他的內容更豐富多彩。

2.AppCompatActivity與Toolbar結合

其實我們並不是要使用AppCompatActivity自帶的標題欄，那樣擴充套件會很麻煩，在14年的Android 5.0的時候就用Toolbar替代了ActionBar,而ActionBarActivity又被AppCompatActivity替代，那麼使用方法就是引入Toolbar設定到Activity中。

㈠首先我們必須在配置檔案中，寫入Toolbar，程式碼如下：

<android.support.v7.widget.toolbar android:id="@+id/activity_main_toolbar" android:layout_height="wrap_content" android:layout_width="match_parent" android:minheight="?attr/actionBarSize" android:background="?attr/colorPrimary">
    
</android.support.v7.widget.toolbar>
 

解釋①android:minHeight="?attr/actionBarSize"：設定標題欄最小高度為ActionBar的高度。

解釋②android:background="?attr/colorPrimary"：該主題下的主色。也就是預設的灰色。

我們知道在AndroidManifest.xml清單檔案下application中設定了android:theme="@style/AppTheme"而檢視AppTheme看到如下樣式

<resources>
    <!--{cke_protected}{C}%3C!%2D%2D%20Base%20application%20theme.%20%2D%2D%3E--><style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!--{cke_protected}{C}%3C!%2D%2D%20Customize%20your%20theme%20here.%20%2D%2D%3E--></style>
</resources>

從名字我們就可以看出來，預設的標題欄為黑色。我們使用了toolbar就必須修改樣式檔案，將原來的標題欄去掉，修改後的樣式檔案如下：

<resources>
    <!--{cke_protected}{C}%3C!%2D%2D%20Base%20application%20theme.%20%2D%2D%3E--><style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!--{cke_protected}{C}%3C!%2D%2D%20Customize%20your%20theme%20here.%20%2D%2D%3E--></style>
</resources>

如下這個時候執行，那麼你將看到介面也是沒有標題欄的，因為你並沒有設定到AppCompatActivity中去。

㈡將Toolbar顯示到介面

我們建立一個方法名為initActionBar()，首先當然是獲取ToolBar控制元件，然後將Toolbar設定到Activity中去。程式碼如下：

public void initActionBar() {
    Toolbar toolbar = (Toolbar) findViewById(R.id.activity_main_toolbar);
    setSupportActionBar(toolbar);
}

現在執行，我們將得到如下介面：

依然不是你期待的效果，下面我們將介紹AppCompatActivity的細節。

3.AppCompatActivity詳解

㈠設定title

我們可以看到，標題欄始終顯示我們的專案名，這樣顯然給使用者看是不理想的。那麼怎麼設定標題欄的字串。我們可以在setSupportActionBar(toolbar)之前加入如下程式碼：

setTitle("liyuanjinglylyj");

此setTitle("liyuanjinglyj")是AppCompatActivity的方法，並不是toolbar的方法，那麼我們執行一下程式將得到如下介面：

那麼我們將剛才的AppCompatActivity的setTitle換成Toolbar的setTitle看看效果會怎麼樣，其實結果如上圖一樣，沒有任何變化。

可能你希望title顯示在中間，很遺憾，toolbar與AppCompatActivity並沒有提供相關的方法，不過可以在toolbar中加入一個TextView，配置其屬性，讓其顯示在最中間。

㈡設定回退按鈕

假如我的這個介面並不是主介面，而是一個子介面，這個時候我有一個需求，需要回退到上一個介面那麼怎麼設定左邊的圖示並實現其方法。其實很簡單，在setSupportActionBar(toolbar);後面加入如下程式碼：

toolbar.setNavigationIcon(R.drawable.back);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        finish();
    }
});

為什麼在setSupportActionBar(toolbar);後面加入而不在前面，你可以加入到前面試試，雖然可以顯示回退的圖片，但是點選並沒有呼叫該按鈕的點選事件，而在setSupportActionBar(toolbar);後面設定點選才有反應。一定要記住，不然回退是不會起作用的。

執行結果如下：

㈢設定logo

設定logo在標題欄並不少見，比如網易APP首頁就的網易設定的logo，其實程式碼很簡單，也僅僅需要一條程式碼即可，在setSupportActionBar(toolbar)前加入如下程式碼：

toolbar.setLogo(R.id.app_logo);

執行結果如下：

㈣設定副標題

在setSupportActionBar(toolbar)前加入如下程式碼：：

toolbar.setSubtitle("liyuanjing");

執行介面後，如下：

㈤設定選單

我們知道onCreateOptionsMenu是上下文選單，同理可以直接在該方法中設定選單，程式碼如下：

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_main, menu);
    return  true;
}

此方法為Activity方法。因為你在上面已經講Toolbar設定到了Activity中，所以預設也會顯示到標題欄中，如果你覺得這樣不習慣，那麼你可以新增一條語句，不過這條語句新增不新增都沒關係。

toolbar.setOnCreateContextMenuListener(this);

執行程式，如下圖所示：

4.Toolbar的Style

3標題下的Toolbar是藍色，且有很好Style，那麼這是怎麼設定呢，雖然我們這裡重點是剖析Activity但是遇到有關Activity標題欄樣式的還是要提到。

我們粗略的講解上面的標題欄用到了哪些Style：

①#4876FF：如第一步直接在toolbar控制元件下面設定的屬性一樣，就是toolbar的顏色。

②#3A5FCD：狀態列顏色也就是標題欄上面的那個顏色，而我用的是小米1S測試的，其韌體並沒有很好的實現其功能，所以在該系統下並沒有實現其效果。

③@android:color/white：視窗背景色，也就是Activity標題欄下面所有地方的顏色。

當我們設定瞭如上三個屬性，那麼效果圖就如上面所示了，完整程式碼如下：
 

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- toolbar（actionbar）顏色 -->
    <item name="colorPrimary">#4876FF</item>
    <!-- 狀態列顏色 -->
    <item name="colorPrimaryDark">#3A5FCD</item>
    <!-- 視窗的背景顏色 -->
    <item name="android:windowBackground">@android:color/white</item>
    
</style>

5.Toolbar選單樣式

我們來看看如果直接使用上面的點選後邊的選單會有什麼效果：

你有看到那個APP選單彈出擋住了標題欄嗎？，肯定沒有吧，要是有的話，你肯定立即解除安裝了該應用了。

下面我們的任務就是將該選單的樣式和其他APP一樣，在標題欄下面彈出。

首先要說明一下，toolbar選單預設樣式的父類為Widget.AppCompat.Light.PopupMenu.Overflow，那麼要更改toobar中選單的彈出的樣式，就必須繼承這個父類的樣式。

其程式碼如下：
 

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- toolbar（actionbar）顏色 -->
    <item name="colorPrimary">#4876FF</item>
    <!-- 狀態列顏色 -->
    <item name="colorPrimaryDark">#3A5FCD</item>
    <!-- 視窗的背景顏色 -->
    <item name="android:windowBackground">@android:color/white</item>
    <item name="actionOverflowMenuStyle">@style/LYJMenuStyle</item>
</style>

<style name="LYJMenuStyle" parent="@style/Widget.AppCompat.Light.PopupMenu.Overflow">
    <item name="overlapAnchor">false</item>

</style>

設定這一個屬性那麼其彈出的樣式就與其他APP一樣不會覆蓋標題欄。

還有其他屬性這裡簡要說明一下：

①?attr/colorPrimary：彈出選單背景色為標題欄的背景色

②0dip：彈出選單與標題欄的垂直間距

將這兩條加入LYJMenuStyle中就可以了實現如下圖所示的彈出選單：

最後介紹一下選單裡面重要的幾個屬性：

app:showAsAction有三個值：

always：總是顯示在介面上
never：不顯示在介面上，只讓出現在右邊的三個點中
ifRoom：如果有位置才顯示，不然就出現在右邊的三個點中

可以用 | 同時使用兩個上面的值。

系統也為選單提供了預設的分享選單與查詢選單，程式碼如下：

app:actionViewClass="android.support.v7.widget.SearchView"

app:actionProviderClass="android.support.v7.widget.ShareActionProvider"

從名字想必不需要過多解釋，最後一個就是顯示的優先順序，也就是顯示的順序，誰在最前面，誰在後面：

android:orderInCategory數值越小，顯示靠前，且優先順序最大。