如何在處理中創建「脈衝」效果？

Question

我正在試圖將我繪製到屏幕上的圖形上逐一顯示的點可視化。理想情況下，首先繪製一個小橢圓，然後從那裏，一個「環」從橢圓的中心向外移動，並在移動時消失。最初的橢圓將保留在最初繪製的地方。

我可以編碼一個簡單的衰落橢圓，但我無法弄清楚如何動畫移動環。 任何人都可以請分享一些關於如何開始使用它的想法？

Answer 1

基本上，您需要將動畫的狀態存儲在一組變量中。使用這些變量繪製每一幀，並隨時間改變這些變量以改變繪製的內容。

所以第一步是找出你需要存儲什麼狀態。這將告訴你需要跟蹤哪些變量。作爲一個非常簡單的例子，你可以存儲一定直徑的不透明度：

float diameter = 10; 
float opacity = 255; 

第二步就是用這些變量來繪製每一幀。一次只擔心一個框架，在這種情況下，我們可能只是清除舊的框架，然後畫一個圓：

background(0); 
noFill(); 
stroke(255, 255, 255, opacity); 
ellipse(width/2, height/2, diameter, diameter); 

最後，最後一步是隨時間而變化的變量。我們可以做到這一點通過修改它們的值，使圈變得越來越大，顏色就變得不那麼不透明：

diameter++; 
opacity--; 

全部放在一起，它看起來像這樣：

float diameter = 10; 
float opacity = 255; 

void setup(){ 
    size(500, 500); 
} 

void draw(){ 
diameter++; 
opacity--; 

background(0); 
noFill(); 
stroke(255, 255, 255, opacity); 
ellipse(width/2, height/2, diameter, diameter); 
} 

請注意，這僅僅是一個例子，你將不得不應用這些步驟與你自己的狀態和你自己的變量來達到你要去的效果。

堆棧溢出真的不是爲一般的「我該怎麼做」類型的問題而設計的。試着問一些更具體的「我試過X，期望Y，但是改爲Z」類型的問題。換句話說，嘗試一下，如果你遇到困難，請發帖MCVE。祝你好運。