在做项目的时候,经常会用到左边是返回键、右边是更多、中间是文字描述的topbar,那么就有必要写一个公用的了。
back键的文字大小、文字颜色和背景;
more键的文字大小、文字颜色和背景;
中间文字描述的文字、颜色和大小。
在values文件里创建attrs.xml,分别定义:
<declare-styleable name="TopBar">
<attr name="title" format="string"/>
<attr name="titleTextSize" format="dimension"/>
<attr name="titleTextColor" format="color"/>
<attr name="leftTextColor" format="color"/>
<attr name="leftBackground" format="reference|color"/>
<attr name="leftText" format="string"/>
<attr name="rightTextColor" format="color"/>
<attr name="rightBackground" format="reference|color"/>
<attr name="rightText" format="string"/>
declare-styleable>
这里用的是RelativeLayout,当然也可以使用LinearLayout。
public class TopBar extends RelativeLayout {
private String mTopBar_title;
private int mTopBar_titleTextColor;
private float mTopBar_titleTextSize;
private int mTopBar_leftTextColor;
private int mTopBar_rightTextColor;
private Drawable mTopBar_leftBackground;
private Drawable mTopBar_rightBackground;
private String mTopBar_leftText;
private String mTopBar_rightText;
private Button mLeftButton;
private Button mRightButton;
private TextView mTitleView;
private TopBarClickListener mTopBarClickListener;
@RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
public TopBar(Context context) {
this(context, null);
}
@RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
public TopBar(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
@RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
public TopBar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initData(context, attrs);
initView(context);
initListener();
}
private void initListener() {
/**
* 这里是把back和more的点击事件交给调用者
*/
mRightButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (mTopBarClickListener != null){
mTopBarClickListener.rightClick();
}
}
});
mLeftButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (mTopBarClickListener != null){
mTopBarClickListener.leftClick();
}
}
});
}
public void setTopBarClickListener(TopBarClickListener topBarClickListener){
mTopBarClickListener = topBarClickListener;
}
@RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN)
private void initView(Context context) {
mLeftButton = new Button(context);
mRightButton = new Button(context);
mTitleView = new TextView(context);
mLeftButton.setTextColor(mTopBar_leftTextColor);
mLeftButton.setText(mTopBar_leftText);
mLeftButton.setBackground(mTopBar_leftBackground);
mRightButton.setTextColor(mTopBar_rightTextColor);
mRightButton.setText(mTopBar_rightText);
mRightButton.setBackground(mTopBar_rightBackground);
mTitleView.setText(mTopBar_title);
mTitleView.setTextColor(mTopBar_titleTextColor);
mTitleView.setTextSize(mTopBar_titleTextSize);
mTitleView.setGravity(Gravity.CENTER);
LayoutParams mLeftParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
/**
* 设置该布局在RelativeLayout中的位置
*/
mLeftParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT, TRUE);
addView(mLeftButton, mLeftParams);
LayoutParams mRightParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
mRightParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT, TRUE);
addView(mRightButton, mRightParams);
LayoutParams mTitleParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
mTitleParams.addRule(RelativeLayout.CENTER_IN_PARENT, TRUE);
addView(mTitleView, mTitleParams);
}
private void initData(Context context, AttributeSet attrs) {
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.TopBar);
mTopBar_title = typedArray.getString(R.styleable.TopBar_title);
mTopBar_titleTextColor = typedArray.getColor(R.styleable.TopBar_titleTextColor, 0);
mTopBar_titleTextSize = typedArray.getDimension(R.styleable.TopBar_titleTextSize, 0);
mTopBar_leftTextColor = typedArray.getColor(R.styleable.TopBar_leftTextColor, 0);
mTopBar_rightTextColor = typedArray.getColor(R.styleable.TopBar_rightTextColor, 0);
mTopBar_leftBackground = typedArray.getDrawable(R.styleable.TopBar_leftBackground);
mTopBar_rightBackground = typedArray.getDrawable(R.styleable.TopBar_rightBackground);
mTopBar_leftText = typedArray.getString(R.styleable.TopBar_leftText);
mTopBar_rightText = typedArray.getString(R.styleable.TopBar_rightText);
/**
* 当获取完所有的属性值后,需要调用TypedArray的recycle方法来完成资源回收
*/
typedArray.recycle();
}
/**
* 控制back键和more键的显示和隐藏
* @param id
* @param flag
*/
public void setButtonVisable(int id, boolean flag){
if (flag){
if (id == 0){
mLeftButton.setVisibility(VISIBLE);
}else {
mRightButton.setVisibility(VISIBLE);
}
}else {
if (id == 1){
mLeftButton.setVisibility(GONE);
}else {
mRightButton.setVisibility(GONE);
}
}
}
public interface TopBarClickListener{
void leftClick();
void rightClick();
}
}
<com.why.topbar.TopBar xmlns:topbar="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/topBar"
android:layout_width="match_parent"
android:layout_height="40dp"
topbar:leftBackground="@drawable/blue_button"
topbar:leftText="back"
topbar:leftTextColor="#FFFFFF"
topbar:rightBackground="@drawable/blue_button"
topbar:rightText="more"
topbar:rightTextColor="#FFFFFF"
topbar:title="自定义标题"
topbar:titleTextColor="#123412"
topbar:titleTextSize="5sp"
>
com.why.topbar.TopBar>
到这里,一个topbar就完成了,当一个页面布局需要使用topbar的时候,就可以使用通过<include>标签使用.
<include layout="@layout/topbar"/>
有时候,我们需要更复杂的布局也可以通过这种方式实现。
图上的实际上是两个textview,左边的textview设置drawableLeft
,右边的textview设置drawableTop
就可以了。