Android SweepGradient和绘制线条呈圆形

Question

我正在尝试使用渐变间隔UI效果实现此循环进度条

目前我已经能够实现这一目标。

我当前实现的代码如下。

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.ColorFilter;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PixelFormat;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.Shader;
import android.graphics.SweepGradient;
import android.graphics.drawable.AnimationDrawable;
import android.support.annotation.IntRange;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;


public class CBPDrawable extends AnimationDrawable {


    Paint paint = new Paint();

    RectF clip = new RectF();

    LinearGradient shader;

    Path path;

    private static final int MAX = 360;


    int dots  = 75;

    int dotRadius = 20;

    RectF dotRect;


    Context mContext;
    public CBPDrawable(Context context){

        mContext = context;
    }

    Shader gradient;

    private int mTickOffset = 0;
    private int mTickLength = 15;
    private int mArcRadius = 10;

    double slope, startTickX, startTickY, endTickX, endTickY, midTickX, midTickY, thetaInRadians;
    double radiusOffset = mArcRadius + mTickOffset;


    @Override
    protected void onBoundsChange(Rect bounds) {
        super.onBoundsChange(bounds);

        path = new Path();

        dotRect = new RectF(0, 0, dotRadius, dotRadius);
/*

        for (int i = 0; i < dots; ++i) {
            start();

            path.addRoundRect(dotRect, dotRadius, dotRadius, Path.Direction.CCW);

            stop();
        }
*/


        for (int i = 360; i >= 0; i -= 5) {

            thetaInRadians = Math.toRadians(360 - i);
            slope = Math.tan(thetaInRadians);
            startTickX = (radiusOffset * Math.cos(thetaInRadians));
            startTickY = slope * startTickX;
            endTickX = startTickX + ((mTickLength) * Math.cos(thetaInRadians));
            endTickY = slope * endTickX;

            RectF r = new RectF();
            r.set((float) startTickX, (float) startTickY, (float) endTickX, (float) endTickY);

            path.addRoundRect(r, (int)radiusOffset, (int)radiusOffset, Path.Direction.CCW);

        }
    }

    @Override
    public void draw(@NonNull Canvas canvas) {


        Rect b = getBounds();

        final int width = canvas.getWidth();
        final int height = canvas.getHeight();
        final int squareSide = Math.min(width, height);
        canvas.translate(width / 2f, height / 2f); // moving to the center of the View
        canvas.rotate(270);

        final float outerRadius = squareSide / 2f;
        final float innerRadius = outerRadius - dotRadius;

        final float angleFactor = 360f / 72;

        int[] colors = new int[]{Color.BLUE, Color.RED};
        float[] positions = new float[]{0,0.4f};
        gradient = new SweepGradient(outerRadius / 2f, outerRadius / 2f,colors,null);

        for (int i = 0; i < 72; ++i) {

            canvas.save(); // creating a "checkpoint"
            canvas.rotate(angleFactor * i);
            canvas.translate(innerRadius, 0); //moving to the edge of the big circle

            clip.set(b);
            paint.setColor(Color.GRAY);

            if(angleFactor * i <= 200){
                paint.setShader(gradient);
            }else{
                paint.setShader(null);
            }

            //canvas.clipRect(clip,  Region.Op.REPLACE);


            canvas.drawPath(path, paint);

            canvas.restore(); //restoring a "checkpoint"

            //stop();
        }
    }

    @Override
    public void setAlpha(@IntRange(from = 0, to = 255) int i) {

    }

    @Override
    public void setColorFilter(@Nullable ColorFilter colorFilter) {

    }

    @Override
    public int getOpacity() {
        return PixelFormat.OPAQUE;
    }
}

从2张图片中可以看出，我无法将间隔正确地作为矩形或线条。

并且，尽管使用了SweepGradient，但渐变并未显示。

我应该如何实现预期效果？

感谢。