android复合控件

一.复合控件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" />