Processing利用基本圖形制作簡單動圖

效果圖：

需要用到外部的gifAnimation庫,用於導出gif文件，下載好gifAnimation庫之后將其解壓到速寫本所在目錄下的libraries下，如圖：

之后重啟我們的Processing，在我們菜單欄速寫本中出現GifAnimation

下面直接使用即可，代碼如下：

import gifAnimation.*;
GifMaker gif;

float minScale = 0.5; //單個圓最小放大倍數
float maxScale = 4;	//最大放大倍數
float currentScale = 1;//當前圖形放大倍數

void setup() {
    size(500,500); //畫布大小
    noFill(); //不要填充顏色
    strokeWeight(0.5);//邊框粗細
    stroke(250,6,8);//線條顏色，我隨便調的
    setup_(); //運行我們生產gif部分的代碼
} 
 void draw() {
    background(255); //繪制圖案的背景
    translate(100,100);
   
    for(int y = 0;y <= 300; y += 30){
      for(int x = 0; x <= 300; x += 30){
        
        pushMatrix();
        translate(x,y);
        rectMode(CENTER);
        rotate(radians(frameCount));
        currentScale = map(sin((frameCount + (x-y))/60.0),-1,1,minScale,maxScale);
        scale(currentScale);
        ellipse(15,15,10,10);
        popMatrix();
      }
    }
    draw_();
    
} 
void setup_(){
  gif = new GifMaker(this,"gif.gif");
  gif.setRepeat(0);//設置gif重復播放的次數，0為循環播放
  gif.setDelay(40);//設置幀與幀之間的延遲時間，單位為毫秒，數值為40 幀率為25
}
void draw_(){
  if(frameCount % 5 == 0){
    gif.addFrame();//當前幀寫入gif內
  }
  if(frameCount == 185)
  gif.finish();
}
void mousePressed(){
  gif.finish();//點擊鼠標導出gif
}

 

點擊運行，得到如下結果：

點擊一下，在我們的processing文件下找到生成的gif圖片