ToolBar的使用

来源:互联网 发布:知乎手机版怎么写文章 编辑:程序博客网 时间:2024/06/15 06:07

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>

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下载

原创粉丝点击