下面有效果圖，本人也是在網上搜集進度條之後修改而成，不喜勿噴！

先上效果圖

public class TasksCompletedView2 extends View {


// 畫最外邊圓環的畫筆
private Paint mCirclePaint;
// 畫圓環的畫筆
private Paint mRingPaint;
//矩形畫筆
private Paint mRectPaint;
// 圓環顏色
private int mRingColor;
// 半徑
private float mRadius;
// 圓環半徑
private float mRingRadius;
// 圓環寬度
private float mStrokeWidth;
// 矩形寬度
private float rectWidth;
// 圓心x座標
private int mXCenter;
// 圓心y座標
private int mYCenter;
// 總進度
private int mTotalProgress = 100;
// 當前進度
private int mProgress;
// 最外層圓的寬度
private int mcircleWidth = 6;



public TasksCompletedView2(Context context, AttributeSet attrs) {
super(context, attrs);
// 獲取自定義的屬性
initAttrs(context, attrs);
initVariable();
}


private void initAttrs(Context context, AttributeSet attrs) {
TypedArray typeArray = context.getTheme().obtainStyledAttributes(attrs,
R.styleable.TasksCompletedView, 0, 0);
mRadius = typeArray.getDimension(R.styleable.TasksCompletedView_radius, 80);
mStrokeWidth = typeArray.getDimension(R.styleable.TasksCompletedView_strokeWidth, 10);
rectWidth = typeArray.getDimension(R.styleable.TasksCompletedView_myrectWidth, 15);
mRingColor = typeArray.getColor(R.styleable.TasksCompletedView_ringColor, 0xFFFFFFFF);

mRingRadius = mRadius + mStrokeWidth / 2 - mcircleWidth/2;
}


private void initVariable() {
//最外層圓形畫筆
mCirclePaint = new Paint();
mCirclePaint.setAntiAlias(true);
mCirclePaint.setColor(mRingColor);
mCirclePaint.setStyle(Paint.Style.STROKE);
mCirclePaint.setStrokeWidth(mcircleWidth);

//動態圓弧畫筆
mRingPaint = new Paint();
mRingPaint.setAntiAlias(true);
mRingPaint.setColor(mRingColor);
mRingPaint.setStyle(Paint.Style.STROKE);
//動態弧形的寬度
mRingPaint.setStrokeWidth(mStrokeWidth);

mRectPaint = new Paint();
mRectPaint.setAntiAlias(true);
mRectPaint.setColor(mRingColor);
mRectPaint.setStyle(Paint.Style.FILL);

}


@Override
protected void onDraw(Canvas canvas) {


mXCenter = getWidth() / 2;
mYCenter = getHeight() / 2;
//畫出最外層的圓
canvas.drawCircle(mXCenter, mYCenter, mRadius+mcircleWidth, mCirclePaint);
//畫出裡面的矩形
canvas.drawRect(mXCenter-rectWidth, mYCenter-rectWidth, mXCenter+rectWidth, mYCenter+rectWidth, mRectPaint);

//動態畫圓環
if (mProgress > 0 ) {
RectF oval = new RectF();
oval.left = (mXCenter - mRingRadius);
oval.top = (mYCenter - mRingRadius);
oval.right = mRingRadius * 2 + (mXCenter - mRingRadius);
oval.bottom = mRingRadius * 2 + (mYCenter - mRingRadius);
canvas.drawArc(oval, -90, ((float)mProgress / mTotalProgress) * 360, false, mRingPaint); //
}
}

public void setProgress(int progress) {
mProgress = progress;
postInvalidate();
}


}

在values下新建一個attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    
    <declare-styleable name="TasksCompletedView">
        <attr name="radius" format="dimension"/>
        <attr name="strokeWidth" format="dimension"/>
        <attr name="myrectWidth" format="dimension"/>
        <attr name="circleColor" format="color"/>
        <attr name="ringColor" format="color"/>
    </declare-styleable>
    
</resources>

這樣就完成了，如果要使用在layout中這樣就可

<com.snailws.taskscompleted.activity.TasksCompletedView2
        android:id="@+id/tasks_view"
        android:layout_width="55dp"
        android:layout_height="55dp"
        tc:radius="20dip"
        tc:strokeWidth="5dip"
        tc:myrectWidth="8dip"
        tc:ringColor="@color/ring_color" />

最後主要有一些自定義屬性沒有用，可以自行修改，本人技術太菜，專案趕進度所以匆匆記錄一下