實現效果如下：

主要步驟如下幾步：

1.記載自定義屬性的值：

public CircleProgressBar(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
paint = new Paint();
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.progressCircleBar);
roundColor = typedArray.getColor(R.styleable.progressCircleBar_roundColor
 
, Color.WHITE);
roundProgressColor = typedArray.getColor(R.styleable.progressCircleBar_roundProgressColrc, Color.RED);
textColor = typedArray.getColor(R.styleable.progressCircleBar_textColcr, Color.BLACK);
textSize = typedArray.getDimension(R.styleable.progressCircleBar_circletextSize, 0);
roundwitdth 
 
= typedArray.getDimension(R.styleable.progressCircleBar_roundWidth, 0);
max = typedArray.getInteger(R.styleable.progressCircleBar_max, 0);
textisDiaplayAble = typedArray.getBoolean(R.styleable.progressCircleBar_textIsDisplayable, true);
style = typedArray.getInt(R.styleable.progressCircleBar_style, 0);
 
typedArray.recycle();
}

<declare-styleable name="progressCircleBar">
    <attr name="roundColor" format="color"></attr>
    <attr name="roundProgressColrc" format="color"></attr>
    <attr name="roundWidth" format="dimension"></attr>
    <attr name="textColcr" format="color"></attr>
    <attr name="circletextSize" format="dimension"></attr>
    <attr name="max" format="integer"></attr>
    <attr name="textIsDisplayable" format="boolean"></attr>
    <attr name="style">
        <enum name="STROKE" value="0"></enum>
        <enum name="FILL" value="1"></enum>
    </attr>
</declare-styleable>

2.通過呼叫view自身的  postInvalidate(); 方法設定進度比不斷重複外圈進度。

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    int centre = getWidth() / 2;
    int radius = (int) (centre - roundwitdth / 2); //圓環的半徑
paint.setColor(roundColor);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(roundwitdth);
paint.setAntiAlias(true);//消除鋸齒
canvas.drawCircle(centre,centre,radius,paint);
/**
     * 畫進度百分比
     */
paint.setStrokeWidth(0);
paint.setColor(textColor);
paint.setTextSize(textSize);
paint.setTypeface(Typeface.DEFAULT_BOLD); //設定字型
int percent = (int)(((float)progress / (float)100) * 100);  //中間的進度百分比，先轉換成float在進行除法運算，不然都為0
float textWidth = paint.measureText(percent + "%");   //測量字型寬度，我們需要根據字型的寬度設定在圓環中間
if(textisDiaplayAble && percent != 0 && style == STROKE){
        canvas.drawText(percent + "%", centre - textWidth / 2, centre + textSize/2, paint); //畫出進度百分比
}else{
    }

    /**
     * 畫圓弧 ，畫圓環的進度
     */
//設定進度是實心還是空心
paint.setStrokeWidth(roundwitdth); //設定圓環的寬度
paint.setColor(roundProgressColor);  //設定進度的顏色
RectF oval = new RectF(centre - radius, centre - radius, centre
            + radius, centre + radius);  //用於定義的圓弧的形狀和大小的界限
switch (style) {
        case STROKE:{
            paint.setStyle(Paint.Style.STROKE);
canvas.drawArc(oval, 0, 360 * progress / 100, false, paint);  //根據進度畫圓弧
break;
}
        case FILL:{
            paint.setStyle(Paint.Style.FILL_AND_STROKE);
            if(progress !=0)
                canvas.drawArc(oval, 0, 360 * progress / 100, true, paint);  //根據進度畫圓弧
break;
}
    }

}

3.佈局檔案呼叫：

<com.example.gw.customview.CircleProgressBar
android:id="@+id/progressbar"
android:layout_gravity="center"
android:layout_width="120dp"
android:layout_height="120dp"
attrs_ViewDemo:roundWidth="8dp"
attrs_ViewDemo:style="STROKE"
attrs_ViewDemo:max="80"
attrs_ViewDemo:roundProgressColrc="#ADFF2F"
attrs_ViewDemo:circletextSize="18sp"
attrs_ViewDemo:textIsDisplayable="true"
attrs_ViewDemo:roundColor="#fff" />

原始碼下載