attr属性标签与标题栏联合的使用

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

先看看例子截图


上图中的返回按钮标题等都是统一在基布局中设置的,并非在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等等,这个后续加上,如有错误,谢谢各位大佬纠正指教,顺便祝各位大佬中秋节快乐!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值