自定義餅狀ProgressBar

最近有個項目要使用到餅狀進度條:
餅狀progressBar
我上百度也沒有找到合適的(也許是我找的方式不對),所以就打算自定義一個,這個自定義控件的思路很簡單,先繪製中心圓,然後繪製外圍圓環,最後繪製扇形進度,所以也沒有什麼好講的直接上代碼吧。

Java代碼如下:

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;

/** 自定義餅狀進度條
 * Created by chen on 2018/8/3.
 */
public class PieProgressBar extends View {

    //畫筆
    private Paint paint;

    //中心圓的顏色
    private int roundColor;

    //餅狀進度的顏色
    private int pieColor;

    //進度,初始值爲0
    private int progress = 0;

    //最大進度
    private int maxProgress;

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

    public PieProgressBar(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public PieProgressBar(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        paint = new Paint();

        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.PieProgressBar);
        roundColor = typedArray.getColor(R.styleable.PieProgressBar_roundColor,
                Color.parseColor("#ffffff"));
        pieColor = typedArray.getColor(R.styleable.PieProgressBar_pieColor,
                Color.parseColor("#FD9748"));
        maxProgress = typedArray.getInt(R.styleable.PieProgressBar_maxProgress, 100);
        typedArray.recycle();
    }

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

        //整個控件的半徑
        float radius = (float)(getWidth() / 2);

        //餅狀進度的半徑
        float pieRadius = radius - radius / 6 ;

        //繪製中心圓
        paint.setStyle(Paint.Style.FILL);   //設置是否填充
        paint.setColor(roundColor);  //設置畫筆顏色
        paint.setAntiAlias(true);  //設置是否消除鋸齒
        canvas.drawCircle(radius, radius, pieRadius, paint);

        //繪製外層圓環
        paint.setColor(pieColor);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(radius / 6);
        canvas.drawCircle(radius, radius, pieRadius, paint);

        //繪製扇形進度
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(pieColor);
        RectF rectF = new RectF(radius - pieRadius, radius - pieRadius,
                radius + pieRadius, radius + pieRadius);
        canvas.drawArc(rectF, -90, 360 * progress / maxProgress,
                true, paint);
    }

    public void setMaxProgress(int maxProgress) {
        if (maxProgress > 0) {
            this.maxProgress = maxProgress;
        }
    }

    public int getMaxProgress() {
        return maxProgress;
    }

    public void setProgress(int progress) {
        if (progress > maxProgress) {
            progress = maxProgress;
        }

        if (progress < 0) {
            progress = 0;
        }

        this.progress = progress;
        invalidate();
    }

    public int getProgress() {
        return progress;
    }
}

運行效果:
這裏寫圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章