Toolbar-5.0新特性
概念
Android5.0以后谷歌大力推崇Material Design設計，有意統一之前Android style風格亂象的情況。
Toolbar，這是用來取代過去 actionbar 的控件，而現在于 material design 中也對之有一個統一名稱：app bar，在未來的 android app 中，就以 toolbar 這個元件來實作之。
Google 非常推薦大家使用 Toolbar 來作為Android客戶端的導航欄，以此來取代之前的 Actionbar 。與 Actionbar 相比，Toolbar 明顯要靈活的多。它不像 Actionbar 一樣，一定要固定在Activity的頂部，而是可以放到界面的任意位置。除此之外，在設計 Toolbar 的時候，Google也留給了開發者很多可定制修改的余地，這些可定制修改的屬性在官方API文檔中都有詳細介紹，如：
- 設置導航欄圖標；
- 設置App的logo；
- 支持設置標題和子標題；
- 支持添加一個或多個的自定義控件；
- 支持Action Menu；
Toolbar的基本使用
使用V7的向下兼容包
前面提到 Toolbar 是在 Android 5.0 才開始加上的，Google 為了將這一設計向下兼容，自然也少不了要推出兼容版的 Toolbar 。為此，我們需要在工程中引入 appcompat-v7 的兼容包，使用 android.support.v7.widget.Toolbar 進行開發。
工程目錄
工程說明
- ToolBarBaseUseAct 包含了 Toolbar 的一些基本使用，
- ToolBarZhiHuAct 是在熟悉了 Toolbar 后對知乎主頁面的一個高仿實現。
- layout和menu文件夾分別是上面提到的兩個Activity的布局文件 和 actionmenu 菜單文件。
- values、values-v19、values-v21 中包含了一些自定義的 theme，后面用到的時候會順帶講解。
運行效果
按照效果圖，從左到右分別是我們前面提及到的 導航欄圖標、App的logo、標題和子標題、自定義控件、以及 ActionMenu 。
操作步驟
1.布局文件添加toolbar控件
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:toolbar="http://schemas.android.com/apk/res-auto"android:layout_width="match_parent"android:layout_height="match_parent"android:orientation="vertical"><android.support.v7.widget.Toolbar android:id="@+id/toolbar"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="@color/color_0176da"toolbar:logo="@mipmap/ic_launcher"toolbar:navigationIcon="@mipmap/ic_drawer_home"toolbar:subtitle="子標題"toolbar:title="標題"><!--自定義控件--><TextView android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="自定義控件" /></android.support.v7.widget.Toolbar> </LinearLayout>添加 action menu 菜單項
新建base_toolbar_menu.xml（注意在AS中的目錄位置），添加action_menu菜單項
<?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 android:id="@+id/action_search"android:icon="@mipmap/ic_search"android:title="@string/menu_search"app:showAsAction="ifRoom" /><item android:id="@+id/action_notification"android:icon="@mipmap/ic_notifications"android:title="@string/menu_notifications"app:showAsAction="ifRoom" /><item android:id="@+id/action_item1"android:title="@string/item_01"app:showAsAction="never" /><item android:id="@+id/action_item2"android:title="@string/item_02"app:showAsAction="never" /> </menu>3 Activity 中調用代碼拿到這 Toolbar 控件，并在代碼中做各種setXXX操作。
import android.os.Bundle; import android.support.v7.widget.Toolbar; import android.view.MenuItem; import android.widget.Toast;/*** Toolbar的基本使用*/ public class ToolBarBaseUseAct extends BaseActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_tool_bar_base_use);Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);toolbar.setNavigationIcon(R.mipmap.ic_drawer_home);//設置導航欄圖標toolbar.setLogo(R.mipmap.ic_launcher);//設置app logotoolbar.setTitle("Title");//設置主標題toolbar.setSubtitle("Subtitle");//設置子標題toolbar.inflateMenu(R.menu.base_toolbar_menu);//設置右上角的填充菜單toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {@Overridepublic boolean onMenuItemClick(MenuItem item) {switch (item.getItemId()) {case R.id.action_search:Toast.makeText(ToolBarBaseUseAct.this, R.string.menu_search, Toast.LENGTH_SHORT).show();break;case R.id.action_notification:Toast.makeText(ToolBarBaseUseAct.this, R.string.menu_notifications, Toast.LENGTH_SHORT).show();break;case R.id.action_item1:Toast.makeText(ToolBarBaseUseAct.this, R.string.item_01, Toast.LENGTH_SHORT).show();break;case R.id.action_item2:Toast.makeText(ToolBarBaseUseAct.this, R.string.item_02, Toast.LENGTH_SHORT).show();break;default:break;}return true;}});} }注意事項
代碼到此已經完成了 Toolbar 的基本使用，注意，是基本使用而已！！！！！下面有幾個代碼里面需要注意的地方：
我們在使用 Toolbar 時候需要先隱藏掉系統原先的導航欄，網上很多人都說給Activity設置一個NoActionBar的Theme。但個人覺得有點小題大做了，所以這里我直接在BaseActivity中調用 supportRequestWindowFeature(Window.FEATURE_NO_TITLE) 去掉了默認的導航欄（注意，我的BaseActivity是繼承了AppCompatActivity的，如果是繼承Activity就應該調用requestWindowFeature(Window.FEATURE_NO_TITLE)）；
如果你想修改標題和子標題的字體大小、顏色等，可以調用setTitleTextColor、setTitleTextAppearance、setSubtitleTextColor、setSubtitleTextAppearance 這些API；
自定義的View位于 title、subtitle 和 actionmenu 之間，這意味著，如果 title 和 subtitle 都在，且 actionmenu選項 太多的時候，留給自定義View的空間就越小；
導航圖標 和 app logo 的區別在哪？如果你只設置 導航圖標（ or app logo） 和 title、subtitle，會發現 app logo 和 title、subtitle 的間距比較小，看起來不如 導航圖標 與 它們兩搭配美觀；
Toolbar 和其他控件一樣，很多屬性設置方法既支持代碼設置，也支持在xml中設置
Toolbar 踩坑填坑
坑一：xml布局文件中，Toolbar屬性設置無效
- 使用toolbar 需要在根布局中添加命名控件，在AS中如果不寫，會有很明顯的報錯哈~
- logo、navigationIcon、subtitle、title 什么的要用 toolbar：xxx 設置，android:xxx不生效，如果使用了android:xxx在preview中是看不出來效果的，可以比較直觀的發現。
坑二：Action Menu Item 的文字顏色設置無效
系統默設置了ActionMenu每個Item的文字顏色和大小，系統下默認效果就是下面這樣的
要改變一下item文字顏色：
一： 在values/styles.xml中自定義一個Theme，并設置 android:textColorPrimary 屬性
<!--改變一下item文字顏色,如果是通用的話，只需要在values下面的style.xml中配置即可--><style name="Theme.ToolBar.Base.ItemTextColor" parent="Theme.AppCompat.Light.NoActionBar"><item name="android:textColorPrimary">@color/color_red</item></style>二： toolbar設置popupTheme
有網友說如果把自定義控件換成Button，你會發現Button默認的文字顏色也變成了紅色,我在4.4.2的模擬器上并沒有發現此問題，暫且記錄下。
如果你想要修改 ActionMenu Item 的文字大小，也可以在theme中設置加上如下設置：
<item name="android:textSize">20sp</item>Toolbar仿知乎主頁面
效果圖
功能點說明
- 右上角使用自定義樣式代替默認系統樣式(3個黑色的點)
- 在4.4之上的版本，可以看到 Translucent System Bars 詳情見博文的樣式，低版本的引用系統默認主題。
代碼實例
ToolBarZhiHuAct.java
import android.os.Bundle; import android.support.v7.widget.Toolbar;public class ToolBarZhiHuAct extends BaseActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_tool_bar_zhi_hu);Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);toolbar.inflateMenu(R.menu.zhihu_toolbar_menu);toolbar.setNavigationIcon(R.mipmap.ic_drawer_home);toolbar.setTitle(R.string.home_page);toolbar.setTitleTextColor(getResources().getColor(android.R.color.white));} }activity_tool_bar_zhi_hu.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:background="@color/color_0176da"android:fitsSystemWindows="true"android:orientation="vertical"><android.support.v7.widget.Toolbar android:id="@+id/toolbar"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="@color/color_0176da"android:theme="@style/Theme.ToolBar.ZhiHu"></android.support.v7.widget.Toolbar><RelativeLayout android:layout_width="match_parent"android:layout_height="match_parent"android:background="@android:color/white"><ImageView android:layout_width="60dp"android:layout_height="60dp"android:layout_centerInParent="true"android:background="@mipmap/ic_zhihu_logo" /></RelativeLayout></LinearLayout>menu/zhihu_toolbar_menu.xml
<?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 android:id="@+id/action_search"android:icon="@mipmap/ic_search"android:title="@string/menu_search"app:showAsAction="ifRoom" /><item android:id="@+id/action_notification"android:icon="@mipmap/ic_notifications"android:title="@string/menu_notifications"app:showAsAction="ifRoom" /><item android:id="@+id/action_settings"android:orderInCategory="100"android:title="@string/menu_settings"app:showAsAction="never" /><item android:id="@+id/action_about"android:orderInCategory="101"android:title="@string/menu_about_us"app:showAsAction="never" /> </menu>values/styles.xml、 values-v19/styles.xml、 values-v21/styles.xml
values/styles.xml
<!--在Android 4.4之前的版本上運行，直接跟隨系統主題--><style name="Theme.ToolBar.ZhiHu" parent="AppTheme"><!--引用設置白色三點的樣式--><item name="actionOverflowButtonStyle">@style/ActionButton.Overflow.ZhiHu</item></style><!--替換右上角 系統默認的黑色的三個點的效果，改為引用的圖片的白色--><style name="ActionButton.Overflow.ZhiHu" parent="android:style/Widget.Holo.Light.ActionButton.Overflow"><item name="android:src">@mipmap/ic_menu_more_overflow</item></style>values-v19/styles.xml
<style name="Theme.ToolBar.ZhiHu" parent="Theme.AppCompat.Light.NoActionBar"><!-- Customize your theme here. --><item name="android:windowTranslucentStatus">true</item><item name="android:windowTranslucentNavigation">true</item><item name="actionOverflowButtonStyle">@style/ActionButton.Overflow.ZhiHu</item></style><!--替換右上角 系統默認的黑色的三個點的效果，改為引用的圖片的白色--><style name="ActionButton.Overflow.ZhiHu" parent="android:style/Widget.Holo.Light.ActionButton.Overflow"><item name="android:src">@mipmap/ic_menu_more_overflow</item></style>values-v21/styles.xml
<style name="Theme.ToolBar.ZhiHu" parent="Theme.AppCompat.Light.NoActionBar"><!-- Customize your theme here. --><item name="android:windowTranslucentStatus">false</item><item name="android:windowTranslucentNavigation">true</item><item name="android:statusBarColor">@color/color_0176da</item><item name="actionOverflowButtonStyle">@style/ActionButton.Overflow.ZhiHu</item></style><!--替換右上角 系統默認的黑色的三個點的效果，改為引用的圖片的白色--><style name="ActionButton.Overflow.ZhiHu" parent="android:style/Widget.Holo.Light.ActionButton.Overflow"><item name="android:src">@mipmap/ic_menu_more_overflow</item></style>至此 全部的操作就完成了，運行一下，還不錯….
參考文章：
http://www.jianshu.com/p/79604c3ddcae
感謝D_clock
總結
以上是生活随笔為你收集整理的Toolbar-5.0新特性的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Translucent System B
- 下一篇： NavigationDrawer和Nav