【Processing】 이라레에서 만든 벚꽃을 페이드 시키면서 빙글빙글 보았다.

개요



illustrator에서 만든 꽃잎이 ...



이런 식으로 움직입니다.

코드



sketch.pde
int Length = 20; //生成する桜の数

Sakura sakura[] = new Sakura[Length];
PShape petal;

int t = 0;
float alpha = 0; //透明度
boolean fadeIn = true; //trueの時はフェードイン、falseの時フェードアウト

void setup() {
  size(1200, 800);
  petal = loadShape("桜.svg"); //桜の花びらのsvg画像
  petal.disableStyle();
  background(0);
  colorMode(HSB, 100);
  frameRate(60);
  noStroke();

  for (int i = 0; i < Length; i++) {
    sakura[i] = new Sakura( 
      int(random(width)), int(random(height)), 
      int(random(90)), 
      random(0.2, 1.2));
  }
}

void draw() { 
  background(0);
  for (int i = 0; i < Length; i++) {
    sakura[i].bloom();

    if (alpha <= -8) {
      sakura[i].x = int(random(width));
      sakura[i].y = int(random(height));
    }
  }
  t++;
}

Sakura.pde
public class Sakura {

  int x, y;
  int s; //彩度
  float scale; //桜の大きさ

  Sakura(int _x, int _y, int _s, float _scale) {
    x = _x;
    y = _y;
    s = _s;
    scale = _scale;
  }

  private void flower() {  //花びらをループさせて桜に
    for (int i = 0; i <= 4; i++) {
      pushMatrix();
      rotate(PI*2*i/5);     
      shape(petal, 0, -petal.height/2);      
      popMatrix();
    }
  }

  public void bloom() {  
    if (fadeIn) {
      if (alpha < 115) {
        fill(90, s, 60, alpha+=0.05);
      } else {
        fadeIn = false;
      }
    } else {
      if (alpha > -10) {
        fill(90, s, 60, alpha-=0.035);
      } else {
        fadeIn = true;
      }
    }
    shapeMode(CENTER);
    pushMatrix();
    translate(x++, y++);
    scale(scale);
    pushMatrix();
    rotate(PI*t/180);
    flower();
    popMatrix();    
    popMatrix();
  }
}

실제로 사용한 SVG 파일



벚꽃.svg(Google Drive)

illustrator로 만든 벡터 이미지를 SVG로 내보내고 있습니다.

좋은 웹페이지 즐겨찾기