android ToolBar 使用及二次封装的源码

前言：在2015年的Google I/O大会上推出Design Support库，这个库讲Material Design 中最具代表性的一些控件和效果进行了封装，使得开发者在即使不了解Material Design的情况下也能轻松地将自己的应用Material华。这篇博文就说讲解其中一个 ToolBar的控件，我们之前对于ActionBar是比较熟悉的，但是大多数开发中都是将其隐藏掉了，因为其自己身设计上限定位于活动的顶部，不能实现一些Material效果，所以官方一级不建议使用了。相比之下，Toolbal的强大之处在于，它不仅继承了ActionBar的所有功能，而且具备灵活性，可自由搭配其他控件完成Material效果。接下来手把手教新手如何使用，并抽象成类在项目中使用。

一、首先定义Style  做为整个项目的基本风格

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>

colorPrimary  :  标题栏的背景色

colorPrimaryDark: 状态栏的背景色

colorAccent : 控件效果的背景色

二、接下里在布局中使用v7.widget.Toolbar控件 替代 ActionBar 在活动中显示

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">

<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:id="@+id/toolbar"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

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

</LinearLayout>

上面是布局文件中的代码：这里ToolBard单独设置了Theme主题，这是因为我们的基本style是淡色（Light）的主题，因此Toolbar现在也是淡色主题，而Toolbar的各种元素会自动使用深色系，去区分主题颜色，之前ActionBar的文字是白色的，现在变成了黑色，效果会看起来不佳，所以将Toolbar的单独指定深色主题，但是如果Toolbar使用了菜单，弹出后的效果依然是深色主题，所以再指定popupThme淡色主题，app：popupThme可以兼容5.0以下版本。

下面看在Activity中的代码：

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar= (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
//设置不现实自带的title文字
getSupportActionBar().setDisplayShowTitleEnabled(false);

}

运行起来，就可以看见原始ToolBar了。

三、最后我们自定义 ToolBar 文字按钮进行交互

1、设置标题栏的返回按钮：

toolbar.setNavigationIcon(R.mipmap.back_whait);

@Override
public boolean onOptionsItemSelected(MenuItem item) {
if (item.getItemId() == android.R.id.home){
finish();
}
return true;
}

2、标题title居中显示：

<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:id="@+id/toolbar"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="@style/TextAppearance.AppCompat.Widget.ActionBar.Title"
android:textColor="#ffffff"
android:layout_gravity="center"/>
</android.support.v7.widget.Toolbar>

style是让字体大小与Toolbar保持一致。

3、右侧按钮或文字显示：

<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

<item
android:id="@+id/settings"
android:icon="@mipmap/ic_launcher"
android:title="Settings"
app:showAsAction="always"/>

</menu>

@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toobar,menu);

return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {

if (item.getItemId() == R.id.settings){
Toast.makeText(this,"You Are Right",Toast.LENGTH_SHORT).show();
}
return true;
}

四、Toolbar是活动的标题栏，把ToolBar 封装成一个抽象Base类，可以加快开发的脚步使代码更整洁清晰。这里我附上源码，非常实用，新手必备，加快开发速度和保持项目统一风格。

Toolbar封装抽象类源码

感谢android 之路有大家一起学习，我并不孤单。谢谢。