☓☓

主にプログラミングでハマったこととその解決策を覚え書き

Processingで音楽にあわせてアニメーション

Processingを使って何か作ってみたいなーということで、
メロディーに合わせてリアルタイムにグラデーションの円を描画するプログラムを作ってみました。

このプログラムでやりたかった処理は以下3つです。
1.音楽ファイルを再生
2.音楽をFFT
3.グラデーションのかかった円を描画


ソースコードは以下のとおりになりました。

import ddf.minim.analysis.*;
import ddf.minim.*;

//1.音楽ファイル再生関係
Minim minim;
AudioPlayer player;

//2.FFT関係
FFT fft;

void setup() {
  size(800, 600);
  colorMode(HSB, 360, 100, 100, 100);
  noStroke();
  smooth(); 

//1.音楽ファイル再生関係
  minim = new Minim(this);
  player = minim.loadFile("music.mp3", 512);

//2.FFT関係
  fft = new FFT(player.bufferSize(), player.sampleRate());

//ここで音楽再生
  player.play();
}

void draw() {
  background(#FFFFFF);

  int offset1 = 8;
  int offset2 = 150;
  int specSize = fft.specSize();

//3.左チャンネルに応じてグラデーションの円を描画
  fft.forward(player.left);
  for (int i = 0; i < specSize; i++) {
  float h = map(i, 0, specSize, 0, 360);
  int e_width = (int)((int)fft.getBand(i) * (h/offset1));
  if (0 <= h && h <= 360 && e_width >= 10) {
    int x = (int)random(0, 800);
    for (int w = e_width; w > 0; w -= 2) {
      fill(h, w-1 * 100 / e_width, 100, 50);
      ellipse(x, h+offset2, w, w);
    }
  }
}

//3.右チャンネルに応じてグラデーションの円を描画
fft.forward(player.right);
  specSize = fft.specSize();
  for (int i = 0; i < specSize; i++) {
    float h = map(i, 0, specSize, 0, 360);
    int e_width = (int)((int)fft.getBand(i) * (h/offset1));

    if (0 <= h && h <= 360 && e_width >= 10) {
      int x = (int)random(0, 800);
      for (int w = e_width; w > 0; w -= 2) {
        fill(h, 100 - w * 100 / e_width, 100, 50);
        ellipse(x, h+offset2, w, w);
      }
    }
  }
}

void stop() {
  player.close();
  minim.stop();
  super.stop();
}

プログラムの実行結果で出てくるアニメーションをキャプチャしたのが以下の画像です。
f:id:tasoco:20150403092527p:plain