12.9　Toolbar" class="reference-link">12.9　Toolbar

Toolbar与Actionbar最大的区别就是Toolbar更加自由、可控。这也是Google在逐渐使用Toolbar替换Actionbar的原因，要使用Toolbar必须引入appcompat-v7支持，并设置主题为NoActionBar，因此在styles.xml文件中，使用如下所示的代码进行设置。

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
 
        <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
            <!-- toolbar颜色-->
            <item name="colorPrimary">#4876FF</item>
            <!--状态栏颜色-->
 
            <item name="colorPrimaryDark">#3A5FCD</item>
            <!--窗口的背景颜色-->
            <item name="android:windowBackground">@android:color/white</item>
            <!-- add SearchView -->
            <item name="searchViewStyle">@style/MySearchView</item>
        </style>
 
        <style name="MySearchView" parent="Widget.AppCompat.SearchView" />
    </resources>

在Toolbar中，可以像使用Actionbar那样增加一些小的View，例如用于搜索的SearchView。同时，不要忘了在Gradle配置文件中增加对appcompat-v7的引用，代码如下所示。

    dependencies {
        compile fileTree(dir: 'libs', include: ['*.jar'])
        compile 'com.android.support:appcompat-v7:21.0.3'
    }

在代码中，可以通过如下所示的代码来添加Toolbar显示的标题和图标。

    mToolbar = (Toolbar) findViewById(R.id.toolbar);
    mToolbar.setLogo(R.drawable.ic_launcher);
    mToolbar.setTitle("主标题");
    mToolbar.setSubtitle("副标题");
    setSupportActionBar(mToolbar);

菜单配置与Actionbar基本类似，代码如下所示。

    <menu xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        tools:context=".MainActivity" >
 
        <item
            android:id="@+id/ab_search"
            android:orderInCategory="80"
            android:title="action_search"
            app:actionViewClass="android.support.v7.widget.SearchView"
            app:showAsAction="ifRoom"/>
        <item
            android:id="@+id/action_share"
            android:orderInCategory="90"
            android:title="action_share"
            app:actionProviderClass="android.support.v7.widget.ShareActionProvider"
            app:showAsAction="ifRoom"/>
        <item
            android:id="@+id/action_settings"
            android:orderInCategory="100"
            android:title="action_settings"
            app:showAsAction="never"/>
 
    </menu>

一个典型的Toolbar在程序中的显示效果如图12.29所示。

图12.29　Toolbar

通过setSupportActionBar()方法，可以用Toolbar模拟出Actionbar的效果。下面我们将Toolbar与DrawerLayout结合起来，向大家演示Android 5.X中DrawerToggle状态变化的动态效果，即最左边的Toggle在DrawerLayout滑动时，会从三条横线渐变成一个箭头状的图案。

首先，在布局文件中引入DrawerLayout，并为其设置显示的内容，代码如下所示。

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        tools:context=".MainActivity">
 
        <include layout="@layout/toolbar" />
 
        <android.support.v4.widget.DrawerLayout
            android:id="@+id/drawer"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >
 
            <!--内容界面-->
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@android:color/holo_blue_light"             android:orientation="vertical" >
                <Button
                    android:layout_width="100dp"
                    android:layout_height="match_parent"
                    android:text="内容界面"/>
            </LinearLayout>
 
            <!--侧滑菜单内容必须指定其水平重力-->
            <LinearLayout
                android:id="@+id/drawer_view"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="start"
                android:orientation="vertical" >
                <Button
                    android:layout_width="200dp"
                    android:layout_height="match_parent"
                    android:text="菜单界面"/>
            </LinearLayout>
        </android.support.v4.widget.DrawerLayout>
    </LinearLayout>

接下来，在Activity中使用如下所示代码即可实现该效果。

    getSupportActionBar().setDisplayHomeAsUpEnabled(true);
    mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer);
    mDrawerToggle = new ActionBarDrawerToggle(
            this, mDrawerLayout, mToolbar,
            R.string.abc_action_bar_home_description,
            R.string.abc_action_bar_home_description_format);
    mDrawerToggle.syncState();
    mDrawerLayout.setDrawerListener(mDrawerToggle);

程序运行效果如图12.30所示，展开效果如图12.31所示。

图12.30　DrawerLayout展开效果	图12.31　DrawerLayout展开效果