自定义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>