Kotlin入门(24)如何自定义视图

android提供了丰富多彩的视图与控件，已经能够满足大部分的业务需求，然而计划赶不上变化，总是有意料之外的情况需要特殊处理。比如pagertabstrip无法在布局文件中指定文本大小和文本颜色，只能在代码中通过settextsize和settextcolor方法来设置。这用起来殊为不便，如果它能像textview那样直接在布局指定文本大小和颜色就好了；要想让pagertabstrip支持该特性，就得通过自定义视图来实现，而自定义视图的第一种途径便是自定义属性。
仍旧以翻页标题栏pagertabstrip举例，现在给它新增两个自定义属性，分别是文本颜色textcolor，以及文本大小textsize。下面给出java编码的自定义步骤：
1. 在res\values目录下创建attrs.xml，文件内容如下所示，其中declare-styleable的name属性值表示新视图的名称，两个attr节点表示新增的两个属性分别是textcolor和textsize：

<resources>
    <declare-styleable name="custompagertab">
        <attr name="textcolor" format="color" />
        <attr name="textsize" format="dimension" />
    </declare-styleable>
</resources>

 

2. 在模块的widget目录下创建custompagertab.java，填入以下自定义视图的代码：

public class custompagertab extends pagertabstrip {
    private int textcolor = color.black;
    private int textsize = 15;

    public custompagertab(context context) {
        super(context);
    }
    
    public custompagertab(context context, attributeset attrs) {
        super(context, attrs);
        //构造函数从attrs.xml读取custompagertab的自定义属性
        if (attrs != null) {
            typedarray attrarray=getcontext().obtainstyledattributes(attrs, r.styleable.custompagertab);
            textcolor = attrarray.getcolor(r.styleable.custompagertab_textcolor, textcolor);
            textsize = attrarray.getdimensionpixelsize(r.styleable.custompagertab_textsize, textsize);
            attrarray.recycle();
        }
        settextcolor(textcolor);
        settextsize(typedvalue.complex_unit_sp, textsize);
    }
    
//    //pagertabstrip没有三个参数的构造函数
//    public pagertab(context context, attributeset attrs, int defstyleattr) {
//    }
}

3. 布局文件的根节点增加自定义的命名空间声明，如“xmlns:app="http://schemas.android.com/apk/res-auto"”；并把android.support.v4.view.pagertabstrip的节点名称改为自定义视图的全路径名称如“com.example.custom.widget.pagertab”，同时在该节点下指定新增的两个属性即app:textcolor与app:textsize。修改之后的布局文件代码如下：

<linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="10dp" >

    <android.support.v4.view.viewpager
        android:id="@+id/vp_content"
        android:layout_width="match_parent"
        android:layout_height="400dp" >

        <com.example.custom.widget.custompagertab
            android:id="@+id/pts_tab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:textcolor="@color/red"
            app:textsize="17sp" />
    </android.support.v4.view.viewpager>
</linearlayout>

上述自定义属性的三个步骤，其中第二步骤涉及到java代码，接下来用kotlin改写custompagertab类的代码，主要改动有以下两点：

1、原来的两个构造函数，合并为带默认参数的一个主构造函数，并且直接跟在类名后面；
2、类名后面要加上注解“@jvmoverloads constructor”，表示该类支持被java代码调用。因为布局文件中引用了自定义视图的节点，系统是通过sdk里的java代码找到自定义视图类，所以凡是自定义视图都要加上该注解，否则app运行时会抛出异常。
下面是custompagertab类改写之后的kotlin代码：

//自定义视图务必要在类名后面增加“@jvmoverloads constructor”，因为布局文件中的自定义视图必须兼容java
class custompagertab @jvmoverloads constructor(context: context, attrs: attributeset?=null) : pagertabstrip(context, attrs) {
    private var txtcolor = color.black
    private var textsize = 15
    
    init {
        txtcolor = color.black
        textsize = 15
        //初始化时从attrs.xml读取custompagertab的自定义属性
        if (attrs != null) {
            val attrarray = getcontext().obtainstyledattributes(attrs, r.styleable.custompagertab)
            txtcolor = attrarray.getcolor(r.styleable.custompagertab_textcolor, txtcolor)
            textsize = attrarray.getdimensionpixelsize(r.styleable.custompagertab_textsize, textsize)
            attrarray.recycle()
        }
        settextcolor(txtcolor)
        settextsize(typedvalue.complex_unit_sp, textsize.tofloat())
    }
}

 

完成以上三步修改后，运行测试应用，展示的界面效果如下图所示，此时翻页标题栏的文字颜色变为红色，而且字体也变大了。