Android 自定义View、ViewGroup 实战训练之CircleProgress

项目中很多时候时候会用到圆形的进度条，Android系统自带的不太好看，通常我们都会去自定义它，今天我们来介绍一下自定义控件以及自定义属性的使用。

先来看一下自定义CircleProgress的代码，如果你看着太吃力，请先阅读一下《Android 自定义View、ViewGroup(一)之工作原理》

public class CircleProgress extends View {

    public static final int STROKE = 0;
    public static final int FILL = 1;

    private Paint paint;

    private int circleColor;
    private int progressColor;
    private int textColor;
    private float textSize;
    private float circleWidth;
    private int circleMax;
    private boolean textIsDisplay;
    private int style;

    /**
     * 当前进度
     */
    private int progress;

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

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

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

        paint = new Paint();
        TypedArray mTypedArray = context.obtainStyledAttributes(attrs, R.styleable.CircleProgressBar);
        //获取自定义属性和默认值
        circleColor = mTypedArray.getColor(R.styleable.CircleProgressBar_circle_color, Color.RED);
        progressColor = mTypedArray.getColor(R.styleable.CircleProgressBar_circle_progress_color, Color.GREEN);
        textColor = mTypedArray.getColor(R.styleable.CircleProgressBar_text_color, Color.GREEN);
        textSize = mTypedArray.getDimension(R.styleable.CircleProgressBar_text_size, 15);
        circleWidth = mTypedArray.getDimension(R.styleable.CircleProgressBar_circle_width, 5);
        circleMax = mTypedArray.getInteger(R.styleable.CircleProgressBar_circle_max, 100);
        textIsDisplay = mTypedArray.getBoolean(R.styleable.CircleProgressBar_is_text_display, true);
        style = mTypedArray.getInt(R.styleable.CircleProgressBar_style, 0);

        mTypedArray.recycle();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        //1.画出最外层的大圆环
        int center = getWidth()/2;
        int radius = (int) (center-circleWidth/2);
        paint.setColor(circleColor); //设置圆环的颜色
        paint.setStyle(Paint.Style.STROKE); //设置空心
        paint.setStrokeWidth(circleWidth); //设置圆环的宽度
        paint.setAntiAlias(true); //消除锯齿
        canvas.drawCircle(center, center, radius, paint);

        //2.画百分比
        paint.setStrokeWidth(0);
        paint.setColor(textColor);
        paint.setTextSize(textSize);
        paint.setTypeface(Typeface.DEFAULT_BOLD);
        int percent = (int) (((float) progress / (float) circleMax) * 100);
        float textWidth = paint.measureText(percent + "%");
        if (isTextIsDisplay() && percent != 0 && style == STROKE) {
            canvas.drawText(percent + "%", center - textWidth / 2, center + textSize / 2, paint);
        }

        //3.画进度
        paint.setStrokeWidth(circleWidth);
        paint.setColor(progressColor);
        //用于定义的圆弧的形状和大小的界限
        RectF oval = new RectF(center - radius, center - radius, center + radius, center + radius);

        switch (style) {
            case STROKE: {
                paint.setStyle(Paint.Style.STROKE);
                canvas.drawArc(oval, 0, 360 * progress / circleMax, false, paint);
                break;
            }
            case FILL: {
                paint.setStyle(Paint.Style.FILL_AND_STROKE);
                if (progress != 0)
                    canvas.drawArc(oval, 0, 360 * progress / circleMax, true, paint);
                break;
            }
        }
    }



    /**
     * 设置进度
     * @param progress
     */
    public synchronized void setProgress(int progress){
        if(progress < 0){
            throw new IllegalArgumentException("progress not less than 0");
        }
        if(progress > circleMax){
            progress = circleMax;
        }
        if(progress <= circleMax){
            this.progress = progress;
            postInvalidate();
        }
    }

    /**
     * 获取进度
     * @return
     */
    public synchronized int getProgress(){
        return progress;
    }

    public synchronized int getCircleMax() {
        return circleMax;
    }

    public synchronized void setCircleMax(int circleMax) {
        if (circleMax < 0) {
            throw new IllegalArgumentException("max not less than 0");
        }
        this.circleMax = circleMax;
    }



    public int getCircleColor() {
        return circleColor;
    }

    public void setCircleColor(int circleColor) {
        this.circleColor = circleColor;
    }

    public int getProgressColor() {
        return progressColor;
    }

    public void setProgressColor(int progressColor) {
        this.progressColor = progressColor;
    }

    public int getTextColor() {
        return textColor;
    }

    public void setTextColor(int textColor) {
        this.textColor = textColor;
    }

    public float getTextSize() {
        return textSize;
    }

    public void setTextSize(float textSize) {
        this.textSize = textSize;
    }

    public float getCircleWidth() {
        return circleWidth;
    }

    public void setCircleWidth(float circleWidth) {
        this.circleWidth = circleWidth;
    }

    public boolean isTextIsDisplay() {
        return textIsDisplay;
    }

    public void setTextIsDisplay(boolean textIsDisplay) {
        this.textIsDisplay = textIsDisplay;
    }

    public int getStyle() {
        return style;
    }

    public void setStyle(int style) {
        this.style = style;
    }
}

1. 定义类继承View重写构造方法并初始化画笔Paint

2. 根据Context的obtainStyledAttributes方法获取属性集，并获取自定义属性和默认值

3. 对外暴露get、set方法，让外部可以设置和获取指定值

4.重写onDraw方法画出大圆环、百分比和进度

如果想了解更多自定义进度条，请点击

下载Demo请猛戳  AndroidStudio版

下载Demo请猛戳 Eclipse版