这里说的是自定义标题栏组件,通过设置组件的部分属性,实现标题栏的不同的展示样式,先上效果图:
自定义标题栏组件不同效果展示图
自定义组件步骤:
1)继承自View或容器布局
2)xml中引入自定义控件
3)代码中设置属性或实现接口
直接上代码:
TitleView.java
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.Button;
import android.widget.RelativeLayout;
import android.widget.TextView;
import com.mobile.cdtx.blog.R;
/**
* Created by wangwentao on 2017/2/4.
*自定义标题栏组件
* 主要实现的功能:
* 1.标题栏中包含了左边按钮、标题、右边按钮
* 2.可以显示左边按钮、右边按钮中的某一个或都不显示或都显示
* 3.左边或右边可以显示图片背景或只显示文字
* 4.左边或右边按钮可以设置边距
* 5.默认均是居中显示
* 6.可以指定左边或右边按钮的大小或默认包裹内容
* 7.可以指定标题栏的背景,文字大小和颜色
* 8.可以指定按钮中的文字的大小,颜色等
*/
public class TitleView extends RelativeLayout {
//标题栏上的三部分控件:左边按钮 + 中间标题 + 右边按钮
private Button leftButton;//左边按钮
private TextView titleView;//中间标题
private Button rightButton;//右边按钮
//标题栏的背景色
private int titleBackgroundColor;
//左边按钮的属性
private int leftTextColor;//左侧按钮的文字的颜色
private Drawable leftBackground;//左侧按钮的背景
private String leftText;//左侧按钮的文字
private float leftTextSize;//左边文字的大小
private int leftWidth;//左侧按钮的宽度
private int leftHeight;//左侧按钮的宽度
private int leftLeftMargin;//左侧按钮的左边距
private int leftTopMargin;//左侧按钮的上下边距
//中间标题的属性
private float titleTextSize;//标题的文字的大小
private int titleTextColor;//标题的文字的颜色
private String titleText;//标题的文字
//右边按钮的属性
private int rightTextColor;//右边按钮文字的颜色
private Drawable rightBackground;//右边按钮的背景
private String rightText;//右边按钮的文字
private float rightTextSize;//左边文字的大小
private int rightWidth;//右侧按钮的宽度
private int rightHeight;//右侧按钮的高度
private int rightRightMargin;//右侧按钮的边距
private int rightTopMargin;//右侧按钮的上下边距
//布局属性,用来控制组件元素在ViewGroup中的位置
private LayoutParams leftParams, titleParams, rightParams;//左边布局,中间布局,右边布局
//标题栏左边按钮和右边按钮的点击事件监听
private TitleViewClickListener mListener;
public TitleView(Context context, AttributeSet attrs) {
super(context, attrs);
//动态创建左边按钮,中间标题,右边按钮
leftButton = new Button(context);
titleView = new TextView(context);
rightButton = new Button(context);
//将在attrs.xml中定义的declare-styleable的所有属性的值存储到TypedArray中
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.TitleView);
//标题的背景色
titleBackgroundColor = ta.getColor(R.styleable.TitleView_titleBackgroundColor, 0);
setBackgroundColor(titleBackgroundColor);
//左侧文字的颜色
leftTextColor = ta.getColor(R.styleable.TitleView_leftTextColor, 0);
leftButton.setTextColor(leftTextColor);
//左侧按钮的背景
leftBackground = ta.getDrawable(R.styleable.TitleView_leftBackground);
leftButton.setBackground(leftBackground);
//左侧按钮的文字
leftText = ta.getString(R.styleable.TitleView_leftText);
leftButton.setText(leftText);
//左侧按钮文字的大小
leftTextSize = ta.getDimension(R.styleable.TitleView_leftTextSize, 12);
leftButton.setTextSize(leftTextSize);
//左侧按钮的边距
leftLeftMargin = (int)ta.getDimension(R.styleable.TitleView_leftLeftMargin, 0);
leftTopMargin = (int)ta.getDimension(R.styleable.TitleView_leftTopMargin, 0);
//标题文字
titleText = ta.getString(R.styleable.TitleView_title);
titleView.setText(titleText);
//标题文字的颜色
titleTextColor = ta.getColor(R.styleable.TitleView_titleTextColor, 0);
titleView.setTextColor(titleTextColor);
//标题文字的大小
titleTextSize = ta.getDimension(R.styleable.TitleView_titleTextSize, 12);
titleView.setTextSize(titleTextSize);
//右侧按钮的背景
rightBackground = ta.getDrawable(R.styleable.TitleView_rightBackground);
rightButton.setBackground(rightBackground);
//右侧按钮的文字的颜色
rightTextColor = ta.getColor(R.styleable.TitleView_rightTextColor, 0);
rightButton.setTextColor(rightTextColor);
//右侧按钮的文字
rightText = ta.getString(R.styleable.TitleView_rightText);
rightButton.setText(rightText);
//右侧按钮的文字的大小
rightTextSize = ta.getDimension(R.styleable.TitleView_rightTextSize, 12);
rightButton.setTextSize(rightTextSize);
//左侧按钮的宽度和高度
leftWidth = (int)ta.getDimension(R.styleable.TitleView_leftWidth, 0);
leftHeight = (int)ta.getDimension(R.styleable.TitleView_leftHeight, 0);
//右侧按钮的宽度和高度
rightWidth = (int)ta.getDimension(R.styleable.TitleView_rightWidth, 0);
rightHeight = (int)ta.getDimension(R.styleable.TitleView_rightHeight, 0);
//右侧按钮的边距
rightRightMargin = (int)ta.getDimension(R.styleable.TitleView_rightRightMargin, 0);
rightTopMargin = (int)ta.getDimension(R.styleable.TitleView_rightTopMargin, 0);
ta.recycle();//获取完TypedArray的值后,调用recyle()方法回收内存,避免重新创建的时候报错
//为左边按钮设置相应的布局元素
leftParams = new LayoutParams(leftWidth == 0 ? LayoutParams.WRAP_CONTENT:leftWidth,leftHeight == 0 ?LayoutParams.WRAP_CONTENT:leftHeight);
leftParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT, TRUE);
if(leftHeight > 0){
leftParams.setMargins(leftLeftMargin,leftTopMargin,0,leftTopMargin);
}
addView(leftButton, leftParams);// 添加到容器(ViewGroup)中
//为中间的标题设置相应的布局元素
titleParams = new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
titleParams.addRule(RelativeLayout.CENTER_IN_PARENT, TRUE);
addView(titleView, titleParams);//添加到容器(ViewGroup)中
//为右边按钮设置相应的布局元素
rightParams = new LayoutParams(rightWidth == 0 ? LayoutParams.WRAP_CONTENT:rightWidth,rightHeight == 0 ? LayoutParams.WRAP_CONTENT:rightHeight);
rightParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, TRUE);
if(rightHeight > 0){//自定义了右边按钮的高度
rightParams.setMargins(0,rightTopMargin,rightRightMargin,rightTopMargin);
}
addView(rightButton, rightParams);//添加到容器(ViewGroup)中
//为左边按钮设置点击事件
leftButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
mListener.leftClick();//执行外部实现的接口
}
});
//为右边按钮设置点击事件
rightButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
mListener.rightClick();//执行外部实现的接口
}
});
}
//外部调用此方法,设置点击事件监听
public void setOnTitleViewClickListener(TitleViewClickListener mListener){
this.mListener = mListener;
}
//外部调用接口,实现接口的具体方法
public interface TitleViewClickListener{
void leftClick();//左边按钮的点击事件
void rightClick();//右边按钮的点击事件
}
/*
*控件左右按钮的显示
*showStatus:0,都不显示;1,只显示左侧按钮;2,只显示右侧按钮;3,两个按钮都显示
*/
public void setButtonVisible(int showStatus){
if(0 == showStatus){//都不显示
leftButton.setVisibility(View.GONE);
rightButton.setVisibility(View.GONE);
}else if(1 == showStatus){//只显示左侧按钮
leftButton.setVisibility(View.VISIBLE);
rightButton.setVisibility(View.GONE);
}else if(2 == showStatus){//只显示右侧按钮
leftButton.setVisibility(View.GONE);
rightButton.setVisibility(View.VISIBLE);
}else if(3 == showStatus){//两个按钮都显示
leftButton.setVisibility(View.VISIBLE);
rightButton.setVisibility(View.VISIBLE);
}
}
}
测试代码如下:
/**
* Created by wangwentao on 2017/2/4.
* 测试自定义标题栏
*/
public class TitleActivityCustom extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.requestWindowFeature(Window.FEATURE_NO_TITLE);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.activity_title_custom);
//标题栏1
TitleView titleView1 = (TitleView) findViewById(R.id.id_title_view);
titleView1.setOnTitleViewClickListener(new TitleView.TitleViewClickListener() {
@Override
public void leftClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题1左边的按钮", Toast.LENGTH_SHORT).show();
}
@Override
public void rightClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题1右边按钮", Toast.LENGTH_SHORT).show();
}
});
titleView1.setButtonVisible(3);
//标题栏2
TitleView titleView2 = (TitleView) findViewById(R.id.id_title_two);
titleView2.setOnTitleViewClickListener(new TitleView.TitleViewClickListener() {
@Override
public void leftClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题2左边的按钮", Toast.LENGTH_SHORT).show();
}
@Override
public void rightClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题2右边按钮", Toast.LENGTH_SHORT).show();
}
});
titleView2.setButtonVisible(3);
//标题3
TitleView titleView3 = (TitleView) findViewById(R.id.id_title_three);
titleView3.setOnTitleViewClickListener(new TitleView.TitleViewClickListener() {
@Override
public void leftClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题3左边的按钮", Toast.LENGTH_SHORT).show();
}
@Override
public void rightClick() {
}
});
titleView3.setButtonVisible(1);
//标题栏4
TitleView titleView4 = (TitleView) findViewById(R.id.id_title_four);
titleView4.setButtonVisible(0);
//标题栏5
TitleView titleView5 = (TitleView) findViewById(R.id.id_title_five);
titleView5.setOnTitleViewClickListener(new TitleView.TitleViewClickListener() {
@Override
public void leftClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题5左边的按钮", Toast.LENGTH_SHORT).show();
}
@Override
public void rightClick() {
}
});
titleView5.setButtonVisible(1);
//标题栏6
TitleView titleView6 = (TitleView) findViewById(R.id.id_title_six);
titleView6.setOnTitleViewClickListener(new TitleView.TitleViewClickListener() {
@Override
public void leftClick() {
}
@Override
public void rightClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题6右边的按钮", Toast.LENGTH_SHORT).show();
}
});
titleView6.setButtonVisible(2);
//标题栏7
TitleView titleView7 = (TitleView) findViewById(R.id.id_title_seven);
titleView7.setOnTitleViewClickListener(new TitleView.TitleViewClickListener() {
@Override
public void leftClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题7左边的按钮", Toast.LENGTH_SHORT).show();
}
@Override
public void rightClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题7右边按钮", Toast.LENGTH_SHORT).show();
}
});
titleView7.setButtonVisible(3);
//标题栏8
TitleView titleView8 = (TitleView) findViewById(R.id.id_title_eight);
titleView8.setOnTitleViewClickListener(new TitleView.TitleViewClickListener() {
@Override
public void leftClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题8左边的按钮", Toast.LENGTH_SHORT).show();
}
@Override
public void rightClick() {
Toast.makeText(TitleActivityCustom.this, "点中了标题8右边按钮", Toast.LENGTH_SHORT).show();
}
});
titleView8.setButtonVisible(3);
}
}
布局文件
activity_title_custom.xml
自定义组件中使用的属性,res\values\attrs.xml
-
-
-
actions_about.png