Android 自定义View实现环形带刻度的进度条

本篇文章讲的是自定义View实现环形带刻度的进度条。和往常一样，主要还是想总结一下自定义View实现环形带刻度的进度条的开发过程以及一些需要注意的地方。
按照惯例，我们先来看看效果图

一、我们如何来实现这样一个环形刻度进度条：
首先，需要绘制一个灰色的环形刻度尺底图，来作为未填充时的进度条；
然后，根据传入的当前进度值，绘制填充时的进度圆弧；
其次，根据进度值绘制文字提示；
最后，重绘控件，加上动画，从而达到显示进度的效果。

二、view的几个常用触发方法
1. onFinishInflate()：当View中所有的子控件均被映射成xml后触发
2. onMeasure(int widthMeasureSpec, int heightMeasureSpec)：确定所有子元素的大小
3. onLayout(boolean changed, int l, int t, int r, int b)：当View分配所有的子元素的大小和位置时触发
4. onSizeChanged(int w, int h, int oldw, int oldh)：当view的大小发生变化时触发
5. onDraw(Canvas canvas)：负责将View绘制在屏幕上

三、View 的几个构造函数
1、public CircleProgress(Context context)
—>java代码直接new一个CircleProgress实例的时候，会调用这个只有一个参数的构造函数；
2、public CircleProgress(Context context, AttributeSet attrs)
—>在默认的XML布局文件中创建的时候调用这个有两个参数的构造函数。AttributeSet类型的参数负责把XML布局文件中所自定义的属性通过AttributeSet带入到View内；
3、public CircleProgress(Context context, AttributeSet attrs, int defStyleAttr)
—>构造函数中第三个参数是默认的Style，这里的默认的Style是指它在当前Application或者Activity所用的Theme中的默认Style，且只有在明确调用的时候才会调用
4、public CircleProgress(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes)
—>该构造函数是在API21的时候才添加上的
自定义View中，我们需要重写了3个构造方法，在上面的构造方法中说过默认的布局文件调用的是两个参数的构造方法，所以记得让所有的构造方法调用三个参数的构造方法，然后在三个参数的构造方法中获得自定义属性。

一开始一个参数的构造方法和两个参数的构造方法是这样的：

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

    public CircleProgress(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

我们需要注意的是super应该改成this，然后让一个参数的构造方法引用两个参数的构造方法，两个参数的构造方法引用三个参数的构造方法，代码如下：

    public CircleProgress(Context context) {
        this(context, null);
    }

    public CircleProgress(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

四、下面我们就开始来看看代码啦
1、自定义View的属性，首先在res/values/ 下建立一个attrs.xml ， 在里面定义我们的需要用到的属性以及声明相对应属性的取值类型

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- 是否开启抗锯齿 -->
    <attr name="antiAlias" format="boolean" />
    <!-- 圆弧起始角度，3点钟方向为0，顺时针递增，小于0或大于360进行取余 -->
    <attr name="startAngle" format="float" />
    <!-- 圆弧度数 -->
    <attr name="sweepAngle" format="float" />
    <!-- 设置动画时间 -->
    <attr name="animTime" format="integer" />
    <!-- 绘制内容的数值 -->
    <attr name="maxValue" format="float" />
    <attr name="value" format="float" />
    <!-- 绘制内容的单位 -->
    <attr name="unit" format="string|reference" />
    <attr name="unitSize" format="dimension" />
    <attr name="unitColor" format="color|reference" />
    <!-- 绘制内容相应的提示语 -->
    <attr name="hint" format="string|reference" />
    <attr name="hintSize" format="dimension" />
    <attr name="hintColor" format="color|reference" />
    <!-- 精度，默认为0 -->
    <attr name="precision" format="integer" />
    <attr name="valueSize" format="dimension" />
    <attr name="valueColor" format="color|reference" />
    <!-- 背景圆弧颜色，默认白色 -->
    <attr name="bgArcColor" format="color|reference" />
    <!-- 圆弧宽度 -->
    <attr name="arcWidth" format="dimension" />
    <!-- 圆弧颜色， -->
    <attr name="arcColors" format="color|reference" />
    <!-- 文字的偏移量 相对于圆半径而言，默认三分之一 -->
    <attr name="textOffsetPercentInRadius" format="float" />
    <!-- 背景圆弧宽度 -->
    <attr name="bgArcWidth" format="dimension" />
    <!-- 线条数 -->
    <attr