自定义控件二

        上一篇博客讲到完全自定义的控件，这篇主要介绍将现有的控件组合起来，形成一个新的控件。

大致的流程差不多。以TagView为例，效果图如下图所示，一个ImageView和RadioButton组合在一起。

        创建的步骤主要有以下几步：

       1）创建TagView继承自ViewGroup；

public class TagView extends LinearLayout {


    public TagView(Context context, AttributeSet attrs) {
        super(context, attrs);
        //初始化
    }

    public TagView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        //初始化
    }
}

        2）自定义属性，并引入到xml文件当中；

        自定义属性src

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="TagView">
        <attr name="src" format="reference"/>
    </declare-styleable>

</resources>

        将src属性添加到布局文件当中，注意要添加自定义属性的命名空间

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="date.hb.com.tagview.MainActivity"
    xmlns:custom="http://schemas.android.com/apk/res-auto">


    <date.hb.com.tagview.TagView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        custom:src="@mipmap/ic_launcher" />

</RelativeLayout>

 

        3）读取属性；

    private void initAttrs(AttributeSet attrs) {
        //读取属性
        TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.TagView);
        imageSrc = typedArray.getDrawable(R.styleable.TagView_src);

        typedArray.recycle();
    }

        4）将各个控件排列，添加到ViewGroup当中；

private void initView(Context context) {
        this.setOrientation(LinearLayout.VERTICAL);
        imageView = new ImageView(context);
        imageView.setBackground(imageSrc);
        imageLayoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, 
                                            LayoutParams.WRAP_CONTENT);//宽 高
        imageLayoutParams.gravity = Gravity.CENTER_HORIZONTAL;
        addView(imageView, imageLayoutParams);

        radioButton = new RadioButton(context);
        radioLayoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, 
                                             LayoutParams.WRAP_CONTENT);
        radioLayoutParams.gravity = Gravity.CENTER_HORIZONTAL;
        addView(radioButton, radioLayoutParams);
    }

完整的源码如下：

 

public class TagView extends LinearLayout {

    private Drawable imageSrc;

    private ImageView imageView;
    private RadioButton radioButton;

    private LayoutParams imageLayoutParams;
    private LayoutParams radioLayoutParams;

    public TagView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initAttrs(attrs);
        initView(context);
    }

    public TagView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initAttrs(attrs);
        initView(context);
    }

    private void initAttrs(AttributeSet attrs) {
        //读取属性
        TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.TagView);
        imageSrc = typedArray.getDrawable(R.styleable.TagView_src);

        typedArray.recycle();
    }

    @TargetApi(Build.VERSION_CODES.JELLY_BEAN)
    private void initView(Context context) {
        this.setOrientation(LinearLayout.VERTICAL);
        imageView = new ImageView(context);
        imageView.setBackground(imageSrc);
        imageLayoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, 
                                             LayoutParams.WRAP_CONTENT);//宽 高
        imageLayoutParams.gravity = Gravity.CENTER_HORIZONTAL;
        addView(imageView, imageLayoutParams);

        radioButton = new RadioButton(context);
        radioLayoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, 
                                             LayoutParams.WRAP_CONTENT);
        radioLayoutParams.gravity = Gravity.CENTER_HORIZONTAL;
        addView(radioButton, radioLayoutParams);
    }
}