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版