處理 - 兩點之間的動畫

Question

我正在開發下面的代碼。爲了給你一個簡短的描述，它允許用戶點擊屏幕上的不同點，然後這些鼠標座標和位置存儲在一個數組中，也可以在屏幕上看到。當用戶單擊enter時，將使用線性插值技術從第一個點到最後一個點進行移動。由於PVector v正在存儲座標，因此我在for循環中遇到困難。任何人都可以請相應地引導我？

ArrayList vectors; 
PVector v = new PVector(); 
boolean animate = false; //declare a boolean variable you can use to switch from building points to animating the movement 
int FirstMouseClick; //declare an int variable to store the frameCount of the first mouseclick 
int AnimationStart; //declare an int variable to store the frameCount of the animation start 

void setup() 
{ 
    size(500, 500); 
    frameRate(60); 
    vectors = new ArrayList(); 
} 

void draw() 
{ 
    if(!animate)//if the boolean variable animate is true 
    { 
    float output = frameCount - AnimationStart; // subract the animation start frameCount from the current frameCount so you know which framecount from the vectors array you should be showing 
    for(int i=0; i<vectors.size(); i++) //loop through the vectors array 
    //until you find the (next PVector's frameCount - frameCount of first mouseClick) > above subtraction result 
    { 
     v = (PVector)vectors.get(frameCount); //until you find the (next PVector's frameCount) 

    } 
    ellipse(v.x,v.y,10,10);// use the current pvector's xpos and ypos to draw the ellipse 
    } 
} 

void mouseClicked() 
{ 
    frameCount = 0; //if not yet set, set the first frameCount value 
    vectors.add(new PVector(mouseX, mouseY,frameCount));// <--- store the framecount in the z axis 
    ellipse(mouseX,mouseY,10,10); 
    println("Mouse Coordinates are: " + vectors); 
} 

void keyPressed() 
{ 
    if(keyCode == ENTER) 
    { 
    animate = true; //set the boolean variable animate to true 
    AnimationStart = 3; //set the framecount of the animation start 
    } 
} 

Answer 1

我真的不知道，你想幹什麼，但是如果我把你的權利，你想要做這樣的事情：

• 繪製某些圈子裏，如果用戶點擊在畫布上
• 如果用戶按下回車鍵，開始動畫
• 動畫是指：另一個圓（ⅴ）從圓內移動線性來圈

我真的不知道，你的frameCount是。可能你現在可以更容易地將它添加到此代碼中嗎？請注意，即使動畫屬實，您也可以通過點擊鼠標來添加新目標。

你可以這樣做：你的幫助

ArrayList<PVector> vectors = new ArrayList(); 
PVector v = new PVector(); 
boolean animate = false; // true means, the circles moves 
int nextTarget = 0; // defines the index of the next circle, the point is going to 

void setup() 
{ 
    size(500, 500); 
    frameRate(60); 
    v = new PVector(width/2, height/2); 
} 

void draw() { 

    // draw background to delete old drawings 
    background(128); 

    // show all circles 
    for (int i=0; i<vectors.size(); i++) { 
    fill(255); 
    ellipse(vectors.get(i).x, vectors.get(i).y, 10, 10); 
    } 

    // if the boolean variable animate is true 
    if (animate) { 
    // compute angle to target circle and remaining distance 
    float diffX = vectors.get(nextTarget).x - v.x; 
    float diffY = vectors.get(nextTarget).y - v.y; 
    float angle = atan2(diffX, diffY); 

    // defines the speed of the circle 
    float movement = 2; 

    // compute new position of v 
    v = new PVector(v.x + sin(angle)*movement, v.y + cos(angle)*movement); 

    // if v reached the target circle, move on to the next one 
    if (dist(v.x, v.y, vectors.get(nextTarget).x, vectors.get(nextTarget).y) < 1 && nextTarget < vectors.size()-1) { 
     nextTarget++; 
    } 
    } 
    fill(0); 
    ellipse(v.x, v.y, 10, 10); // use the current pvector's xpos and ypos to draw the ellipse 
} 


void mouseClicked() 
{ 
    vectors.add(new PVector(mouseX, mouseY)); 
    ellipse(mouseX, mouseY, 10, 10); 
    println("Mouse Coordinates are: " + vectors); 
} 

// toggle animation mode 
void keyReleased() { 
    if (key == ENTER) { 
    animate = !animate; 
    println("animation: "+ animate); 
    } 
}