Android-自定义View

Android - 自定义View

---

在自定义View的时候一般我们会重写onDraw(Canvas canvas)方法，然后在系统给定的canvas画布上绘画就可以了。如果需要使用wrap_content属性，那么还需要重写onMeasure()方法

对现有的控件来进行扩展

这里以TextView为例，要实现这样的一个效果

只是在原有的TextView上加了一层框，其实就是绘制一个空心的矩形，理解这个我们就可以着手写代码了

protected void onDraw(Canvas canvas) {
    /**
     * 在调用super之前，这里也就是在绘制文本内容前来处理自己的逻辑
     */
    Paint p = new Paint();  
    p.setStyle(Paint.Style.STROKE); //设置为空心
    p.setStrokeWidth(5);                //设置外框线的宽度
    p.setColor(Color.YELLOW);           //设置线的颜色
    /**
     * 绘制矩形，起始x坐标，起始y坐标，终点x坐标，终点y坐标，用来绘画的paint
     */
    canvas.drawRect(0, 0, getMeasuredWidth(), getMeasuredHeight(), p);
    
    super.onDraw(canvas);
    
    /**
     * 在绘制完文本后处理自己的逻辑
     */
}

这时候就完成了对现有的控件的扩展，我们在XML中使用我们自定义的控件

<com.github.wanglu1209.MyTextViewDemo
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="20dp"
    android:text="My Android TextView" />

这里和使用正常的TextView没有什么区别，现在运行一下程序就是我们上面看到的效果了

---

定义全新的控件

有的时候系统给定的控件不能满足我们的需求，那么这个时候就需要重新自定义一个控件。这里我们就需要重写onMeasure()和onDraw()方法等方法来实现逻辑了，通过重写onTouchEvent()来实现触控的事件

来写一个实例，大约就长这个样子

首先来分析一下，无非就是两个部分，中间的圆和外面的弧线，只要在onDraw()中依次绘制就可以了。

在构造中初始化参数

private void initView() {
    mCirclePaint = new Paint();
    mCirclePaint.setColor(getResources().getColor(android.R.color.holo_blue_bright));
    mCirclePaint.setAntiAlias(true);    //设置抗锯齿

    mArcPaint = new Paint();
    mArcPaint.setAntiAlias(true);
    mArcPaint.setStyle(Paint.Style.STROKE);     //设置为空心
    mArcPaint.setStrokeWidth(40);
    mArcPaint.setColor(getResources().getColor(android.R.color.holo_blue_bright));

}

然后在onMeasure()中获取宽度，这里为了简单，直接就是屏幕的宽度

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    int length = MeasureSpec.getSize(widthMeasureSpec);
    mCircleXY = length / 2;
    mRadius = mCircleXY / 2;
    mRectF = new RectF(
            (float) (length * 0.1),
            (float) (length * 0.1),
            (float) (length * 0.9),
            (float) (length * 0.9)
    );
}

最后在onDraw()中绘制这两个图形即可

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    /**
     * 绘制圆形,参数依次为 圆的中心x坐标,圆的中心y坐标,圆的半径,画圆的笔
     */
    canvas.drawCircle(mCircleXY, mCircleXY, mRadius, mCirclePaint);
    /**
     * 绘制扇形,参数依次为 扇形的大小,起始角度,角度,是否与半径连线,画笔
     */
    canvas.drawArc(mRectF, 270, 240, false, mArcPaint);
}

现在运行程序，就可以看到我们最开始的效果啦

---

最后

爱生活，爱小丽，爱Android