如何使用View的子项制作绘制动画,逐个绘制每条路径的线?

使用我在中找到的代码 this StackOverflow answer 我成功地用手指在画布上画出了任何东西,在画的时候我会看到我画的是什么。由此,我想制作一个在按下按钮时触发的功能,它可以做两件事:

1. 擦除画布上绘制的内容。
2. 在画布被清除之前,通过以恒定的速度一条接一条地重新绘制每条路径的线,回放在其上绘制的任何图片。

为了做到这一点,我对 onTouchEvent 代码,因此它相应地存储每个绘制的点:

@Override
public boolean onTouchEvent(MotionEvent event) {
    StrokePoint point;

    switch (event.getAction()){
        case MotionEvent.ACTION_DOWN:
            mPath.moveTo(event.getX(), event.getY());

            // Retrieve strokes in memory
            stroke_buffer = new Stroke();
            stroke_buffer.points = new ArrayList<StrokePoint>();
            point = new StrokePoint();
            point.x = event.getX();
            point.y = event.getY();
            stroke_buffer.points.add( point );

            break;
        case MotionEvent.ACTION_MOVE:
            mPath.lineTo(event.getX(), event.getY());

            // Retrieve strokes in memory
            point = new StrokePoint();
            point.x = event.getX();
            point.y = event.getY();
            stroke_buffer.points.add( point );

            invalidate();
            break;
        case MotionEvent.ACTION_UP:
            // Retrieve strokes in memory
            strokes.add(stroke_buffer);
            break;
        default:
            break;
    }
    return true;
}

这样,我可以稍后在循环中加载X点和Y点(至少这是我的想法)。问题是我不知道如何在画布上触发每一行的“重绘”。我试着像这样存储“onDraw”中的画布:

@Override
protected void onDraw(Canvas canvas) {
    canvas.drawPath(mPath, mPaint);

    // For trying to make the "redraw" later
    this.mCanvas = canvas;

    super.onDraw(canvas);
}

然后,我为我想擦除并回放之前绘制的笔划的按钮制作了这种方法:

public void replayStrokes() {
    // I start a new path from scratch ad-hoc the "redraw" animation.
    mPath = new Path();
    Log.i("SANDBOX_INFO", "Button pressed");
    // Intention here is leaving the "whiteboard" clear again.
    mCanvas.drawRGB(255, 255, 255);
    invalidate();
    this.draw(mCanvas);
    SystemClock.sleep(1000);

    // Redraw "line by line" loop
    mPath.moveTo(strokes.get(0).points.get(0).x,
                 strokes.get(0).points.get(0).y);
    for (int i = 0; i < strokes.size(); i++) {
        for (int j = 0; j < strokes.get(i).points.size(); j++) {
            if (i == 0 && j == 0) continue;
            mPath.lineTo(strokes.get(i).points.get(j).x,
                         strokes.get(i).points.get(j).y);
            mCanvas.drawPath(mPath, mPaint);
            invalidate();
            this.draw(mCanvas);
            SystemClock.sleep(100);
        }
    }
}

当我按下按钮时,方法 replayStrokes 行为不如预期。这就像它仍然在“思考”(处理),在你最意想不到的时候,它会在一次打击中刷新所有的变化;相反,我希望它是一个平滑的动画,在那里你可以看到以前用手指绘制的整个路径,逐行,逐点回放。我做错了什么?我应该改变什么来获得预期的行为?