安卓 : draw arc without resetting the previous drawn circle

Question

我正在尝试绘制一个代表时间的圆圈，在每个完整的圆圈之后，我想更改颜色以向用户指示下一个时间单位已经开始并绘制之前的圆圈颜色而不是如图所示重置在下面的示例中。

我正在尝试按以下方式使用 Draw Arc 方法绘制圆

canvas.drawArc(mRect, 270, sweepAngle, false, fgPaint);

扫描角度由 Object Animator 控制:

outerCircleAnimator = ObjectAnimator.ofFloat(timeView, TimeView.SET_SWEEPWANGLE, 0, 360);

通过下面的代码，我可以实现以下目标

以下是我的 View 类:

public class TimeView extends View {

final protected Paint bgPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
final protected Paint fgPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
final protected Paint textPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
private RectF mRect = new RectF();
private float sweepAngle;
private float radiusInDPI = 100;
private float radiusInPixels;
private float strokeWidthInDPI = 4;
private float stokeWidthInPixels;
private float dpi;
private int heightByTwo;
private int widthByTwo;

public TimeView(Context context) {
    super(context);
    init();
}

public TimeView(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();
}

public TimeView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    init();
}

@Override
public void onSizeChanged(int w, int h, int oldw, int oldh) {
    super.onSizeChanged(w, h, oldw, oldh);
    heightByTwo = h / 2;
    widthByTwo = w / 2;
    mRect = new RectF(w / 2 - radiusInPixels, h / 2 - radiusInPixels, w / 2 + radiusInPixels, h / 2 + radiusInPixels);
}

private void init() {
    DisplayMetrics metrics = getResources().getDisplayMetrics();
    dpi = metrics.density;
    radiusInPixels = dpi * radiusInDPI;
    stokeWidthInPixels = dpi * strokeWidthInDPI;
    bgPaint.setStrokeWidth(stokeWidthInPixels);
    bgPaint.setStyle(Paint.Style.STROKE);
    bgPaint.setColor(ContextCompat.getColor(getContext(), R.color.colorAccent));

    fgPaint.setStrokeWidth(stokeWidthInPixels);
    fgPaint.setStyle(Paint.Style.STROKE);
    fgPaint.setColor(ContextCompat.getColor(getContext(), R.color.colorPrimary));

    textPaint.setTextSize(24 * 3);
    textPaint.setStyle(Paint.Style.STROKE);
    textPaint.setColor(ContextCompat.getColor(getContext(), R.color.colorPrimary));


}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
   // canvas.drawCircle(widthByTwo, heightByTwo, radiusInPixels, bgPaint);
    canvas.drawArc(mRect, 270, sweepAngle, false, fgPaint);
}


public static final Property<TimeView, Float> SET_SWEEPWANGLE =
        new Property<TimeView, Float>(Float.class, "outerCircleRadiusProgress") {
            @Override
            public Float get(TimeView object) {
                return object.getSweepAngle();
            }

            @Override
            public void set(TimeView object, Float value) {
                object.setSweepAngle(value);
            }
        };

public float getSweepAngle() {
    return sweepAngle;
}

public void setSweepAngle(float sweepAngle) {
    Log.v("Testing", "Sweep angle is " + sweepAngle + " " + (sweepAngle + 270));
    this.sweepAngle = sweepAngle;
    postInvalidate();
}

public void setColor(boolean change) {
    if (change) {
        fgPaint.setColor(ContextCompat.getColor(getContext(), R.color.mint_green));
    } else {
        fgPaint.setColor(ContextCompat.getColor(getContext(), R.color.colorPrimary));
    }
}

Answer 1

onDraw 用于在空白 Canvas 上绘图。它总是从头开始。您需要保存最后一个 fgPaint 并且:

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    if (lastFgPaint != null) {
        canvas.drawArc(mRect, sweepAngle, 360, false, lastFgPaint);
    }
    canvas.drawArc(mRect, 270, sweepAngle, false, fgPaint);
}