【Android自定义View】-组合控件

Android自定义View，如果说要按类型来划分的话，
自定义View的实现方式大概可以分为三种，自绘控件、组合控件、以及继承控件。

组合控件定义

我们并不需要自己去绘制视图上显示的内容，而只是用系统原生的控件就好了，
但我们可以将几个系统原生的控件组合到一起，这样创建出的控件就被称为组合控件。

优点

• 使代码、xml更简洁
• 提高复用性
• 简单、易上手（不需要自己去绘制视图上显示的内容、不需要了解View的机制）
• 相比较使用<include>标签，自定义组合控件提高了代码的复用性

自定义要点：

• 1.创建组合控件的xml

• 2.加载xml文件是在构造方法中完成的，通过调用LayoutInflater.from(context).inflate(R.layout.my_layout,this,true)；

• 3.如果需要从资源文件中加载自定义的属性，则必须重写带有(Context context, AttributeSet attrs)此构造方法，属性是定义在attrs.xml中的；

• 4.获取子控件对象，可以在构造方法中获取，也可以重写onFinishInflate()方法来获取，推荐采用第二种，可以保证控件已经完全加载好了；

• 5.添加事件可以直接在控件中写，不过考虑到扩展性及复用性，建议对外暴露接口。

示例代码、

• 布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="@dimen/hs175"
    android:gravity="center_vertical"
    android:orientation="horizontal">
    <ImageButton android:id="@+id/ib_header"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:src="@android:drawable/ic_menu_zoom" />
    <TextView android:id="@+id/tv_header"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true" />
</LinearLayout>

• 组合控件

/**
 * 自定义标题栏组合控件，内部包含一个TextView和一个ImageButton
 */
public class Header extends RelativeLayout {

    private TextView mTextView;
    private ImageButton mImageButton;

    private String titleText;
    private int titleTextColor;
    private float titleTextSize;

    public Header(Context context) {
        super(context);
    }

    public Header(Context context, AttributeSet attrs) {
        super(context, attrs);

        //加载视图的布局
        LayoutInflater.from(context).inflate(R.layout.header,this,true);

        //加载自定义的属性
        TypedArray a=context.obtainStyledAttributes(attrs,R.styleable.Header);
        titleText=a.getString(R.styleable.Header_titleText);
        titleTextColor=a.getColor(R.styleable.Header_titleTextColor, Color.WHITE);
        titleTextSize=a.getDimension(R.styleable.Header_titleTextSize,20f);

        //回收资源，这一句必须调用
        a.recycle();
    }

    /**
     * 此方法会在所有的控件都从xml文件中加载完成后调用
     */
    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();

        //获取子控件
        mTextView= (TextView) findViewById(R.id.tv_header);
        mImageButton= (ImageButton) findViewById(R.id.ib_header);

        //将从资源文件中加载的属性设置给子控件
        if (!TextUtils.isEmpty(titleText))
            setPageTitleText(titleText);
        setPageTitleTextColor(titleTextColor);
        setPageTitleTextSize(titleTextSize);

    }

    /**
     * 设置标题文字
     * @param text
     */
    public void setPageTitleText(String text) {
        mTextView.setText(text);
    }

    /**
     * 设置标题文字颜色
     * @param color
     */
    public void setPageTitleTextColor(int color) {
        mTextView.setTextColor(color);
    }

    /**
     * 设置标题文字大小
     * @param size
     */
    public void setPageTitleTextSize(float size) {
        mTextView.setTextSize(size);
    }

    /**
     * 设置按钮点击事件监听器
     * @param listener
     */
    public void setOnHeaderClickListener(OnClickListener listener) {
        mImageButton.setOnClickListener(listener);
    }
}

• 将组合控件添加到布局文件中

<!-- 通过包的类的全名来引用自定义视图-->
   <com.ivan.app1.widgets.Header
       android:id="@+id/header"
       android:layout_width="match_parent"
       android:layout_height="48dp"
       android:background="@color/black"
       app:titleText="我是标题"
       app:titleTextColor="#ff0000"
       app:titleTextSize="12sp"/>

• 自定义属性文件：attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- 自定义的属性-->
    <declare-styleable name="Header">
        <attr name="titleTextSize" format="dimension" />
        <attr name="titleTextColor" format="color" />
        <attr name="titleText" format="string"/>
    </declare-styleable>
</resources>

参考文献

Android中自定义组合控件