标准Android页面开发之ToolBar

一、ToolBar的前身：ActionBar

ActionBar

　　在android3.0上，引入了ActionBar，用来取代传统的tittle bar和menu，在程序运行中一直置于顶部，包含如下内容：
　　1. ActionBar的图标，可显示软件图标，也可用其他图标代替。当软件不在最高级页面时，图标左侧会显示一个左箭头，用户可以通过这个箭头向上导航；
　　2. 导航模式（NavigationMode）。如果你的应用要在不同的View中显示数据，这部分允许用户来切换视图。一般的作法是用一个下拉菜单或者是Tab选项卡。如果只有一个界面，那这里可以显示应用程序的标题或者是更长一点的商标信息；
　　3. 两个选项菜单（OptionsMenu），这里放重要的功能按钮，为用户进行某项操作提供直接的访问；
　　4. overflow菜单，放不下的功能按钮会被置于“更多...”菜单项中，“更多...”菜单项是以下拉形式实现的。

二、引入ToolBar

ActionBar直接嵌入framework中，灵活性不够，所以在5.0中，新增了ToolBar。ToolBar可以被附着在View上，通过调用setSupportActionBar() 设置为ActionBar，充当ActionBar的功能。其位置可以不限制在顶部了。

三、如何使用

1. 考虑向下兼容的问题，在app的build.gradle中引入相应的兼容包

compile 'com.android.support:appcompat-v7:23.+'

2. 将Toolbar写入布局文件

<LinearLayout
    style="@style/PandaTheme.Layout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="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="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        app:navigationIcon="@mipmap/ic_launcher"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        app:theme="@style/ThemeOverlay.AppCompat.ActionBar"
        app:title="@string/app_name">
    </android.support.v7.widget.Toolbar>
</LinearLayout>

3. 调用接口将绑定到Activity中

@Bind(R.id.toolbar)
Toolbar mToolbar;

mToolbar.setLogo(R.drawable.ic_launcher);
mToolbar.setTitle(getString(R.string.app_name));// 标题的文字需在setSupportActionBar之前，不然会无效
// toolbar.setSubtitle("副标题");
setSupportActionBar(mToolbar);
/* 这些通过ActionBar来设置也是一样的，注意要在setSupportActionBar(toolbar);之后，不然就报错了 */
getSupportActionBar().setLogo(R.mipmap.ic_launcher);

4. 集成导航模式
   setNavigationMode()等和导航模式相关接口已经废弃，不建议使用。

5. 准备选项菜单的布局文件 menu_main.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"
      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="collapseActionView"/>
</menu>

6. 集成选项菜单

• Activity中代码如下：

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_main, menu);
    return true;
}

• Fragment中代码如下：

@Override
public void onActivityCreated(Bundle savedInstanceState) {
     setHasOptionsMenu(true);
}
@Override
 public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
     super.onCreateOptionsMenu(menu, inflater);
     inflater.inflate(R.menu.menu_main, menu);
 }

7. 实现选项菜单中各个按钮的功能
   参考demo：ToolBarActivity

参考文章

1. 【Android UI设计与开发】8.顶部标题栏（一）ActionBar 奥义·详解
2. android：ToolBar详解（手把手教程）