在开发应用的过程中，大部分应用应该都是有标题栏的。通常情况下，我们所使用的标题栏的高度什么其他设置之类的基本上都是相同。so，为了节省开发的效率，今天我们共同打造一个通用的标题栏。
- 一般刚开发的时候，我们会有好几种情况去写标题栏，感觉刚入行的话，可能会在每个布局里面都去复制重复的布局，升级一点的话，应该会用include去把这个同样的布局，引入的主布局中。但是我感觉上面的方法都麻烦了。现在用一个自定义布局，只需要在布局中设置自己想要的东西就可以。那现在就让我们一起开始吧。
-
首先展示一下我们经常的使用布局的一个样式，一般情况下都是有三个主要部分组成，第一个是返回按钮，一般都是有的，然后中间是说明这个页面的大概描述，最后一个是点击这个按钮可以跳转其他的页面之类的。
- 自定义View的话，有很多种情况，在这里我们使用继承原有的View实现自定义(其实是很简单的自定义了)。首先需要写一个布局，其实这个布局很简单的，就是我们平常用xml写的布局，不作具体介绍了。代码如下
<?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="wrap_content"
android:background="@color/main_color"
android:orientation="vertical">
<RelativeLayout
android:id="@+id/ll_root"
android:layout_width="match_parent"
android:layout_height="@dimen/common_title_height"
android:background="@color/main_color">
<LinearLayout
android:clickable="true"
android:id="@+id/btn_left"
android:layout_width="@dimen/common_title_height"
android:layout_height="match_parent"
android:background="@drawable/selector_btn_back"
android:gravity="center"
android:padding="10dp">
<ImageView
android:id="@+id/left_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/ic_back_white"/>
</LinearLayout>
<TextView
android:id="@+id/title_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:maxLength="20"
android:maxLines="1"
android:text="标题"
android:textColor="@color/white"
android:textSize="@dimen/title_text_size"/>
<LinearLayout
android:clickable="true"
android:id="@+id/btn_right"
android:layout_width="@dimen/common_title_height"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:background="@drawable/selector_btn_back"
android:gravity="center"
android:padding="10dp">
<ImageView
android:id="@+id/right_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/actionbar_menu"/>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
- 接下来就要自定义布局了，在这里我们继承LinearLayout来实现自定义View。只需要把下面属性复制到attrs.xml里面就行。这里面可能有点难的主要有两点吧，一个自定义属性，第二个就是点击事件之类的。
- 自定义属性：这里的话，我一共设置了九个自定义属性。其中要说的明的是最后两个属性里面有一个逻辑就是当左边的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 |
<!--自定义标题栏-->
<declare-styleable name="MyTitle">
<attr name="title_color" format="color" />
<attr name="title_text_size" format="dimension" />
<attr name="title_text_color" format="color" />
<attr name="title_text" format="string" />
<attr name="title_left_icon" format="reference" />
<attr name="title_right_icon" format="reference" />
<attr name="title_high" format="dimension" />
<attr name="left_isVisable" format="boolean" />
<attr name="right_isVisable" format="boolean" />
</declare-styleable>
- 好了自定义属性设定好了，接下来就要写自定义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 code_legend@163.com
* @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);
}
}
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<com.zh.connent.widget.TitleView
android:id="@+id/tlv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:left_isVisable="false"
app:right_isVisable="true"
app:title_right_icon="@mipmap/discovery_right_icon"
app:title_text="标题栏"
/>
好了，就是这么简单，直接拿来用就好，有什么问题可以给我留言。
