工作內容：

Toolbar(含溢位選單設定[彈出選單的使用])的使用

學習分享：

Toolbar的使用前提：設定主題

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">

使用步驟：

【主要步驟是設定的彈出選單的style，需在toolbar中的app:popupTheme = "@style/..."和appTheme中的Android:"actionOverflowMenuStyle = "@style/...""中使用】

1.activity_main.xml中新增Toolbar如下

<android.support.v7.widget.Toolbar
 
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/toolbar"
android:background="@color/darkturquoise"//設定Toolbar的背景色
app:titleTextColor="@color/white"//設定標題顏色app:navigationIcon="@drawable/back"//設定左邊按鈕圖示
app:popupTheme="@style/OverflowMenuStyle"//設定彈出選單的風格
>

2.設定彈出選單的風格【需新增到appTheme中,之後再新增到Toolbar的app:popupTheme中[如上程式碼]】

<!--溢位[彈出]選單樣式 parent相當於繼承【可以不要parent】--><style name="OverflowMenuStyle" parent="@style/Widget.AppCompat.PopupMenu.Overflow"><!-- 是否覆蓋錨點，預設為true，即蓋住Toolbar --><item name="overlapAnchor">false</item>
    <item name="android:dropDownWidth">wrap_content</item>
    <item 
 
name="android:paddingRight">5dp</item>
<!-- 彈出層背景顏色 --><item name="android:popupBackground">@color/darkturquoise</item>
<!-- 彈出層垂直方向上的偏移，即在豎直方向上距離Toolbar的距離，值為負則會蓋住Toolbar -->
<item name="android:dropDownVerticalOffset">5dp</item>
<!-- 彈出層水平方向上的偏移，即距離螢幕左邊的距離，負值會導致右邊出現空隙 -->
<item name="android:dropDownHorizontalOffset">0dp</item>
<!-- 設定彈出選單文字顏色 -->
<item name="android:textColor">@color/white</item>
</style>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
<!-- 加入toolbar溢位【彈出】選單的風格 -->
 <item name="actionOverflowMenuStyle">@style/OverflowMenuStyle</item></style>

在新建的menu目錄下建立“Menu resource file”,命名為“toolbar”

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<!-- 同級的item有幾個則在toolbar右邊顯示幾個 -->
    <!--
        id:之後設定點選事件的時候找到當前選單項的唯一標識
        title:必填項，Toolbar欄的menu標題
        [如果存在icon，則顯示icon圖示，不顯示文字]
        [如果不存在icon,則顯示文字]
        app:showAsAction = "ifRoom" ：顯示為一個行為
        android:showAsAction="ifRoom":icon失效顯示圖示為“3個豎立的點”
    --><item android:id="@+id/toolbar_r_img"
android:title="分享"
android:icon="@drawable/list_item"
app:showAsAction="ifRoom"
>
<!-- item包含menu表示該menu是item下的子選單 --><menu>
<!-- 將group中的選單項放於一個組裡面 --><group>
                <item android:id="@+id/toolbar_r_1"
android:title="登入"
android:icon="@drawable/list_item"
app:showAsAction="ifRoom"
/>
                <item android:id="@+id/toolbar_r_2"
android:title="註冊"
android:icon="@drawable/list_item"
app:showAsAction="ifRoom"
/>
                <item android:id="@+id/toolbar_r_3"
android:title="設定"
android:icon="@drawable/list_item"
app:showAsAction="ifRoom"
/>
            </group>
        </menu>
    </item>
<!--<item android:title="學習"-->
        <!--android:id="@+id/item_learn"-->
        <!--android:icon="@drawable/list_item"-->
        <!--app:showAsAction="ifRoom"-->
        <!--/>-->
</menu>

//設定標題欄Toolbar
private void setToolbar() {
    toolbar.setTitle("鳳凰衛士");   //設定標題
toolbar.setSubtitle("新浪訊息");    //設定副標題
toolbar.setSubtitleTextColor(Color.WHITE);  //設定副標題字型顏色
setSupportActionBar(toolbar);   //必須使用//新增左邊圖示點選事件toolbar.setNavigationOnClickListener(new View.OnClickListener() {
        @Override
public void onClick(View v) {
            finish();
}
    });
//新增menu項點選事件toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
        @Override
public boolean onMenuItemClick(MenuItem item) {
            switch (item.getItemId()) {
                case R.id.toolbar_r_img:
                    Log.e("Test---->","點選了右邊圖示");
                    break;
                case R.id.toolbar_r_1:
                    Log.e("Test---->","點選了彈出選單1");
                    break;
                case R.id.toolbar_r_2:
                    Log.e("Test---->","點選了彈出選單2");
                    break;
                case R.id.toolbar_r_3:
                    Log.e("Test---->","點選了彈出選單3");
                    break;
}
            return true;    //返回為true
}
    });
}
//設定menu（右邊圖示）@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.toolbar, menu); //解析menu佈局檔案到menu
return true;
}

效果圖: