Attr与统一titleBar的联合使用

关于attr标签的使用是android最基本的必备知识，其实也挺简单，今天就让我来撸一把关于自定义标签的使用方法，顺便呢统一写一个头部布局（包含返回箭头、标题、右文本）几乎所有activity都必须的，所以写一个统一的头部比较好，本文通过一个例子来看看怎么联合使用attr来创建统一的titleBar

先看看例子截图

image.png

上图中的返回按钮标题等都是统一在基布局中设置的，并非在java代码中
下面我们来撸一把
一、首先创建好项目，建立一个最基本的标题布局，我命名为include_title_bar.xml,代码如下

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:background="@android:color/holo_blue_light"
                android:padding="12dp"
                android:layout_height="wrap_content">
    <ImageView android:id="@+id/iv_back"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"/>

    <TextView android:id="@+id/tv_title" android:layout_width="wrap_content" android:layout_height="wrap_content"
              android:text="title" android:layout_centerInParent="true" android:textColor="@android:color/white"
              android:textSize="18dp"
    />
    <TextView android:id="@+id/tv_right" android:layout_width="wrap_content" android:layout_height="wrap_content"
              android:layout_alignParentRight="true"
              android:layout_centerInParent="true" android:textColor="@android:color/white"
              android:textSize="18dp"
    />
</RelativeLayout>

很简单一个ImageView， 两个TextView控件
二、创建attrs.xml,定义各种属性，有需要可以自行添加使用，内容如下

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="title_bar">
        <attr name="left" format="reference"></attr>
        <attr name="title" format="string"></attr>
        <attr name="right" format="string"></attr>
        <attr name="view_bg" format="reference"></attr>
    </declare-styleable>
</resources>

三、接下来创建一个View的类来实现我们更改图片、标题等逻辑的类，命名为BaseTitleView.java

package com.xhh.attrdemo;

import android.content.Context;
import android.content.res.TypedArray;
import android.text.TextUtils;
import android.util.AttributeSet;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

/**
 * @Author:Create by Mr.w
 * @Date:2018/9/16 22:48
 * @Description:
 */
public class BaseTitleView extends LinearLayout {

    private ImageView iv_back;//左侧返回按钮
    private TextView tv_title;//标题
    private TextView tv_right;//右侧文字按钮
    private View viewParent;//所在父布局
    private int leftIcon;
    private String titleValue;
    private String rightTextValue;
    private int bg;

    public BaseTitleView(Context context) {
        super(context);
        init(context);
    }

    public BaseTitleView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);//初始化所有控件
        initAttr(context, attrs);//初始化得到属性
        initData();//将属性得到的值赋值到控件上
    }

    private void initData() {
        if (leftIcon != 0) iv_back.setBackgroundResource(leftIcon);
        else iv_back.setVisibility(View.GONE);

        if (!TextUtils.isEmpty(titleValue)) tv_title.setText(titleValue);
        else tv_title.setVisibility(View.GONE);

        if (!TextUtils.isEmpty(rightTextValue)) tv_right.setText(rightTextValue);
        else tv_right.setVisibility(View.GONE);

        if (bg != 0) viewParent.setBackgroundColor(bg);


    }

    private void init(Context context) {
        viewParent = View.inflate(context, R.layout.include_title_bar, this);
        iv_back = viewParent.findViewById(R.id.iv_back);
        tv_title = viewParent.findViewById(R.id.tv_title);
        tv_right = viewParent.findViewById(R.id.tv_right);
    }

    private void initAttr(Context context, AttributeSet attrs) {
        TypedArray mTypedArray = context.obtainStyledAttributes(attrs, R.styleable.title_bar);
        leftIcon = mTypedArray.getResourceId(R.styleable.title_bar_left, 0);
        titleValue = mTypedArray.getString(R.styleable.title_bar_title);
        rightTextValue = mTypedArray.getString(R.styleable.title_bar_right);
        bg = mTypedArray.getColor(R.styleable.title_bar_view_bg, 0);
        mTypedArray.recycle();
    }
}

上面类中就是设置各种title、左边图片的逻辑代码，注释也写在上面了
要注意的点如下：
1、继承为LinearLayout,也可以是其他其他容器，最好不要View,继承View可能麻烦点要设置其他才能展示出来
2、initView中View.inflate方法中root参数要传入this，表示将这个布局添加
到我们类所继承的容器中，不要传入null,不然这样这布局是加载不进去的
四、创建Activity和布局

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#fff"
        tools:context="com.xhh.attrdemo.MainActivity">


    <com.xhh.attrdemo.BaseTitleView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:left="@mipmap/ic_left"
            app:title="测试title"
            app:right="右边文本"
    />

</android.support.constraint.ConstraintLayout>

看到这里应该就懂了吧,app:left 设置左边图标资源 app:title=""设置标题等等
然后运行如图一的效果了,很简单吧，当然还有待完善的地方，比如将titleBar不写在xml中，统一在BaseActivity添加titleBar等等，这个后续加上，如有错误，谢谢各位大佬纠正指教，顺便祝各位大佬中秋节快乐！