ToolBar的使用

1.概述

Toolbar是google在android 5.0推出的新的导航栏控件，用于替代ActionBar,在android 5.0以下使用该控件需要导入support V7 包。

2. 使用步骤

2.1 引入V7包

在gradle中导入v7包，如下：

compile 'com.android.support:appcompat-v7:25.3.0'

后面的版本号最好和compileSdkVersion 版本相一致，compileSdkVersion是android 编译SDK的版本， minSdkVersion 是该APP所支持最低的android版本， targetSdkVersion 是 Android 提供向前兼容的主要依据，在应用的 targetSdkVersion 没有更新之前系统不会应用最新的行为变化。

2.2 更改主题

使用TooBar需要把系统的ActionBar给隐藏掉，在style文件中：

  <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
          <!-- Customize your theme here. -->
          <!-- ActionBar背景颜色，如果是TooBar背景颜色可在ToolBar控件background属性中指定 -->
         <item name="colorPrimary">@color/colorPrimary</item>
         <!-- 状态栏颜色 -->
         <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
         <!--按钮选中或者点击获得焦点后的颜色 如RadionButton、 CheckBox、EditText-->
         <item name="colorAccent">@color/colorAccent</item>
         <!--控件正常情况下的颜色，如RadionButton、 CheckBox-->
         <item name="colorControlNormal">@color/colorControlNormal</item>
         <!--Button按钮正常状态颜色-->
         <item name="colorButtonNormal">@color/accent_material_light</item>
           <!-- 窗口的背景颜色 -->
         <item name="android:windowBackground">@android:color/white</item>
          <!--actionBar的高度    -->
         <item name="actionBarSize">@dimen/actionBarSize</item>
         <item name="windowActionBar">false</item>
         <item name="windowNoTitle">true</item>
    </style>

修改完这个样式记得在清单文件的application节点中的设置这个主题

2.3 在布局文件中添加ToolBar控件

在布局中加入如下代码：

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:minHeight="50dp"
    android:background="@color/colorPrimary"
    android:padding="0dp"

    app:popupTheme="@style/ToolBarPopupStyle"
    app:titleTextAppearance="@style/ToolBarTitle"
    app:theme="@style/ToolBarStyle"
    app:subtitleTextAppearance="@style/ToolBarSubTitle"

    >

</android.support.v7.widget.Toolbar>

其中app:popupTheme是指ToolBar弹出菜单中的样式 , app:titleTextAppearance是ToolBar标题的样式， app:theme是ToolBar的样式， app:subtitleTextAppearance是ToolBar副标题的样式。在style文件中样式的如下说明：

  <!-- ToolBar主题 一般是黑底白色字体 Dark主题-->
    <style name="ToolBarStyle" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
        <item name="android:textSize">16sp</item>
        <!--设置菜单更多颜色 或者那个默认返回箭头的颜色 -->

        <item name="colorControlNormal">#878787</item>
    </style>
    <!-- ToolBar标题字体颜色和大小-->
    <style name="ToolBarTitle" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
        <item name="android:textSize">18sp</item>
        <item name="android:textColor">#ffffff</item>
    </style>

    <!-- ToolBar副标题字体颜色和大小-->
    <style name="ToolBarSubTitle" parent="Base.TextAppearance.Widget.AppCompat.Toolbar.Subtitle">
        <item name="android:textSize">16sp</item>
        <item name="android:textColor">#ffffff</item>
    </style>

    <!-- ToolBar弹出菜单背景颜色 和字体颜色大小 -->
    <style name="ToolBarPopupStyle" parent="ThemeOverlay.AppCompat.Light">
        <item name="android:background">#ffff00</item>
        <item name="android:textColor">#00ff00</item>
        <item name="android:textSize">14sp</item>
        <!-- 设置菜单弹出窗不覆盖那三个点，你懂的 -->
        <item name="overlapAnchor">false</item>
        <!-- 设置菜单中的分割线-->
        <item name="android:dropDownListViewStyle">@style/DropDownListViewStyle</item>
    </style>
   <style name="DropDownListViewStyle" parent="Base.Widget.AppCompat.ListView.DropDown">
       <item name="android:divider">#e1e1e1</item>
       <item name="android:dividerHeight">1dp</item>

   </style>

特别说明一下这里我把ToolBar的高度设置为50dp，需要设置android:minHeight=“50dp”,否则字体、图标不会居中。

2.4 在java文件中添加和设置ToolBar

 在你的Activity中加入如下代码:

       toolbar= (Toolbar) findViewById(R.id.include2);
        toolbar.setLogo(R.mipmap.ic_launcher);
        toolbar.setTitle("标题");
        toolbar.setSubtitle("副标题");
        setSupportActionBar(toolbar);
        //这句代码需要在setSupportActionBar()后设置才能生效 
        //设置是否添加显示NavigationIcon.返回按钮
       getSupportActionBar().setDisplayHomeAsUpEnabled(true);
         ///设置NavigationIcon 资源 
        // toolbar.setNavigationIcon(R.drawable.abc_ic_ab_back_material);
         //这句代码需要在setSupportActionBar()后才能生效 设置NavigationIcon资源
        toolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this,"你点击了返回",Toast.LENGTH_SHORT).show();
            }
        });

        toolbar.setTitleMargin(0,0,0,0);

        //设置了setOnMenuItemClickListener 菜单选择监听
        //Activity 的 onOptionsItemSelected(MenuItem item)方法将不会被回调
       /* toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
            @Override
            public boolean onMenuItemClick(MenuItem item) {
               Toast.makeText(MainActivity.this,"菜单被点击了"+item.getTitle(),Toast.LENGTH_SHORT).show();

                return false;
            }
        });*/
       //

在Toolbar中添加菜单，需要在Activity中重写下面几个方法

  @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        Toast.makeText(MainActivity.this,"菜单被创建",Toast.LENGTH_SHORT).show();
        getMenuInflater().inflate(R.menu.setting,menu);


        return super.onCreateOptionsMenu(menu);
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()){
            case R.id.menu1:
                Toast.makeText(MainActivity.this,"menu1被点击",Toast.LENGTH_SHORT).show();
                break;
            case R.id.menu2:
                Toast.makeText(MainActivity.this,"menu2被点击",Toast.LENGTH_SHORT).show();
                break;
            case R.id.menu3:
                Toast.makeText(MainActivity.this,"menu3被点击",Toast.LENGTH_SHORT).show();
                break;
            case R.id.menu4:
                Toast.makeText(MainActivity.this,"menu4被点击",Toast.LENGTH_SHORT).show();
                break;
        }
        return super.onOptionsItemSelected(item);
    }


    /**
     * 在onCreateOptionsMenu执行后，菜单被显示前调用；如果菜单已经被创建，则在菜单显示前被调用。 同样的，
     * 返回true则显示该menu,false 则不显示; （可以通过此方法动态的改变菜单的状态，比如加载不同的菜单等）
     */
    @Override
    public boolean onPrepareOptionsMenu(Menu menu) {
        Toast.makeText(MainActivity.this,"menu3显示前调用"+super.onPrepareOptionsMenu(menu),Toast.LENGTH_SHORT).show();
        return super.onPrepareOptionsMenu(menu);
    }



    /**
     * 显示menu的icon,通过反射,设置Menu的icon显示.
     * @param view
     * @param menu
     * @return
     */
    @Override
    protected boolean onPrepareOptionsPanel(View view, Menu menu) {

        if (menu != null) {
            if (menu.getClass().getSimpleName().equals("MenuBuilder")) {
                try{
                    Method m = menu.getClass().getDeclaredMethod("setOptionalIconsVisible", Boolean.TYPE);
                    m.setAccessible(true);
                    m.invoke(menu, true);
                } catch (Exception e) {

                }
            }
        }
        return super.onPrepareOptionsPanel(view, menu);
    }

资源文件setting.xml：

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="@+id/menu1"
    android:icon="@mipmap/ic_launcher"
    android:title="测试1"
    app:showAsAction="ifRoom|withText"/>
    <item android:id="@+id/menu2"
        android:icon="@mipmap/ic_launcher"
        android:title="测试2"
        app:showAsAction="ifRoom|withText"/>
    <item android:id="@+id/menu3"
        android:icon="@mipmap/ic_launcher"
        android:title="测试3"
        app:showAsAction="ifRoom|withText"/>
    <item android:id="@+id/menu4"
        android:icon="@mipmap/ic_launcher"
        android:title="测试4"
        app:showAsAction="ifRoom|withText"/>
</menu>

showAsAction这个属性的值有：
1、always：使菜单项一直显示在ToolBar上。
2、ifRoom：如果有足够的空间，这个值会使菜单项显示在ToolBar上。
3、never：使菜单项永远都不出现在ToolBar上,在…的子项中显示。
4、withText：使菜单项和它的图标，菜单文本一起显示。

3.0总结

ToolBar的介绍就到此为止，下节介绍一下ToolBar的封装和状态栏字体颜色的改变。

Demo下载