最近在学自定义View做了个自定义Titlebar,在此记录下要点。
如果你要看引用方式请直接拉到文末。
下面是自定义类的代码。我选择继承自RalativeLayout。InitView()是我创建的初始化UI的方法。在里面用LayoutInflater加载了布局文件,然后把一些控件赋值。
然后看第二个构造方法,在这里我又从自己创建的attr文件里拿到一些自定义属性。(attrs文件后面会给出,在attrs文件里可以构建属于自己的属性,这些属性不同于自带的属性以android的开头,而是以app开头,android和app是命名空间)
在整个类方法里我还有3个set方法,这三个是访问器。setTitlte()用于更改标题,setLeftOnclickListener和setRIghtOnclickListenner是用于设置标题栏左右两个按键的点击事件的。
public class TitleBar extends RelativeLayout {
private ImageButton imageButton_left;
private ImageButton imageButton_right;
private TextView textView_center;
private RelativeLayout title_bar;
private String titleName="TITLT";
private int mColor=Color.BLUE;
private int mTextColor=Color.WHITE;
private int textSize=24;
private Drawable mLeftDrawble=getResources().getDrawable(R.drawable.back);
private Drawable mRightDrawble=getResources().getDrawable(R.drawable.more);
private int mleftSize=0;
private int mrightSize=0;
public TitleBar(Context context) {
super(context);
}
public TitleBar(Context context, AttributeSet attrs) {
super(context, attrs);
TypedArray mTypedArray=context.obtainStyledAttributes(attrs,R.styleable.TitleBar);
mColor=mTypedArray.getColor(R.styleable.TitleBar_backgroundColor,Color.BLUE);
mTextColor=mTypedArray.getColor(R.styleable.TitleBar_title_bg,Color.WHITE);
mLeftDrawble=mTypedArray.getDrawable(R.styleable.TitleBar_leftDrawble);
mRightDrawble=mTypedArray.getDrawable(R.styleable.TitleBar_rightDrawble);
titleName=mTypedArray.getString(R.styleable.TitleBar_title_text);
textSize=mTypedArray.getInteger(R.styleable.TitleBar_textSize,25);
mleftSize=mTypedArray.getInteger(R.styleable.TitleBar_leftSize,0);
mrightSize=mTypedArray.getInteger(R.styleable.TitleBar_rightSize,0);
initView(context);
}
public TitleBar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public void setTitle(String text){
textView_center.setText(text);
}
public void setLeftOnlickListener(OnClickListener onlickListener){
imageButton_left.setOnClickListener(onlickListener);
}
public void setRightOnclickListener(OnClickListener onclickListener){
imageButton_right.setOnClickListener(onclickListener);
}
public void initView(Context context){
LayoutInflater.from(context).inflate(R.layout.title_bar,this,true);
imageButton_left=(ImageButton)findViewById(R.id.left);
imageButton_right=(ImageButton)findViewById(R.id.right);
textView_center=(TextView)findViewById(R.id.title);
title_bar=(RelativeLayout)findViewById(R.id.title_bar);
if(mLeftDrawble!=null)
imageButton_left.setBackground(mLeftDrawble);
if(mRightDrawble!=null)
imageButton_right.setBackground(mRightDrawble);
title_bar.setBackgroundColor(mColor);
textView_center.setText(titleName);
textView_center.setTextColor(mTextColor);
textView_center.setTextSize(textSize);
ViewGroup.LayoutParams layoutParams = imageButton_left.getLayoutParams();
if(mleftSize!=0) {
layoutParams.height = mleftSize;
layoutParams.width = mleftSize;
imageButton_left.setLayoutParams(layoutParams);
}
if(mrightSize!=0) {
layoutParams = imageButton_right.getLayoutParams();
layoutParams.height = mrightSize;
layoutParams.width = mrightSize;
imageButton_right.setLayoutParams(layoutParams);
}
}
}
附上布局文件:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="@+id/title_bar"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
>
<ImageButton
android:id="@+id/left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:background="@drawable/back"/>
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:maxEms="11"
android:singleLine="true"
android:ellipsize="end"
android:textStyle="bold"/>
<ImageButton
android:id="@+id/right"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="@drawable/more"/>
</RelativeLayout>
attrs.xml文件是在Values文件夹下创建的。
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="TitleBar">
<attr name="backgroundColor" format="color"/>
<attr name="title_bg" format="color"/>
<attr name="title_text" format="string"/>
<attr name="leftDrawble" format="integer"/>
<attr name="rightDrawble" format="integer"/>
<attr name="textSize" format="integer"/>
<attr name="leftSize" format="integer"/>
<attr name="rightSize" format="integer"/>
</declare-styleable>
</resources>
下面讲下在活动布局里怎么添加它以及一些属性的设置
<com.example.thinkpad.titlebar.TitleBar
android:id="@+id/titlebar"
android:layout_width="match_parent"//宽度和高度我写死了。和系统默认保持一致
android:layout_height="wrap_content"
app:backgroundColor="@color/colorPrimary"//标题栏背景
app:title_text="CustomViewLearn"//标题栏文字
app:textSize="25"//标题栏文字大小
app:leftDrawble="@drawable/back"//左侧图片
app:rightDrawble="@drawable/more"//右侧图片
app:title_bg="@color/colorPrimary"//标题文字颜色
app:leftSize="25"//左边图标大小
app:rightSize="25"//右边图标大小
/>
然后附上在活动中设置点击监听器的代码
TitleBar titleBar=(TitleBar) findViewById(R.id.titlebar);
titleBar.setLeftOnlickListener(new View.OnClickListener(){
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"left was clicked!",Toast.LENGTH_SHORT).show();
}
});
titleBar.setRightOnclickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"right was clicked!",Toast.LENGTH_SHORT).show();
}
});
项目地址:https://github.com/DhyanaCoder/titlebar
另外我已经把这个控件做成开源库了(第一次做可能有很多问题,欢迎评论)!
引用方式如下:
Add it in your root build.gradle at the end of repositories:
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
Step 2. Add the dependency
dependencies {
implementation 'com.github.DhyanaCoder:titlebar:v1.1'
}