打造一个通用的TitleView

在开发应用的过程中,大部分应用应该都是有标题栏的。通常情况下,我们所使用的标题栏的高度什么其他设置之类的基本上都是相同。so,为了节省开发的效率,今天我们共同打造一个通用的标题栏。

  • 一般刚开发的时候,我们会有好几种情况去写标题栏,感觉刚入行的话,可能会在每个布局里面都去复制重复的布局,升级一点的话,应该会用include去把这个同样的布局,引入的主布局中。但是我感觉上面的方法都麻烦了。现在用一个自定义布局,只需要在布局中设置自己想要的东西就可以。那现在就让我们一起开始吧。
  • 首先展示一下我们经常的使用布局的一个样式,一般情况下都是有三个主要部分组成,第一个是返回按钮,一般都是有的,然后中间是说明这个页面的大概描述,最后一个是点击这个按钮可以跳转其他的页面之类的。
    这里写图片描述
  • 自定义View的话,有很多种情况,在这里我们使用继承原有的View实现自定义(其实是很简单的自定义了)。首先需要写一个布局,其实这个布局很简单的,就是我们平常用xml写的布局,不作具体介绍了。代码如下




    

        

            
        


        

        

            
        

    


  • 接下来就要自定义布局了,在这里我们继承LinearLayout来实现自定义View。只需要把下面属性复制到attrs.xml里面就行。这里面可能有点难的主要有两点吧,一个自定义属性,第二个就是点击事件之类的。
    1. 自定义属性:这里的话,我一共设置了九个自定义属性。其中要说的明的是最后两个属性里面有一个逻辑就是当左边的icon不显示的时候,不响应点击事件。同理右边的也是。
      | name| format| 意义 |
      | ------------- |:-------------:| :-----:|
      | title_color | color | 标题的背景颜色|
      | title_text_size | dimension |标题字体的大小|
      | title_text_color | color |标题字体的颜色|
      | title_text| string| 标题字体的内容|
      | title_left_icon | reference|标题左边的icon|
      | title_right_icon | reference |标题右边的icon|
      | title_high| dimension| 标题栏的高度|
      | left_isVisable | boolean | 是否显示左边的icon|
      | right_isVisable | boolean |是否显示右边的icon |

    
        
        
        
        
        
        
        
        
        
    
  • 好了自定义属性设定好了,接下来就要写自定义view了。其实下面这段代码很简单,主要就是获取自定义属性,然后在代码里面设置就好了,感觉没什么好说的。
package com.mars.community.widget;

import android.content.Context;
import android.content.res.TypedArray;
import android.support.annotation.Nullable;
import android.support.v4.content.ContextCompat;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;

import com.mars.community.R;


/**
 * @date 创建时间: 2017/12/2  21:46
 * @author zh_legendd
 * @Description 自定义的titleView
 * @Email [email protected]
 * @Version 1.0
 */

public class TitleView extends LinearLayout {

    //标题的颜色
    private int title_color;
    //字体的大小
    private float title_text_size;
    //字体的颜色
    private int title_text_color;
    //字体内容
    private String title_text;
    //标题左边的icon


    private int title_left_icon;
    //标题右边的icon
    private int title_right_icon;
    //标题栏的高度
    private float title_high;
    //是否显示左边的icon
    private boolean left_isvisalbe;
    //是否显示右边的icon
    private boolean right_isvisalbe;
    //标题
    private TextView titleName;
    // 返回按钮控件
    private LinearLayout btnLeft;
    // 更多按钮控件
    private LinearLayout btnRight;
    // 返回按钮图标
    private ImageView leftIcon;
    // 更多按钮图标
    private ImageView rightIcon;
    //设置背景颜色
    private RelativeLayout ll_root;

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

    public TitleView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public TitleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.common_titile, this);
        //初始化视图
        initView();
        TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.MyTitle, defStyleAttr, 0);
        try {
            title_color = typedArray.getColor(R.styleable.MyTitle_title_color, ContextCompat.getColor(context, R.color.main_color));
            title_text_color = typedArray.getColor(R.styleable.MyTitle_title_text_color, ContextCompat.getColor(context, R.color.white));
            title_high = typedArray.getDimension(R.styleable.MyTitle_title_high, getResources().getDimension(R.dimen.common_title_height));
            title_text = typedArray.getString(R.styleable.MyTitle_title_text);
            title_left_icon = typedArray.getResourceId(R.styleable.MyTitle_title_left_icon, R.mipmap.ic_back_white);
            title_right_icon = typedArray.getResourceId(R.styleable.MyTitle_title_right_icon, 0);
//            title_text_size = typedArray.getDimension(R.styleable.MyTitle_title_text_size,getResources().getDimension(R.dimen.title_text_size));
            left_isvisalbe = typedArray.getBoolean(R.styleable.MyTitle_left_isVisable, true);
            right_isvisalbe = typedArray.getBoolean(R.styleable.MyTitle_right_isVisable, false);
            //设置内容
            titleName.setText(title_text);
//            titleName.setTextSize(dp2px(title_text_size));
            titleName.setTextColor(title_text_color);
            ll_root.setBackgroundColor(title_color);
            if (left_isvisalbe) {
                leftIcon.setVisibility(View.VISIBLE);
                leftIcon.setImageResource(title_left_icon);
            } else {
                leftIcon.setVisibility(View.GONE);
                btnLeft.setEnabled(false);
            }
            if (right_isvisalbe) {
                rightIcon.setImageResource(title_right_icon);
                rightIcon.setVisibility(View.VISIBLE);
            } else {
                rightIcon.setVisibility(View.GONE);
                btnRight.setEnabled(false);
            }
            LinearLayout.LayoutParams params = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int) title_high);
            ll_root.setLayoutParams(params);


        } finally {
            typedArray.recycle();
        }

    }

    public void setLeftClickListener(OnClickListener listener) {
        btnLeft.setOnClickListener(listener);
    }

    public void setRightClickListener(OnClickListener listener) {
        btnRight.setOnClickListener(listener);
    }

    public int getTitle_color() {
        return title_color;
    }

    public void setTitle_color(int title_color) {
        this.title_color = title_color;
        ll_root.setBackgroundColor(title_color);
    }

    public float getTitle_text_size() {
        return title_text_size;
    }

    public void setTitle_text_size(float title_text_size) {
        this.title_text_size = title_text_size;
        titleName.setTextSize(title_text_size);
    }

    public int getTitle_text_color() {
        return title_text_color;
    }

    public void setTitle_text_color(int title_text_color) {
        this.title_text_color = title_text_color;
        titleName.setText(title_text_color);
    }

    public String getTitle_text() {
        return title_text;
    }

    public void setTitleName(String title_text) {
        this.title_text = title_text;
        titleName.setText(title_text);
    }

    public int getTitle_left_icon() {
        return title_left_icon;
    }

    public void setTitle_left_icon(int title_left_icon) {
        this.title_left_icon = title_left_icon;
        leftIcon.setImageResource(title_left_icon);
    }

    public int getTitle_right_icon() {
        return title_right_icon;
    }

    public void setTitle_right_icon(int title_right_icon) {
        this.title_right_icon = title_right_icon;
        rightIcon.setImageResource(title_right_icon);
    }

    public float getTitle_high() {
        return title_high;
    }

    public void setTitle_high(float title_high) {
        this.title_high = title_high;
        LinearLayout.LayoutParams params = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, (int) title_high);
        ll_root.setLayoutParams(params);
    }

    private void initView() {
        titleName = (TextView) findViewById(R.id.title_name);
        btnLeft = (LinearLayout) findViewById(R.id.btn_left);
        btnRight = (LinearLayout) findViewById(R.id.btn_right);
        leftIcon = (ImageView) findViewById(R.id.left_icon);
        rightIcon = (ImageView) findViewById(R.id.right_icon);
        ll_root = (RelativeLayout) findViewById(R.id.ll_root);
    }
    protected int dp2px(float dp) {
        final float scale = getContext().getResources().getDisplayMetrics().density;
        return (int) (dp * scale + 0.5f);
    }

}

  • 接下了就是怎么使用了,使用的话真的很简单。根据自己的需求可以任意设定即可。需要在根布局中引入匿名约束即这一行代码xmlns:app="http://schemas.android.com/apk/res-auto"


好了,就是这么简单,直接拿来用就好,有什么问题可以给我留言。

你可能感兴趣的:(打造一个通用的TitleView)