一.复合控件TopBar
创建复合控件可以很好地创建出具有重用功能的控件集合。比如TopBar。
做法:一般需要继承ViewGroup,再给它添加指定功能的控件。
以TopBar为例:
1.自定义属性
在values目录下创建attrs.xml文件,在该文件中定义相关的属性即可。
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="TopBar">
<!--<attr name="android:title"/>-->
<attr name="title1" format="string" />
<attr name="titleTextSize1" format="dimension" />
<attr name="titleTextColor1" 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>
</resources>
遇到的问题:
我在写代码的时候,开始是写成<attr name="title" format="string" />;当我运行的时候会出现错误:Attribute "title" has already been defined。
后来我将所有的title,titleTextSize,titleTextColor都改成title1,titleTextSize1,titleTextColor1,就不会出错了。
其实原因在于title等在系统中已经有了明确的语义定义了,也就是已经存在了。
我们也可以直接使用系统中已经定义好的属性<attr name="android:title" />,记住不要写format(判断是自己申明的,还是直接使用系统的,就看format)。
2.创建自定义控件,这里简单点,只是继承RelativeLayout,然后在构造方法中,写如下代码。这里需要使用带AttributeSet类型的构造方法,因为需要解析属性。
//1.通过这个方法,将你在attrs.xml中定义的所有属性的值存储到TypedArray集合中。
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.TopBar);
//2.从TypedArray中取出对应的值来为要设置的属性赋值。
String mTitle = ta.getString(R.styleable.TopBar_title1);
float mTitleTextSize = ta.getDimension(R.styleable.TopBar_titleTextSize1, 10);
int mTitleTextColor = ta.getColor(R.styleable.TopBar_titleTextColor1, 0);
String mLeftText = ta.getString(R.styleable.TopBar_leftText);
Drawable mLeftBackground = ta.getDrawable(R.styleable.TopBar_leftBackground);
int mLeftTextColor = ta.getColor(R.styleable.TopBar_leftTextColor, 0);
String mRightText = ta.getString(R.styleable.TopBar_rightText);
Drawable mRightBackground = ta.getDrawable(R.styleable.TopBar_rightBackground);
int mRightTextColor = ta.getColor(R.styleable.TopBar_rightTextColor, 0);
//3.获取完TypedArray的值后,调用recycle进行资源的回收,避免重新创建的时候的错误。
ta.recycle();
分析:
1.获取存储自定义属性的TypedArray集合。
2.取出对应的属性值,注意其类型。
3.资源回收,避免重新创建时出现错误。
3.动态添加控件(在TopBar中,需要左右Button,和一个TextView)
//1.创建需要的控件
mLeftButton = new Button(context);
mRightButton = new Button(context);
mTitleView = new TextView(context);
//2.为控件赋值(自定义的属性)
mLeftButton.setText(mLeftText);
mLeftButton.setBackground(mLeftBackground);
mLeftButton.setTextColor(mLeftTextColor);
mRightButton.setText(mRightText);
mRightButton.setBackground(mRightBackground);
mRightButton.setTextColor(mRightTextColor);
mTitleView.setText(mTitle);
mTitleView.setTextSize(mTitleTextSize);
mTitleView.setTextColor(mTitleTextColor);
mTitleView.setGravity(Gravity.CENTER);
//3.设置布局
LayoutParams mLeftParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
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);
分析:
动态添加控件更加具有重用性,而不是仅仅写在xml文件中。
1.创建控件实例
2.为控件设置自定义属性
3.设置控件的布局参数(注意是RelativeLayout.LayoutParams)
4.添加控件到View中
4.在构造方法中实现左右按钮的点击事件,但是具体的逻辑不给出。因为想要做的是整个UI模板。所以具体的逻辑给调用者去写。这里也涉及到了接口回调。详见接口回调。
接口回调的具体步骤(要去理解,而不是去死记硬背):
1.定义接口,抽象方法
2.定义接口对象,在要实现的地方调用方法
3.暴露一个公共方法给调用者使用
mLeftButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
mListener.leftClick();
}
});
mRightButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
mListener.rightClick();
}
});
5.实现接口回调的最后步骤
在调用者代码中,实现上述接口,并且完成暴露出来的方法。具体要实现的逻辑由调用者决定。
topBar.setOnTopbarClickListener(new TopBar.topbarClickListener() {
@Override
public void leftClick() {
Toast.makeText(MainActivity.this,"点击左边按钮",Toast.LENGTH_SHORT).show();
}
@Override
public void rightClick() {
Toast.makeText(MainActivity.this,"点击右边按钮",Toast.LENGTH_SHORT).show();
}
});
6.引用UI模板
上述1~5点是完整的TopBar.java
1.在引用前,需要指定引用第三方控件的名字空间(xmlns---xmlnamespace)
xmlns:custom="http://schemas.android.com/apk/res-auto" custom就是命名空间,该名字可以随便取
系统的引用:xmlns:android="http:schemas.android.com/apk/res/android"。现在明白了为什么在创建xml文件的时候,总会有这句话了吧。
之后在XML文件中使用自定义属性的时候,就可以通过这个名字空间来引用
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.example.geyan.textviewdemo.TopBar
android:id="@+id/topbar"
android:layout_width="match_parent"
android:layout_height="40dp"
custom:leftBackground="#ffa4c161"
custom:leftText="Back"
custom:leftTextColor="#FFFFFF"
custom:rightBackground="#ffa4c161"
custom:rightText="More"
custom:rightTextColor="#FFFFFF"
custom:title1="自定义标题"
custom:titleTextColor1="#000000"
custom:titleTextSize1="8sp"></com.example.geyan.textviewdemo.TopBar>
</RelativeLayout>
分析:
最好不要写到activity_main.xml文件中,创建一个xml文件写入,是为了让activity_main.xml文件看起来不会太复杂;而且很方便的可以在其他布局文件中引用。
从代码中可以看出,使用自定义的View和系统原生的View最大区别在于申明控件时,需要指定完整的包名;而引用自定义属性时,需要使用自定义的xmlns
2.在主布局文件中引用topbar.xml即可
<include layout="@layout/topbar" />