[Android]Toolbar使用详解（二）——API

接上篇

ToolBar使用详解（一）——项目配置

如果在工程中还没有配置好ToolBar的同学可以参照上文进行配置

借用Google文档的一张图，Actionbar与Toolbar是异曲同工的

位置说明

与ActionBar的纠缠

• 继续与Actionbar绑定

      <span style="white-space:pre">	</span>setSupportActionBar(mToolbar);

• 不与Actionbar绑定

只要不调用上面的API即可。

注意：

强烈推荐把ToolBar单独抽离。

图标设置(位置1)

• 图标大小

引用这个回答： http://stackoverflow.com/questions/11244918/action-bar-icon-size

Full asset, 32x32 dp; Optical square, 24x24 dp

• 代码设置图标

 <span style="white-space:pre">	</span>mToolbar.setNavigationIcon(R.drawable.ic_launcher);

• 设置图标监听事件

 <span style="white-space:pre">	</span>mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //to do something
            }
        });

标题设置（位置1）

   <span style="white-space:pre">	</span>mToolbar.setTitle("标题");
        mToolbar.setSubtitle("副标题");
        mToolbar.setTitleTextColor(Color.parseColor("#ff0000"));//设置标题颜色
        mToolbar.setSubtitleTextColor(Color.parseColor("#ff0000"));
        mToolbar.setLogo(R.drawable.ic_actionbar_flow);//设置logo图片

设置导航栏和沉浸式菜单（位置2、位置3）

        mToolbar.inflateMenu(R.menu.menu_main);

• 在Menu文件夹下新建menu_main.xml文件如下

<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/action_share"
        android:title="@string/action_share"
        android:orderInCategory="100"
        android:icon="@drawable/ic_actionbar_share"
        app:showAsAction="never|withText" />
    <item
        android:id="@+id/action_settings"
        android:title="@string/action_settings"
        android:orderInCategory="101"
        android:icon="@drawable/ic_actionbar_settings"
        app:showAsAction="never|withText" />
</menu>

注意：

通过设置showAsAction的属性，always是位置2（如果toolbar位置够多），never是位置3。

• 设置菜单监听事件

  mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem menuItem) {
                int id = menuItem.getItemId();
                switch (id) {
                    case R.id.action_share:
                        MyLog.e("share!");
                        return true;
                    case R.id.action_settings:
                        MyLog.e("setting!");
                        return true;
                    default:
                        return false;
                }
            }
        });

ActionMode

ActionBar用得比较多的会是搜索(自定义布局)和长按弹出上下文菜单的功能。

左边是ActionMode打开后，右边是普通状态。

   

搜索（自定义布局）

• 在主题文件theme中应用

    <item name="windowActionModeOverlay">true</item>
    <item name="actionModeBackground">@null</item>

注意：

第一句是设置ActionMode可用，第二句是设置ActionMode模式下的回退箭头（默认）

• 在代码中应用，点击某个按钮后触发ActionMode

 mToolbar.startActionMode(new MyActionModeCallback());

• 定义ActionModeCallBack

   private class MyActionModeCallback implements ActionMode.Callback {

        @Override
        public boolean onCreateActionMode(ActionMode mode, Menu menu) {
            //创建时将导航图和标题去掉
            mToolbar.setNavigationIcon(null);
            mToolbar.setTitle(null);
            mToolbar.setSubtitle(null);
            //这里加载自定义布局
            mode.setCustomView(LayoutInflater.from(MainActivity.this).inflate(R.layout.layout_actionmode, null));
            return true;
        }

        @Override
        public boolean onPrepareActionMode(ActionMode mode, Menu menu) {
            return false;
        }

        @Override
        public boolean onActionItemClicked(ActionMode mode, MenuItem item) {
            //点击某个按钮触发finish或者点击左箭头退出
            mode.finish();
            return false;
        }

        @Override
        public void onDestroyActionMode(ActionMode mode) {
            //重新设置导航图和标题去掉
            mToolbar.setNavigationIcon(R.drawable.ic_actionbar_flow);
            mToolbar.setTitle("标题");
            mToolbar.setSubtitle("副标题");
        }
    }

• 创建layout_actionmode.xml(自定义布局，这里我简单实现了)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/holo_blue_bright">

    <TextView
        android:id="@+id/txt"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="文字标题" />

    <ImageView
        android:layout_below="@id/txt"
        android:src="@android:drawable/star_on"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

</RelativeLayout>

弹出上下文菜单

个人建议：随着手机屏幕越来越大，要点击到上下文菜单(右图)更难，如下图，个人更推荐左边对话框的实现方式。

更多详细使用请访问谷歌官网