ToolbarDemo【Toolbar做爲頂部導航欄的簡單使用】

版權聲明：本文爲HaiyuKing原創文章，轉載請註明出處！

前言

簡單記錄ToolBar做爲導航欄的使用。關鍵點在於如何在dialogfragment中使用toolbar！

Toolbar的圖標、標題設置：

效果圖

參考使用方法的效果圖。

代碼分析

分爲兩部分：一部分是固定不變的部分（參考導入步驟）；另一部分是根據實際狀況靈活改變的部分（參考使用方法）；

使用步驟

1、項目組織結構圖

注意事項：

一、  導入類文件後須要change包名以及從新import R文件路徑

二、  Values目錄下的文件（strings.xml、dimens.xml、colors.xml等），若是項目中存在，則複製裏面的內容，不要整個覆蓋

2、導入步驟

（1）引入appcompat support v7支持包【通常都會引入】

apply plugin: 'com.android.application'

android {
    compileSdkVersion 27
    defaultConfig {
        applicationId "com.why.project.toolbardemo"
        minSdkVersion 16
        targetSdkVersion 27
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'com.android.support:appcompat-v7:27.1.1'
    implementation 'com.android.support.constraint:constraint-layout:1.1.2'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'com.android.support.test:runner:1.0.2'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
}

（2）修改styles.xml文件中的AppTheme

<resources>

    <!-- 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>
    </style>

</resources>

（3）將nav_toolbar_base.xml複製到項目中

<?xml version="1.0" encoding="utf-8"?>
<!-- 基礎的toolbar（代碼控制標題、圖標顯示） -->
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar_base"
    android:layout_width="match_parent"
    android:layout_height="@dimen/nav_height"
    android:minHeight="@dimen/nav_height"
    android:background="@color/nav_bg"
    app:navigationIcon="@drawable/nav_back"
    app:contentInsetStart="0dp"
    app:contentInsetStartWithNavigation="0dp"
    app:titleTextAppearance="@style/nav_toolbar_title_style"
    app:theme="@style/nav_toolbar_menu_style"
    app:popupTheme="@style/nav_toolbar_popup_style"
    >
    <TextView
        android:id="@+id/toolbarTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=""
        android:textColor="@color/nav_text_color"
        android:textSize="@dimen/nav_title_text_size"
        android:layout_gravity="center"/>
</android.support.v7.widget.Toolbar>

nav_toolbar_base.xml

（4） 將nav_back.png複製到項目中

 

（5）在colors.xml中添加如下代碼

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>

    <!-- toolbar背景色 -->
    <color name="nav_bg">#ffffff</color>
    <!-- toolbar標題顏色 -->
    <color name="nav_text_color">#434343</color>
    <!-- toolbar的menu文本顏色 -->
    <color name="nav_menu_text_color">#3090d9</color>
    <!-- toolbar的popup背景色 -->
    <color name="nav_popup_bg_color">#ffffff</color>
    <!-- toolbar的popup文本顏色 -->
    <color name="nav_popup_text_color">#818181</color>
</resources>

（6）在dimens.xml中添加如下代碼

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <!-- toolbar高度 -->
    <dimen name="nav_height">56dp</dimen>
    <!-- toolbar標題文字大小 -->
    <dimen name="nav_title_text_size">18sp</dimen>
    <!-- toolbar的Menu文字大小 -->
    <dimen name="nav_menu_text_size">14sp</dimen>
    <!-- toolbar的popup文字大小 -->
    <dimen name="nav_popup_text_size">16sp</dimen>

</resources>

（7）在styles.xml中添加如下代碼

<resources>

    <!-- 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="android:textColorSecondary">@color/nav_menu_text_color</item>
    </style>

    <!-- toolbar標題的顏色和大小值設置 -->
    <style name="nav_toolbar_title_style">
        <item name="android:textColor">@color/nav_text_color</item>
        <item name="android:textSize">@dimen/nav_title_text_size</item>
    </style>
    <!-- toolbar的menu（非popup樣式）的顏色和大小值設置 -->
    <style name="nav_toolbar_menu_style">
        <item name="android:actionMenuTextColor">@color/nav_menu_text_color</item>
        <item name="android:textSize">@dimen/nav_menu_text_size</item>
    </style>

    <!-- toolbar彈出的popup菜單的顏色和大小值設置 -->
    <style name="nav_toolbar_popup_style">
        <item name="android:colorBackground">@color/nav_popup_bg_color</item>
        <item name="android:textColor">@color/nav_popup_text_color</item>
        <item name="android:textSize">@dimen/nav_popup_text_size</item>
        <!--將overlapAnchor屬性設置成false就能夠在toolbar下方顯示-->
        <item name="overlapAnchor">false</item>
    </style>
</resources>

 至此，toolbar的基礎代碼添加到項目中了，後續根據想要顯示的效果添加圖片資源和menu文件。

3、使用方法

（1）在activity佈局文件中引用nav_toolbar_base.xml【下面全部activity的佈局文件都是這個】

activity_toolbar_normal.xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#F4F4F4">

    <include layout="@layout/nav_toolbar_base"/>


</LinearLayout>

（2）無右側菜單項圖標樣式

一、將nav_notifications.png複製到項目中【由於換了個圖標，因此須要添加新圖標】

 

二、在Activity中這樣寫【注意：initToolBar()方法裏面的代碼能夠根據實際狀況拆分開，好比想要根據傳過來的參數動態更改標題、隱藏menu菜單項等】

package com.why.project.toolbardemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.View;
import android.widget.TextView;

/**
 * Created by HaiyuKing
 * Used 無右側菜單項樣式
 */

public class ToolBarNoMenuActivity extends AppCompatActivity {
    private Toolbar mToolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar_normal);

        initToolBar();//初始化toolbar
    }

    private void initToolBar() {
        mToolbar = findViewById(R.id.toolbar_base);
        mToolbar.setTitle("");//這樣設置的話，自帶的標題就不會顯示
        //設置自定義的標題（居中）
        TextView toolBarTitle = mToolbar.findViewById(R.id.toolbarTitle);
        toolBarTitle.setText("首頁");
        setSupportActionBar(mToolbar);//因爲toolbar只是一個普通控件，咱們將ToolBar設置爲ActionBar
        //設置導航圖標要在setSupportActionBar方法以後
        mToolbar.setNavigationIcon(R.drawable.nav_notifications);//設置爲空的話，就會不顯示左側的圖標
        //對NavigationIcon添加點擊
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });
    }
}

 效果圖

（3）左圖左標題右圖樣式

一、將nav_ok.png複製到項目中【由於須要用到menu菜單項，因此須要添加新圖標】

二、在res/menu目錄中添加toolbar_one_menu.xml文件

<?xml version="1.0" encoding="utf-8"?>
<!-- 基礎的toolbar（右側只有一個圖標的樣式） -->
<!--app:showAsAction="ifRoom/never/always"，ifRoom表示只要在app bar存在可用空間，就能夠顯示，never表示一直顯示在溢出菜單（overflowwindow）裏面 -->
<!--always：始終把這個放到項目中app bar。可是谷歌建議避免這麼使用，除非它很是關鍵，使它始終顯示在操做欄。設置多個始終顯示在app bar可能會致使它們在應用欄其餘UI重疊。-->
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/action_save"
        android:icon="@drawable/nav_ok"
        android:title="保存"
        app:showAsAction="always" />

</menu>

三、在Activity中這樣寫【注意：initToolBar()方法裏面的代碼能夠根據實際狀況拆分開，好比想要根據傳過來的參數動態更改標題、隱藏menu菜單項等】

package com.why.project.toolbardemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;

/**
 * Created by HaiyuKing
 * Used 左圖左標題右圖樣式
 */

public class ToolBarTitleLeftActivity extends AppCompatActivity {
    private Toolbar mToolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar_normal);

        initToolBar();//初始化toolbar
    }

    private void initToolBar() {
        mToolbar = findViewById(R.id.toolbar_base);
        mToolbar.setTitle("標題");//這樣設置的話，自帶的標題就不會顯示
        //設置自定義的標題（居中）
        TextView toolBarTitle = mToolbar.findViewById(R.id.toolbarTitle);
        toolBarTitle.setText("");
        setSupportActionBar(mToolbar);//因爲toolbar只是一個普通控件，咱們將ToolBar設置爲ActionBar
        //設置導航圖標要在setSupportActionBar方法以後
        //mToolbar.setNavigationIcon(null);//設置爲空的話，就會不顯示左側的圖標
        //對NavigationIcon添加點擊
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });

        //添加menu 菜單點擊事件
        mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem item) { switch (item.getItemId()){ case R.id.action_save: Toast.makeText(ToolBarTitleLeftActivity.this,"保存",Toast.LENGTH_SHORT).show(); break; } return true; } });

    }

    @Override public boolean onCreatePanelMenu(int featureId, Menu menu) { getMenuInflater().inflate(R.menu.toolbar_one_menu, menu);//toolbar添加menu菜單
        return true; }
}

效果圖

（4）左圖中標題右圖樣式

跟《（3）左圖左標題右圖樣式》的使用相同的nav_ok.png圖標和toolbar_one_menu.xml文件

不一樣的是activity的寫法不同：【注意：initToolBar()方法裏面的代碼能夠根據實際狀況拆分開，好比想要根據傳過來的參數動態更改標題、隱藏menu菜單項等】

package com.why.project.toolbardemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;

/**
 * Created by HaiyuKing
 * Used 左圖中標題右圖樣式
 */

public class ToolBarTitleCenterActivity extends AppCompatActivity {
    private Toolbar mToolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar_normal);

        initToolBar();//初始化toolbar
    }

    private void initToolBar() {
        mToolbar = findViewById(R.id.toolbar_base);
        mToolbar.setTitle("");//這樣設置的話，自帶的標題就不會顯示
        //設置自定義的標題（居中）
        TextView toolBarTitle = mToolbar.findViewById(R.id.toolbarTitle);
        toolBarTitle.setText("標題");
        setSupportActionBar(mToolbar);//因爲toolbar只是一個普通控件，咱們將ToolBar設置爲ActionBar
        //設置導航圖標要在setSupportActionBar方法以後
        //mToolbar.setNavigationIcon(null);//設置爲空的話，就會不顯示左側的圖標
        //對NavigationIcon添加點擊
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });

        //添加menu 菜單點擊事件
        mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                switch (item.getItemId()){
                    case R.id.action_save:
                        Toast.makeText(ToolBarTitleCenterActivity.this,"保存",Toast.LENGTH_SHORT).show();
                        break;
                }
                return true;
            }
        });

    }

    @Override
    public boolean onCreatePanelMenu(int featureId, Menu menu) {
        getMenuInflater().inflate(R.menu.toolbar_one_menu, menu);//toolbar添加menu菜單
        return true;
    }
}

效果圖

（5）無左側圖標佈局

一、將nav_close.png複製到項目中【由於爲了和上面的有所區別，因此須要添加新圖標】

二、跟《（3）左圖左標題右圖樣式》的使用相同的nav_ok.png圖標和toolbar_one_menu.xml文件

三、在Activity中這樣寫【注意：initToolBar()方法裏面的代碼能夠根據實際狀況拆分開，好比想要根據傳過來的參數動態更改標題、隱藏menu菜單項等】

package com.why.project.toolbardemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.TextView;

/**
 * Created by HaiyuKing
 * Used 無左側圖標佈局
 */

public class ToolBarNoNavigationiconActivity extends AppCompatActivity {

    private Toolbar mToolbar;
    private MenuItem menuItem;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar_normal);

        initToolBar();//初始化toolbar
    }

    private void initToolBar() {
        mToolbar = findViewById(R.id.toolbar_base);
        mToolbar.setTitle("");//這樣設置的話，自帶的標題就不會顯示
        //設置自定義的標題（居中）
        TextView toolBarTitle = mToolbar.findViewById(R.id.toolbarTitle);
        toolBarTitle.setText("篩選");
        setSupportActionBar(mToolbar);//因爲toolbar只是一個普通控件，咱們將ToolBar設置爲ActionBar
        //設置導航圖標要在setSupportActionBar方法以後
        mToolbar.setNavigationIcon(null);//設置爲空的話，就會不顯示左側的圖標 //對NavigationIcon添加點擊
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

            }
        });

        //添加menu 菜單點擊事件
        mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                switch (item.getItemId()){
                    case R.id.action_save:
                        finish();
                        break;
                }
                return true;
            }
        });

    }

    @Override
    public boolean onCreatePanelMenu(int featureId, Menu menu) {
        getMenuInflater().inflate(R.menu.toolbar_one_menu, menu);//toolbar添加menu菜單
        menuItem = menu.findItem(R.id.action_save); menuItem.setIcon(R.drawable.nav_close);//動態修改menu的圖標
        return true;
    }
}

效果圖

（6）菜單項中含有文本的佈局

 一、在res/menu目錄中添加toolbar_three_menu.xml文件【由於含有三個菜單項，因此須要使用新的menu文件】

<?xml version="1.0" encoding="utf-8"?>
<!-- 基礎的toolbar的menu -->
<!--app:showAsAction="ifRoom/never/always"，ifRoom表示只要在app bar存在可用空間，就能夠顯示，never表示一直顯示在溢出菜單（overflowwindow）裏面 -->
<!--always：始終把這個放到項目中app bar。可是谷歌建議避免這麼使用，除非它很是關鍵，使它始終顯示在操做欄。設置多個始終顯示在app bar可能會致使它們在應用欄其餘UI重疊。-->
<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/action_undo"
        android:title="撤銷"
        app:showAsAction="always" />

    <item
        android:id="@+id/action_redo"
        android:title="重作"
        app:showAsAction="always" />

    <item
        android:id="@+id/action_save"
        android:icon="@drawable/nav_ok"
        android:title="保存"
        app:showAsAction="always" />

</menu>

二、在Activity中這樣寫【注意：initToolBar()方法裏面的代碼能夠根據實際狀況拆分開，好比想要根據傳過來的參數動態更改標題、隱藏menu菜單項等】

package com.why.project.toolbardemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;

/**
 * Created by HaiyuKing
 * Used 菜單項中含有文本的佈局展示
 */

public class ToolBarMenuTextActivity extends AppCompatActivity {

    private Toolbar mToolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar_normal);

        initToolBar();//初始化toolbar
    }

    private void initToolBar() {
        mToolbar = findViewById(R.id.toolbar_base);
        mToolbar.setTitle("");//這樣設置的話，自帶的標題就不會顯示
        //設置自定義的標題（居中）
        TextView toolBarTitle = mToolbar.findViewById(R.id.toolbarTitle);
        toolBarTitle.setText("編輯");
        setSupportActionBar(mToolbar);//因爲toolbar只是一個普通控件，咱們將ToolBar設置爲ActionBar
        //設置導航圖標要在setSupportActionBar方法以後
        //mToolbar.setNavigationIcon(null);//設置爲空的話，就會不顯示左側的圖標
        //對NavigationIcon添加點擊
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });
        //添加menu 菜單點擊事件
        mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                switch (item.getItemId()){
                    case R.id.action_undo:
                        Toast.makeText(ToolBarMenuTextActivity.this,"撤銷",Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_redo:
                        Toast.makeText(ToolBarMenuTextActivity.this,"重作",Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_save:
                        Toast.makeText(ToolBarMenuTextActivity.this,"保存",Toast.LENGTH_SHORT).show();
                        break;
                }
                return true;
            }
        });
    }

    @Override
    public boolean onCreatePanelMenu(int featureId, Menu menu) {
        getMenuInflater().inflate(R.menu.toolbar_three_menu, menu);//toolbar添加menu菜單
        return true;
    }
}

效果圖

（7）溢出菜單(popup)的樣式

 一、將nav_menu_fabu.png、nav_menu_share.png複製到項目中【由於使用到新的menu菜單項了，因此須要添加圖片資源】

  

二、在res/menu目錄中添加toolbar_popup_menu.xml文件【由於屬性有所變化，因此須要使用新的menu文件】

<?xml version="1.0" encoding="utf-8"?>
<!-- 基礎的toolbar的menu -->
<!--app:showAsAction="ifRoom/never/always"，ifRoom表示只要在app bar存在可用空間，就能夠顯示，never表示一直顯示在溢出菜單（overflowwindow）裏面 -->
<!--always：始終把這個放到項目中app bar。可是谷歌建議避免這麼使用，除非它很是關鍵，使它始終顯示在操做欄。設置多個始終顯示在app bar可能會致使它們在應用欄其餘UI重疊。-->
<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/action_edit"
        android:title="編輯"
        app:showAsAction="always" />

    <item
        android:id="@+id/action_share"
        android:icon="@drawable/nav_menu_share"
        android:title="分享"
        app:showAsAction="never" />

    <item
        android:id="@+id/action_publish"
        android:icon="@drawable/nav_menu_fabu"
        android:title="發佈"
        app:showAsAction="never" />

</menu>

三、在Activity中這樣寫【注意：initToolBar()方法裏面的代碼能夠根據實際狀況拆分開，好比想要根據傳過來的參數動態更改標題、隱藏menu菜單項等】

package com.why.project.toolbardemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;

/**
 * Created by HaiyuKing
 * Used 溢出菜單(popup)的樣式
 */

public class ToolBarPopupMenuActivity extends AppCompatActivity {
    private Toolbar mToolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar_normal);

        initToolBar();//初始化toolbar
    }

    private void initToolBar() {
        mToolbar = findViewById(R.id.toolbar_base);
        mToolbar.setTitle("");//這樣設置的話，自帶的標題就不會顯示
        //設置自定義的標題（居中）
        TextView toolBarTitle = mToolbar.findViewById(R.id.toolbarTitle);
        toolBarTitle.setText("預覽");
        setSupportActionBar(mToolbar);//因爲toolbar只是一個普通控件，咱們將ToolBar設置爲ActionBar
        //設置導航圖標要在setSupportActionBar方法以後
        //mToolbar.setNavigationIcon(null);//設置爲空的話，就會不顯示左側的圖標
        //對NavigationIcon添加點擊
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });

        //添加menu 菜單點擊事件
        mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                switch (item.getItemId()){
                    case R.id.action_edit:
                        Toast.makeText(ToolBarPopupMenuActivity.this,"編輯",Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_share:
                        Toast.makeText(ToolBarPopupMenuActivity.this,"分享",Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_publish:
                        Toast.makeText(ToolBarPopupMenuActivity.this,"發佈",Toast.LENGTH_SHORT).show();
                        break;
                }
                return true;
            }
        });
    }

    @Override
    public boolean onCreatePanelMenu(int featureId, Menu menu) {
        getMenuInflater().inflate(R.menu.toolbar_popup_menu, menu);//toolbar添加menu菜單
        return true;
    }
}

效果圖 

（8）對話框中使用toolbar

一、新建自定義的dialogfragment文件，好比HasToolbarDialog【注意，黃色標記的代碼】【佈局文件共用已有的xml文件】

package com.why.project.toolbardemo.dialog;

import android.content.Context;
import android.graphics.drawable.ColorDrawable;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.DialogFragment;
import android.support.v7.widget.Toolbar;
import android.util.DisplayMetrics;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.view.WindowManager;
import android.widget.TextView;
import android.widget.Toast;

import com.why.project.toolbardemo.R;

/**
 * Created by HaiyuKing
 * Used 演示如何使用toolbar的對話框界面
 */

public class HasToolbarDialog extends DialogFragment{
    private static final String TAG = HasToolbarDialog.class.getSimpleName();

    public static final String TAG_FULLSCREEN = "fullScreen";//全屏
    public static final String TAG_BELOWSTATUEBAR = "belowStatusBar";//狀態欄下方

    /**View實例*/
    private View myView;
    /**context實例*/
    private Context mContext;
    /**標記：用來表明是從哪一個界面打開的這個對話框*/
    private String mTag;

    private Toolbar mToolbar;


    public static HasToolbarDialog getInstance(Context mContext, Bundle bundle)
    {
        HasToolbarDialog dialog = new HasToolbarDialog();
        dialog.mContext = mContext;
        return dialog;
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //android.R.style.Theme_Material_NoActionBar_Fullscreen這個樣式好看
        //Display fullscreen without actionbar
        //http://www.itgo.me/a/7477281837685192473/how-to-make-material-design-full-screen-dialog
        //解決在4.2.2設備上打開崩潰的問題
        if(Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP  && Build.VERSION.SDK_INT > Build.VERSION_CODES.JELLY_BEAN_MR1) { setStyle(DialogFragment.STYLE_NORMAL, android.R.style.Theme_Material_Light_NoActionBar_Fullscreen);//全屏（在狀態欄底下）
        } else { setStyle(DialogFragment.STYLE_NORMAL, android.R.style.Theme_Holo_Light_NoActionBar_Fullscreen); }
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(0));//設置背景爲透明，而且沒有標題
        getDialog().requestWindowFeature(Window.FEATURE_NO_TITLE);// 去掉標題欄
        //設置窗體全屏
        getDialog().getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);

        myView = inflater.inflate(R.layout.activity_toolbar_normal, container, false);
        /*this.getDialog().setOnKeyListener(new DialogInterface.OnKeyListener()
        {
            public boolean onKey(DialogInterface dialog, int keyCode, KeyEvent event){
                if (keyCode == KeyEvent.KEYCODE_BACK) {
                    LogUtil.w(TAG, "onKey");
                    dismiss();
                    return true; // return true是中斷事件，那麼下面的就接受不到按鍵信息了
                }else
                {
                    return false; //在return false的時候 纔會事件繼續向下傳遞。
                }
            }
        });*/
        return myView;
    }

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onActivityCreated(savedInstanceState);

        initToolBar();//初始化toolbar

        //初始化控件以及設置
        initView();
        //初始化數據
        initDatas();
        initEvents();
    }

    /**
     * 設置寬度和高度值，以及打開的動畫效果
     */
    @Override
    public void onStart() {
        super.onStart();

        if(mTag.equals(TAG_FULLSCREEN)){//全屏顯示
            //設置對話框的寬高，必須在onStart中
            Window window = this.getDialog().getWindow();
            window.setLayout(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);//全屏（蓋住狀態欄）
            window.setGravity(Gravity.BOTTOM);//設置在底部
            //打開的動畫效果
        }else{
            //從個人場景列表界面中設置按鈕打開的
            //設置對話框的寬高，必須在onStart中
            DisplayMetrics metrics = new DisplayMetrics();
            this.getActivity().getWindowManager().getDefaultDisplay().getMetrics(metrics);
            Window window = this.getDialog().getWindow();
            if(getStatusBarHeight(mContext) <= 96){ window.setLayout(metrics.widthPixels, metrics.heightPixels - getStatusBarHeight(mContext)); }else{ window.setLayout(metrics.widthPixels, this.getDialog().getWindow().getAttributes().height);//適配紅米6pro劉海屏
 }
            window.setGravity(Gravity.BOTTOM);//設置在底部
            //打開的動畫效果
        }
    }

    /**獲取狀態欄的高度*/
    private int getStatusBarHeight(Context context) {
        int resourceId = context.getResources().getIdentifier("status_bar_height", "dimen", "android");
        return context.getResources().getDimensionPixelSize(resourceId);
    }
    @Override
    public void onDestroy()
    {
        super.onDestroy();
    }

    private void initToolBar() {
        mToolbar = myView.findViewById(R.id.toolbar_base);
        mToolbar.setTitle("");//這樣設置的話，自帶的標題就不會顯示
        //設置自定義的標題（居中）
        TextView toolBarTitle = mToolbar.findViewById(R.id.toolbarTitle);
        toolBarTitle.setText("對話框標題");
        //setSupportActionBar(mToolbar);//因爲toolbar只是一個普通控件，咱們將ToolBar設置爲ActionBar【dialogFragment中去掉】
        //設置導航圖標要在setSupportActionBar方法以後
        mToolbar.setNavigationIcon(R.drawable.nav_back);//設置爲空的話，就會不顯示左側的圖標
        //對NavigationIcon添加點擊
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //關閉對話框，返回null
                dismiss();
            }
        });

        //添加menu 菜單點擊事件
        mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                switch (item.getItemId()){
                    case R.id.action_edit:
                        Toast.makeText(mContext,"編輯",Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_share:
                        Toast.makeText(mContext,"分享",Toast.LENGTH_SHORT).show();
                        break;
                    case R.id.action_publish:
                        Toast.makeText(mContext,"發佈",Toast.LENGTH_SHORT).show();
                        break;
                }
                return true;
            }
        });
        //https://stackoverflow.com/questions/27608399/toolbar-in-dialogfragment
        // Inflate a menu to be displayed in the toolbar
 mToolbar.inflateMenu(R.menu.toolbar_popup_menu);
    }

    /**實例化控件*/
    private void initView() {

    }
    /**
     * 初始化數據：tag標記、標題
     */
    private void initDatas() {
        mTag = this.getTag();
    }

    /**
     * 初始化監聽事件
     */
    private void initEvents() {

    }
}

二、在Activity中打開對話框

package com.why.project.toolbardemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.TextView;

import com.why.project.toolbardemo.dialog.HasToolbarDialog;

/**
 * Created by HaiyuKing
 * Used 在對話框中使用toolbar
 */

public class ToolBarDialogActivity extends AppCompatActivity {
    private Toolbar mToolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar_normal);
        initToolBar();//初始化toolbar
    }

    private void initToolBar() {
        mToolbar = findViewById(R.id.toolbar_base);
        mToolbar.setTitle("");//這樣設置的話，自帶的標題就不會顯示
        //設置自定義的標題（居中）
        TextView toolBarTitle = mToolbar.findViewById(R.id.toolbarTitle);
        toolBarTitle.setText("點擊右側圖標打開一個對話框");
        setSupportActionBar(mToolbar);//因爲toolbar只是一個普通控件，咱們將ToolBar設置爲ActionBar
        //設置導航圖標要在setSupportActionBar方法以後
        //mToolbar.setNavigationIcon(null);//設置爲空的話，就會不顯示左側的圖標
        //對NavigationIcon添加點擊
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });

        //添加menu 菜單點擊事件
        mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                switch (item.getItemId()){
                    case R.id.action_save:
                        Bundle bundle = new Bundle(); HasToolbarDialog dialog = HasToolbarDialog.getInstance(ToolBarDialogActivity.this,bundle); dialog.show(getSupportFragmentManager(),HasToolbarDialog.TAG_BELOWSTATUEBAR); break;
                }
                return true;
            }
        });

    }

    @Override
    public boolean onCreatePanelMenu(int featureId, Menu menu) {
        getMenuInflater().inflate(R.menu.toolbar_one_menu, menu);//toolbar添加menu菜單
        return true;
    }
}

效果圖 

Activity界面

對話框界面

（9）動態更新Menu的圖標和文本

一、在Activity中使用【注意黃色標記的代碼，屬於動態更新Menu的核心代碼】

package com.why.project.toolbardemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.TextView;

/**
 * Created by HaiyuKing
 * Used 動態更新Menu
 */
public class ToolBarMenuUpdateActivity extends AppCompatActivity {

    private Toolbar mToolbar;

    private boolean showOk = false;//切換圖標的狀態值，至於默認值是true仍是false，根據項目狀況而定

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_toolbar_normal);

        initToolBar();//初始化toolbar
    }

    private void initToolBar() {
        mToolbar = findViewById(R.id.toolbar_base);
        mToolbar.setTitle("");//這樣設置的話，自帶的標題就不會顯示
        //設置自定義的標題（居中）
        TextView toolBarTitle = mToolbar.findViewById(R.id.toolbarTitle);
        toolBarTitle.setText("動態更新Menu");
        setSupportActionBar(mToolbar);//因爲toolbar只是一個普通控件，咱們將ToolBar設置爲ActionBar
        //設置導航圖標要在setSupportActionBar方法以後
        //mToolbar.setNavigationIcon(null);//設置爲空的話，就會不顯示左側的圖標
        //對NavigationIcon添加點擊
        mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });
        //添加menu 菜單點擊事件
        mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
                switch (item.getItemId()){
                    case R.id.action_save:
                        showOrHiddenUpdatedMenu(); //動態更新Menu
                        break;
                }
                return true;
            }
        });
    }

    @Override
    public boolean onCreatePanelMenu(int featureId, Menu menu) {
        getMenuInflater().inflate(R.menu.toolbar_one_menu, menu);//toolbar添加menu菜單
        return true;
    }

    @Override public boolean onPrepareOptionsMenu(Menu menu) { if (! showOk) { menu.findItem(R.id.action_save).setIcon(R.drawable.nav_menu_fabu);//更新android:icon值
            menu.findItem(R.id.action_save).setTitle("發佈");//更新android:title值
        } else { menu.findItem(R.id.action_save).setIcon(R.drawable.nav_ok);//更新android:icon值
            menu.findItem(R.id.action_save).setTitle("保存");//更新android:title值
 } return super.onPrepareOptionsMenu(menu); } //動態更新Menu
    private void showOrHiddenUpdatedMenu(){ if(! showOk){ showOk = true; invalidateOptionsMenu(); //從新繪製menu
        }else{ showOk = false; invalidateOptionsMenu(); //從新繪製menu
 } }
}

onCreateOptionsMenu方法只在建立Activity的時候調用一次，之後就再也不調用了，因此就不能在onCreateOptionsMenu中作處理了。
不過系統提供了另外的一個方法onPrepareOptionsMenu,咱們能夠在這個方法中作一些邏輯處理，而後在須要更新Menu的地方調用invalidateOptionsMenu()方法。

效果圖

 

 

混淆配置

無

參考資料

《第一行代碼（第2版）》

PhotoPicker

Android ToolBar 簡單實用

Toolbar的使用詳解

Android Toolbar樣式定製詳解

動態更新Toolbar Menu以及Menu中同時顯示文字和圖標

項目demo下載地址

https://github.com/haiyuKing/ToolbarDemo