自定义ToolBar与ToolBar的封装，使ToolBar的Title居中

如图：

有关ToolBar的详细介绍：
Frist Blood
Double Kill

接下来介绍我们的ToolBar：

首先看attrs.xml文件，这里定义了几个属性：

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="CustomToolBar">

        <attr name="isShowSearchView" format="boolean"/>
        <attr name="rightButtonIcon_left" format="reference"/>
        <attr name="rightButtonText_left" format="string|reference"/>
        <attr name="rightButtonIcon_right" format="reference"/>
        <attr name="rightButtonText_right" format="string|reference"/>
        <attr name="leftButtonIcon" format="reference"/>
        <attr name="leftButtonText" format="string|reference"/>

    </declare-styleable>


</resources>

接着就是custom_toolBar的布局文件：

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:background="@color/colorPrimary"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <Button
        android:id="@+id/toolbar_leftButton"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:textColor="@color/white"
        android:visibility="gone"/>
    <EditText
        android:id="@+id/toolbar_searchview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_centerVertical="true"
        android:gravity="center"
        android:focusable="false"
        android:drawableLeft="@mipmap/icon_search"
        style="@style/search_view"
        android:hint="请输入搜索内容"
        android:visibility="gone"
        />

    <TextView
        android:id="@+id/toolbar_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_gravity="center"
        android:gravity="center"
        android:textColor="@color/white"
        android:textSize="20sp"
        android:visibility="gone"/>



    <Button
        android:id="@+id/toolbar_rightButton_right"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:paddingRight="8dp"
        android:layout_marginRight="8dp"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:textColor="@color/white"
        android:visibility="gone"/>
    <Button
        android:id="@+id/toolbar_rightButton_left"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:paddingRight="8dp"
        android:layout_marginRight="8dp"
        android:layout_toLeftOf="@+id/toolbar_rightButton_right"
        android:layout_centerVertical="true"
        android:textColor="@color/white"
        android:visibility="gone"/>

</RelativeLayout>

接下来使我们的自定义ToolBar的封装类：

package com.zccfocusing.widget;

import android.annotation.TargetApi;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.os.Build;
import android.support.v7.widget.TintTypedArray;
import android.support.v7.widget.Toolbar;
import android.util.AttributeSet;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;

import com.zccfocusing.R;

/**
 * Created by android-dev on 2017/3/1.
 */

public class CustomToolBar extends Toolbar {



    private LayoutInflater mInflater;

    private View mView;
    private TextView mTextTitle;
    private EditText mSearchView;
    private Button mLeftButton;
    private Button mRightButton_Left;
    private Button mRightButton_Right;


    public CustomToolBar(Context context) {
        this(context,null);
    }

    public CustomToolBar(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public CustomToolBar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        initView();
        setContentInsetsRelative(20,20);


        if(attrs !=null) {
            final TintTypedArray a = TintTypedArray.obtainStyledAttributes(getContext(), attrs,
                    R.styleable.CustomToolBar, defStyleAttr, 0);


            boolean isShowSearchView = a.getBoolean(R.styleable.CustomToolBar_isShowSearchView,false);

            if(isShowSearchView){

                showSearchView();
                hideTitleView();

            }


            final Drawable leftIcon = a.getDrawable(R.styleable.CustomToolBar_leftButtonIcon);
            if (leftIcon != null) {
                setLeftButtonIcon(leftIcon);
            }


            CharSequence leftButtonText = a.getText(R.styleable.CustomToolBar_leftButtonText);
            if(leftButtonText !=null){
                setLeftButtonText(leftButtonText);
            }

            final Drawable rightIconleft = a.getDrawable(R.styleable.CustomToolBar_rightButtonIcon_left);
            if (rightIconleft != null) {
                setRightButtonIconLeft(rightIconleft);
            }


            CharSequence rightButtonTextleft = a.getText(R.styleable.CustomToolBar_rightButtonText_left);
            if(rightButtonTextleft !=null){
                setRightButtonTextLeft(rightButtonTextleft);
            }

            final Drawable rightIconRight = a.getDrawable(R.styleable.CustomToolBar_rightButtonIcon_right);
            if (rightIconRight != null) {
                setRightButtonIconRight(rightIconRight);
            }


            CharSequence rightButtonTextRight = a.getText(R.styleable.CustomToolBar_rightButtonText_right);
            if(rightButtonTextRight !=null){
                setRightButtonTextRight(rightButtonTextRight);
            }

            a.recycle();
        }

    }

    private void initView() {


        if(mView == null) {

            mInflater = LayoutInflater.from(getContext());
            mView = mInflater.inflate(R.layout.custom_toolbar, null);


            mTextTitle = (TextView) mView.findViewById(R.id.toolbar_title);
            mSearchView = (EditText) mView.findViewById(R.id.toolbar_searchview);
            mRightButton_Left = (Button) mView.findViewById(R.id.toolbar_rightButton_left);
            mRightButton_Right = (Button) mView.findViewById(R.id.toolbar_rightButton_right);
            mLeftButton = (Button) mView.findViewById(R.id.toolbar_leftButton);


            LayoutParams lp = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                    ViewGroup.LayoutParams.WRAP_CONTENT,
                    Gravity.CENTER_HORIZONTAL);

            addView(mView, lp);
        }



    }


    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    public void  setRightButtonIconLeft(Drawable icon){

        if(mRightButton_Left !=null){

            mRightButton_Left.setBackground(icon);
            mRightButton_Left.setVisibility(VISIBLE);
        }
    }

    public void  setRightButtonIconLeft(int icon){

        setRightButtonIconLeft(getResources().getDrawable(icon));
    }


    public  void setRightButtonLeftOnClickListener(OnClickListener li){

        mRightButton_Left.setOnClickListener(li);
    }

    public void setRightButtonTextLeft(CharSequence text){
        mRightButton_Left.setText(text);
        mRightButton_Left.setVisibility(VISIBLE);
    }

    public void setRightButtonTextLeft(int id){
        setRightButtonTextLeft(getResources().getString(id));
    }



    public Button getRightButton_Left(){

        return this.mRightButton_Left;
    }



    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    public void  setRightButtonIconRight(Drawable icon){

        if(mRightButton_Right !=null){

            mRightButton_Right.setBackground(icon);
            mRightButton_Right.setVisibility(VISIBLE);
        }
    }
    public void  setRightButtonIconRight(int icon){

        setRightButtonIconRight(getResources().getDrawable(icon));
    }

    public  void setRightButtonRightOnClickListener(OnClickListener li){

        mRightButton_Right.setOnClickListener(li);
    }

    public void setRightButtonTextRight(CharSequence text){
        mRightButton_Right.setText(text);
        mRightButton_Right.setVisibility(VISIBLE);
    }

    public void setRightButtonTextRight(int id){
        setRightButtonTextRight(getResources().getString(id));
    }



    public Button getRightButton_Right(){

        return this.mRightButton_Right;
    }


    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    public void  setLeftButtonIcon(Drawable icon){

        if(mLeftButton !=null){

            mLeftButton.setBackground(icon);
            mLeftButton.setVisibility(VISIBLE);
        }
    }

    public void  setLeftButtonIcon(int icon){

        setLeftButtonIcon(getResources().getDrawable(icon));
    }


    public  void setLeftButtonOnClickListener(OnClickListener li){

        mLeftButton.setOnClickListener(li);
    }

    public void setLeftButtonText(CharSequence text){
        mLeftButton.setText(text);
        mLeftButton.setVisibility(VISIBLE);
    }

    public void setLeftButtonText(int id){
        setLeftButtonText(getResources().getString(id));
    }



    public Button getLeftButton(){

        return this.mLeftButton;
    }




    @Override
    public void setTitle(int resId) {

        setTitle(getContext().getText(resId));
    }

    @Override
    public void setTitle(CharSequence title) {

        initView();
        if(mTextTitle !=null) {
            mTextTitle.setText(title);
            showTitleView();
        }

    }



    public  void showSearchView(){

        if(mSearchView !=null)
            mSearchView.setVisibility(VISIBLE);

    }


    public void hideSearchView(){
        if(mSearchView !=null)
            mSearchView.setVisibility(GONE);
    }

    public void showTitleView(){
        if(mTextTitle !=null)
            mTextTitle.setVisibility(VISIBLE);
    }


    public void hideTitleView() {
        if (mTextTitle != null)
            mTextTitle.setVisibility(GONE);

    }

}

最后在我们的布局文件里引入我们自定义的ToolBar，设置属性，就可以使用了：

<com.zccfocusing.widget.CustomToolBar
        android:id="@+id/toolbar"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:rightButtonIcon_left="@mipmap/collect"
        app:rightButtonIcon_right="@mipmap/browser_share"
        app:leftButtonIcon="@mipmap/icon_back_32px"
        app:title="@string/news"
        />

<?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">

    <com.zccfocusing.widget.CustomToolBar
        android:id="@+id/toolbar"
        android:background="?attr/colorPrimary"
        android:minHeight="?attr/actionBarSize"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:rightButtonIcon_left="@mipmap/collect"
        app:rightButtonIcon_right="@mipmap/browser_share"
        app:leftButtonIcon="@mipmap/icon_back_32px"
        app:title="@string/news"
        />



    <android.support.design.widget.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        app:tabGravity="center"
        app:tabIndicatorColor="@color/colorPrimary"
        app:tabMode="scrollable"
        app:tabSelectedTextColor="@color/colorPrimary"/>


    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</LinearLayout>

使用 toolbar不要忘了更改style的AppTheme的父类继承为NoActionBar：

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>
        //设置返回按钮颜色
        <item name="colorControlNormal">@color/white</item>
    </style>

其实，如果不封装的话，也可以这样写，来实现Title居中的效果，在ToolBar内嵌套一个布局即可：

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?android:attr/actionBarSize"
        android:background="@color/colorPrimary">

        <TextView
            android:id="@+id/tvTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="@string/news_list"
            android:textSize="20sp"/>
    </android.support.v7.widget.Toolbar>