Material Design整理（三）——ToolBar

github地址 点击打开

简介

应用内容的标准工具栏，可以说是ActionBar的升级版，两者不是独立关系。

• 应用内容的标准工具栏，可以说是ActionBar的升级版，两者不是独立关系。
• 相比ActionBar，ToolBar更加自由，可以随意放置，当一个ViewGroup来使用。

• ToolBar提供了可定制、修改的属性：

   - 导航栏图标
   - AppLogo
   - 主标题、子标题
   - 添加一个或多个自定义控件
   - 支持Action Menu 等
  

使用

1、在res/menu文件夹下，创建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="搜索"
        app:showAsAction="ifRoom" />

    <!--右侧添加操作条目-->
    <item
        android:id="@+id/action_add"
        android:icon="@mipmap/ic_add"
        android:title="添加"
        app:showAsAction="ifRoom" />

    <!--右侧设置条目，收起，不显示-->
    <item
        android:id="@+id/action_setting"
        android:icon="@mipmap/ic_settings"
        android:title="设置"
        app:showAsAction="never" />

    <!--右侧设置帮助条目，收起，不显示-->
    <item
        android:id="@+id/action_help"
        android:icon="@mipmap/ic_help"
        android:title="帮助"
        app:showAsAction="never" />

</menu>

其中showAsAction可选参数为：

• always：使菜单项一直显示在ToolBar上
• ifRoom：如果有足够的空间，菜单项显示在ToolBar上，否则显示在更多中
• never：菜单项永远不显示在ToolBar上，只显示在更多中
• withText：图标和文字一起显示

2、在布局中使用ToolBar

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    app:popupTheme="@style/AppTheme.PopupOverlay" />

另外：可以把ToolBar当做普通ViewGroup来使用，所以可以在布局文件中直接将自定义控件放置其中

3、在Activity中

在setContentView方法之前，设置界面没有标题栏：

• 如果Activity继承Activity，设置：

requestWindowFeature(Window.FEATURE_NO_TITLE);

• 如果Activity继承的是AppCompatActivity，则：

supportRequestWindowFeature(Window.FEATURE_NO_TITLE);

附：隐藏导航栏有两种方法：

• 如上在代码中设置
• 在清单文件中给对应Activity设置主题，主题为Theme.AppCompat.Light.NoActionBar

4、将ToolBar作为导航栏

setSupportActionBar(toolbar);

5、可以对ToolBar进行其他设置

//设置App图标
toolbar.setLogo(R.mipmap.ic_launcher);
//设置导航的图标
toolbar.setNavigationIcon(R.mipmap.ic_menu);
// 设置主标题
toolbar.setTitle("J++");
// 设置子标题
toolbar.setSubtitle("MaterialDesign");

6、添加菜单项

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

此步骤就是将创建的menu文件设置给ToolBar

7、对菜单项添加点击事件

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()) {
        case R.id.action_search:
            Snackbar.make(toolbar, "搜索", Snackbar.LENGTH_LONG).show();
            break;
        case R.id.action_add:
            Snackbar.make(toolbar, "更多", Snackbar.LENGTH_LONG).show();
            break;
        case R.id.action_setting:
            Snackbar.make(toolbar, "设置", Snackbar.LENGTH_LONG).show();
            break;
        case R.id.action_help:
            Snackbar.make(toolbar, "帮助", Snackbar.LENGTH_LONG).show();
            break;
    }
    return false;
}

还有另外一种方式：

setOnMenuItemClickListener(new ToolBar.OnMenuItemClickListener());

8、当然，还有导航图标的点击

toolbar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {

        drawer.openDrawer(Gravity.LEFT);
    }
});