Toolbar常见用法总结

一、概述

因为ActionBar设计不灵活，所以谷歌引入了新的控件Toolbar，用来取代ActionBar。

二、使用方法

1. 使用Toobar需要去掉Activity原有的标题栏，否则会报错。这里有三种方法可以去掉原有标题栏

• 方法一：在代码中去标题栏

//如果你的Activity继承的不是AppCompatActivityrequestWindowFeature(Window.FEATURE_NO_TITLE) 或//如果你Acticity继承的是AppCompatActivitysupportRequestWindowFeature(Window.FEATURE_NO_TITLE)

• 方法二：使用没有ActionBar的主题

Theme.AppCompat.Light.NoActionBar

• 方法三：使用有ActionBar的主题，但是通过属性去掉标题栏

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">        <item name="android:windowNoTitle">true</item></style>

2.布局

   <android.support.v7.widget.Toolbar        android:id="@+id/toolbar"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:background="?attr/colorPrimary"        app:title="标题"        app:subtitle="子标题"        app:logo="@mipmap/ic_launcher"        app:navigationIcon="@drawable/back"        app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"><!--        <TextView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="今天是周五"            android:layout_gravity="center"/>-->    </android.support.v7.widget.Toolbar>

• app:navigationIcon 用来设置返回图标
• app:popupTheme 是右上角菜单项的主题

3. 代码初始化

mToolBar = (Toolbar) findViewById(R.id.toolbar);// 使用toolBar代替ActionBarsetSupportActionBar(mToolBar);

这里我们看一下效果图：

当然，我们也可以在代码中设置一些属性：

// 显示导航按钮//getSupportActionBar().setDisplayHomeAsUpEnabled(true);   // 设置导航按钮       mToolBar.setNavigationIcon(android.R.drawable.ic_delete);  mToolBar.setLogo(R.mipmap.ic_launcher);// 设置logo图片 mToolBar.setTitle("ToolBar Title");// 设置标题//代码设置TiTle不起作用，得在清单文件labelmToolBar.setTitleTextColor(Color.RED); // 设置标题颜色 mToolBar.setSubtitle("This is subtitle");// 设置子标题

当然，我们可以为返回箭头设置一个点击事件：

 mToolBar.setNavigationOnClickListener(new View.OnClickListener() {        @Override        public void onClick(View v) {             //do something           }  });

4.Toolbar右上角菜单显示及点击事件

@Overridepublic boolean onCreateOptionsMenu(Menu menu) {     getMenuInflater().inflate(R.menu.base_toolbar_menu, menu);     return true;}@Overridepublic boolean onOptionsItemSelected(MenuItem item) {        if (item.getItemId() == R.id.action_share) {            return true;        }        return super.onOptionsItemSelected(item);}

R.menu.base_toolbar_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_edit"        android:orderInCategory="100"        android:title="edit"        app:showAsAction="ifRoom"        android:icon="@android:drawable/ic_menu_edit"/>    <item        android:id="@+id/action_settings"        android:orderInCategory="100"        android:title="setting"        app:showAsAction="never"        android:icon="@android:drawable/ic_menu_set_as"/>    <item        android:id="@+id/action_share"        android:orderInCategory="100"        android:title="share"        app:showAsAction="never"        android:icon="@android:drawable/ic_menu_share"/></menu>

这里需要提的是showAsAction属性，它有以下几个值：

• always ： 这个值会使菜单项一直显示在Toolbar上
• ifRoom : 如果有足够的空间,这个值会使菜单显示在Toolbar上
• never : 这个值菜单永远不会出现在Toolbar是
• withText : 这个值使菜单和它的图标，菜单文本一起显示

5.与SearchView的使用

先看一下布局和效果吧，我们添加了一个item，注意属性actionViewClass，前边是app，并不是使用的android

<?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:orderInCategory="100"        app:actionViewClass="android.support.v7.widget.SearchView"        android:title="search"        app:showAsAction="always"        android:icon="@android:drawable/ic_menu_search"/>        //......省略</menu>

当然我们可以对SearchView进行一些设置，那么先找到这个控件：

 @Overridepublic boolean onCreateOptionsMenu(Menu menu) {                 getMenuInflater().inflate(R.menu.base_toolbar_menu, menu);    //SearchView    MenuItem item = menu.findItem(R.id.action_search);    SearchView searchView =(SearchView)MenuItemCompat.getActionView(item);        return true; }

其实SearchView有一个提交按钮的，默认GONE，我们可以让它显示出来，当然也可以修改它的图片：

 /* mIvSearch = (ImageView) searchView.findViewById(R.id.search_go_btn);        mIvSearch.setImageResource(R.drawable.back);        mIvSearch.setVisibility(View.VISIBLE);*/ searchView.setSubmitButtonEnabled(true);

可以对中间的输入框进行一些设置：

mEditText = (SearchView.SearchAutoComplete) searchView.findViewById(R.id.search_src_text);mEditText.setHint("请输入要搜索的商品名称");mEditText.setTextColor(Color.GRAY);//......

当然还有几个常见的监听：

• setOnQueryTextFocusChangeListener
• setOnCloseListener
• setOnQueryTextListener

效果图如下：

有错误的地方，欢迎大家指正。最后附近源码地址：gitHub源码地址