Android中的Toolbar详解

对于ToolBar以前只知道它的存在，并没有拿来用过，今天有时间来看一下ToolBar控件的用法。
Toolbar是在 Android 5.0 开始推出的一个 Material Design 风格的导航控件 ，Google 非常推荐大家使用 Toolbar 来作为Android客户端的导航栏，以此来取代之前的 Actionbar 。与 Actionbar 相比， Toolbar 明显要灵活的多。它不像 Actionbar 一样，一定要固定在Activity的顶部，而是可以放到界面的任意位置。

先来看看与之相关的颜色定义，如下图所示：

1. colorPrimaryDark定义状态栏颜色：在styles里边设置，状态栏的颜色效果只有在5.0及以上版本设置才有效，5.0以下即使设置了颜色，也不会有任何效果。
2. .AppBar:如果使用的是ActionBar的话可以修改styles下边的colorPrimary参数。如果是Toolbar则在layout中设置background的颜色。
3. 导航栏底色：navigationBarColor这个参数只能在API v21以上版本中使用，如果直接在styles里边设置该参数则会报错。因此，如果要设置导航栏底色可以到对应版本的styles下边设置该参数，如新建一个styles(v23)在里边加上navigationBarColor参数后可在6.0版本的系统上生效。
4. windowBackground定义窗体颜色：可在style里边添加该参数设置窗体颜色。

首先我们应该在activity_main.xml的布局文件中添加一个Toolbar，并为其设置background，如下：

<?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="horizontal">    <android.support.v7.widget.Toolbar        android:id="@+id/tb_main"        android:layout_width="match_parent"        android:layout_height="?attr/actionBarSize"        android:background="#85C35B">    </android.support.v7.widget.Toolbar></LinearLayout>

接下来设置状态栏颜色和导航栏底色。由于不同的版本设置的主题样式不大一样，比如在5.0以下版本中我们不能为之设置navigationBarColor这个属性，所以为了方便，我们可以在styles下自定义一个主题样式，然后让styles继承该主题。如下：

<resources>    <!-- Base application theme. -->    <style name="AppTheme" parent="AppTheme.Base">        <!-- Customize your theme here. -->    </style>    <style name="AppTheme.Base" parent="Theme.AppCompat">        <item name="windowActionBar">false</item>        <item name="windowNoTitle">true</item>       <!--            定义ActionBar的颜色            <item name="colorPrimary">@color/colorPrimary</item>       -->        <!--定义状态栏颜色-->        <item name="colorPrimaryDark">#53A52D</item>        <!--控制各个控件被选中时的颜色-->        <item name="colorAccent">@color/colorAccent</item>        <!--定义Toolbar的字体颜色-->        <item name="android:textColorPrimary">#fff</item>        <!--定义主窗体颜色-->        <item name="android:windowBackground">@color/dim_foreground_material_dark</item>        <!--修改 ActionMenu Item 的文字大小-->        <item name="android:textSize">20sp</item>    </style></resources>

由于我们使用Toolbar作为导航栏，所以不再需要ActionBar，因此上边的自定义样式中把windowActionBar设置为false，windowNoTitle设置为true从而去掉了Actionbar。
接下来设置导航栏底色navigationBarColor，由于该属性只能用在ApI v21以上的版本中，因此我们需要在对应的版本中去修改。比如我当前使用的版本为API v23,那么我现在只需要添加一个styles(v23)即可。添加方法：右键New–Android Resource File 如下图：

设置File names为styles，type为Values，再最下边选择API版本v23确定后即可。新建完成后可以看到res–values下边的style多出了一个styles.xml(v23),如下图：

接下来为styles(v23)设置主题，style.xml(v23)中添加一个style，parent设置为我们自定义的AppTheme.Base,并添加navigationBarColor的参数，代码如下：

<?xml version="1.0" encoding="utf-8"?><resources>    <style name="AppTheme" parent="AppTheme.Base">        <item name="android:navigationBarColor">#85C35B</item>    </style></resources>

通过上面的代码我们就可以在6.0的手机上显示出一个我们自定义的导航栏底色了。如果想为其他版本设置导航栏底色我们还可以添加其他版本的styles。
到此，界面的颜色设置已经基本完成，接下来看看如何为Toolbar添加内容。
首先还是来看下效果图：

在此之前我们需要先定义一个menu用来显示菜单条目，方法与定义values类似。
代码如下：

<?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="@drawable/ic_search"        android:title="search"        app:showAsAction="ifRoom" />    <item        android:id="@+id/action_notification"        android:icon="@drawable/ic_notifications"        android:title="notification"        app:showAsAction="ifRoom" />    <item        android:id="@+id/action_item1"        android:title="item01"        app:showAsAction="never" />    <item        android:id="@+id/action_item2"        android:title="item02"        app:showAsAction="never" /></menu>

接下来看MainActivity中的代码：

package com.example.smily.toolbar;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.support.v7.widget.Toolbar;import android.view.MenuItem;import android.widget.Toast;public class MainActivity extends AppCompatActivity {    private Toolbar toolbar;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        toolbar= (Toolbar) findViewById(R.id.tb_main);        //  设置导航图标        toolbar.setNavigationIcon(R.drawable.ic_drawer_home);         //  为NavigationIcon设置监听事件        toolbar.setNavigationOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View view) {                Toast.makeText(MainActivity.this, "Click NavigationIcon", Toast.LENGTH_SHORT).show();            }        });        //  设置logo        //toolbar.setLogo(R.mipmap.ic_launcher);        //  设置标题        toolbar.setTitle("首页");        //  设置子标题        //toolbar.setSubtitle("SubTitle");        //  添加menu        toolbar.inflateMenu(R.menu.menu_main);        //  为menu设置监听事件        toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {            @Override            public boolean onMenuItemClick(MenuItem item) {                String msg = "";                switch (item.getItemId()) {                    case R.id.action_search:                        msg = "Click search";                        break;                    case R.id.action_notification:                        msg = "Click notification";                        break;                    case R.id.action_item1:                        msg = "Click item1";                        break;                    case R.id.action_item2:                        msg = "Click item2";                        break;                }                if(!msg.equals("")) {                    Toast.makeText(MainActivity.this, msg, Toast.LENGTH_SHORT).show();                }                return true;            }        });    }}

这里要注意的是可通过toolbar.setNavigationOnClickListener为NavigationIcon设置监听事件。
点击下载源码