彩色进度条动画完成后整体重绘为单一颜色问题求助

我来帮你搞定这个彩色进度条的问题！

问题根源 #

你遇到的动画结束后进度条变成单一颜色的问题，核心原因在最后一段代码里：当所有分段动画完成后，你用当前barPart的画笔绘制了整个360度的圆弧，这直接覆盖了之前一步步画好的所有彩色分段，自然就变成单一颜色了。

// 这里就是问题所在：用最后一段的画笔绘制了整个圆弧
canvas.drawArc(mRect, mStartAngle, 360, false, barPart.mPaint);

修复方案 #

当动画完成所有分段后，我们不需要重绘整个圆弧，而是应该遍历所有BarPart，逐个绘制它们对应的完整分段，这样就能保留所有彩色部分了。

修改后的onDraw方法代码如下：

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    final BarPart barPart = mBarParts.get(mCurrentBarPartIndex);
    if (mAngle < barPart.mEndPoint) {
        if (mCurrentBarPartIndex > 0) {
            for (int i = 0; i < mCurrentBarPartIndex; i++) {
                final BarPart prevBarPart = mBarParts.get(i);
                canvas.drawArc(mRect, prevBarPart.mStartPoint, mBreakPointAngle, false, prevBarPart.mPaint);
            }
        }
        canvas.drawArc(mRect, barPart.mStartPoint, mAngle - barPart.mLimit, false, barPart.mPaint);
    } else {
        if (mCurrentBarPartIndex < mBarParts.size() - 1) {
            ++mCurrentBarPartIndex;
            draw(canvas);
        } else {
            // 遍历所有分段，逐个绘制完整的彩色部分
            for (BarPart completePart : mBarParts) {
                canvas.drawArc(mRect, completePart.mStartPoint, mBreakPointAngle, false, completePart.mPaint);
            }
            finishDrawing();
        }
    }
}

额外提示 #

• 确保finishDrawing()方法里没有触发额外的invalidate()调用，否则可能会再次触发重绘导致问题。
• 动画过程中，建议使用postInvalidate()或者invalidate()来触发每一步的重绘，保证动画流畅性。

内容的提问来源于stack exchange，提问作者Hilal