本文介紹了如何使用View的子級制作繪圖動畫,逐條繪制每條路徑的線條?的處理方法,對大家解決問題具有一定的參考價值,需要的朋友們下面隨著小編來一起學習吧!
問題描述
使用我在this StackOverflow answer中找到的代碼,我可以成功地用手指在畫布上繪制任何東西,并且我將在繪制它的同時看到我畫的是什么。在此基礎上,我想創建一個在按下按鈕時觸發的函數,該函數將做兩件事:
-
擦除畫布上繪制的內容。
通過以恒定的速度逐條重新繪制每條路徑的線條,重播在清除畫布之前在其上繪制的任何圖片。
為此,我稍微修改了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
方法的行為不符合預期。這就像它仍然在思考和處理,當你最意想不到的時候,它會一下子刷新所有的變化;相反,我希望它是一個流暢的動畫,你可以看到以前用手指繪制的整個路徑,逐行、逐點地重播。我做錯了什么?我應該更改哪些內容才能獲得預期的行為?
推薦答案
多虧了@VitorHugoSchwaab的評論,我終于想出了一個解決方案。提醒一下:我在這個問題中發布的所有代碼都應該在public class DrawCanvas extends View
類中。也就是說:
因此,我將觸發器方法&Quot;保留如下:
private int s, p;
private boolean replay_mode;
public void replayStrokes() {
s = 0;
p = 0;
replay_mode = true;
invalidate();
}
我像這樣修改了onDraw
方法(我將其轉換為Megamoth,但我可以稍后修復:p):
@Override
protected void onDraw(Canvas canvas) {
if (replay_mode) {
if (s == 0 && p == 0) {
Log.i("SANDBOX_INFO", "Replay Mode START");
canvas.drawRGB(255, 255, 255);
p++;
replayPath.reset();
replayPath.moveTo(strokes.get(0).points.get(0).x,
strokes.get(0).points.get(0).y);
invalidate();
} else {
Log.i("SANDBOX_INFO", "Replaying --> S:" + s + " P:" + p);
if (p == 0) {
replayPath.moveTo(strokes.get(s).points.get(p).x,
strokes.get(s).points.get(p).y);
} else {
replayPath.lineTo(strokes.get(s).points.get(p).x,
strokes.get(s).points.get(p).y);
canvas.drawPath(replayPath, mPaint);
}
int points_size = strokes.get(s).points.size();
if (s == strokes.size() - 1 && p == points_size - 1) {
Log.i("SANDBOX_INFO", "Replay Mode END");
replay_mode = false;
}
else if (p == points_size - 1) {
s++;
p = 0;
} else {
p++;
}
}
invalidate();
} else {
canvas.drawPath(mPath, mPaint);
}
super.onDraw(canvas);
}
這是可行的。但是,在重播筆劃時,會出現閃爍的毛刺效果。我認為這可能是因為它實際上是在每一幀上重新繪制整個重放路徑。基于此猜測,當我有更多時間編寫代碼時,我將嘗試解決此問題。
這篇關于如何使用View的子級制作繪圖動畫,逐條繪制每條路徑的線條?的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,