Android自定义控件

导语

当系统控件不能满足我们的需求的时候，这时候我们就需要自定义控件，根据我们的需求来定制一个能满足我们需求的控件。一个让用户熟悉的控件才是一个好的控件，如果一味追求酷炫的效果，会让用户觉得华而不实。

主要内容

• 了解自定义控件
• 对现有控件进行拓展
• 创建复合控件
• 重写View来实现全新控件
• 自定义ViewGroup

具体内容

自定义控件可以是对现有控件进行拓展、创建复合控件、重写View实现全新控件，可根据需要不同选择最佳方式进行自定义控件。

了解自定义控件

在自定义View时，我们通常会去重写onDraw()方法来绘制View的显示内容。如果该View还需要使用wrap_content属性，那么还必须重写onMeasure()方法。另外，通过自定义attrs属性，还可以设置新的属性配置值。
在View中通常有以下一些比较重要的回调方法：
- onFinishInflate()：从XML加载组件后回调。
- onSizeChanged()：组件大小改变时回调。
- onMeasure()：回调该方法来进行测量。
- onLayout()：回调该方法来确定显示的位置。
- onTouchEvent()：监听到触摸事件时回调。

当然，创建自定义View的时候，并不需要重写所有的方法，只需要重写特定条件的回调方法即可。这也是Android控件架构灵活性的体现。
在通常情况下，有以下三种方法来实现自定义的控件：
- 对现有控件进行拓展
- 创建复合控件
- 重写View来实现全新控件

对现有控件进行拓展

这是一个非常重要的自定义View方法，它可以在原生控件的基础上进行拓展，增加新的功能、修改显示的UI等。一般来说我们可以在onDraw()方法中对原生控件行为进行拓展。
以一个TextView为例，使用Canvas对象来进行图像的绘制，然后利用Android的绘图机制，可以绘制出更加复杂丰富的图像。比如可以利用LinearGradient Shader和Matrix来实现一个动态的文字闪动效果，程序运行效果如下图所示。

要想实现这一个效果，可以充分利用Android中Paint对象的Shader渲染器。通过设置一个不断变化的LinearGradient，并使用带有该属性的Paint对象来绘制要显示的文字。首先，在onSizeChanged()方法中进行一些对象的初始化工作，并根据View的宽度设置一个LinearGradient渐变渲染器，代码如下：

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh){
    super.onSizeChanged(w, h, oldw, oldh);
    if(mViewWidth  == 0) {
        mViewWidth = getMeasuredWidth();
        if(mViewWidth > 0) {
            mPaint = getPaint();
            // 创建mLinearGradient渐变渲染器并填充到画笔mPaint
            mLinearGradient = new LinearGradient(0, 0, mViewWidth, 0, 
                    new int[] {Color.BLUE, 0xffffffff, Color.BLUE}, 
                    null, Shader.TileMode.CLAMP);
            mPaint.setShader(mLinearGradient);
            mGradientMatrix = new Matrix();
        }
    }
}

其中最关键的就是使用getPaint()方法获取当前绘制TextView的Paint对象，并给这个Paint对象设置原生TextView没有的LinearGradient属性。最后，在onDraw()方法中，通过矩阵的方式来不断平移渐变效果，从而在绘制文字时，产生动态的冷却效果，代码如下所示：

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    if(mGradientMatrix != null) {
        mTranslate += mViewWidth / 5;
        if(mTranslate > 2 * mViewWidth) {
            mTranslate = -mViewWidth;
        }
        mGradientMatrix.setTranslate(mTranslate, 0);  // 设置位移
        mLinearGradient.setLocalMatrix(mGradientMatrix);
        postInvalidateDelayed(100);  // 延时刷新
    }
}

这样就完成了对TextView进行拓展，制作一个动态文字闪动的TextView。

创建复合控件

创建复合控件可以很好地创建出具体重用功能的控件集合。这种方式通常需要继承一个合适的ViewGroup，再给它添加指定功能的控件，从而组合成新的复合控件。通过这种方式创建的控件，我们一般会给它指定一些可配置的属性，让它具有更强的拓展性。
下面就以一个通用的TopBar为示例，进行讲解如何创建复合控件。效果如下所示。

首先新建一个TopBar类继承RelativeLayout。

public class TopBar extends RelativeLayout {
   

    public TopBar(Context context) {
        this.TopBar(context, null);
    }

    public TopBar(Context context, AttributeSet attrs) {
        super(context, attrs);
        // 初始化的方法
        // 初始化属性
        initAttr(context, attrs)
        // 初始化布局
        initView(context);
        // 初如化事件
        initEvent();
    }

}

定义属性

为一个View提供可自定义的属性非常简单，只需要在res资源目录的values目录下创建一个attrs.xml的属性定义文件，并在该文件中通过如下代码定义相应的属性即可。

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

<resources>

    <declare-styleable name="TopBar">
        <!-- 定义title文字，大小，颜色 -->
        <attr name="title" format="string" />
        <attr name="titleTextSize" format="dimension" />
        <attr name="titleTextColor" format="color" />
        <!-- 定义left 文字，大小，颜色，背景 -->
        <attr name="leftTextColor" format="color" />
        <attr name="leftTextSize" format="dimension" />
        <!-- 表示背景可以是颜色，也可以是引用 -->
        <attr name="leftBackground" format="reference|color" />
        <attr name="leftText" format="string" />
        <!-- 定义right 文字，大小，颜色，背景 -->
        <attr name="rightTextColor" format="color" />
        <attr name=&