MIDIコントローラーでProcessingをコントロールする

今回はMIDIコントローラーでProcessingの値を操作する方法をメモします。
※MIDIとは音楽に特化した通信プロトコルの事です。もう30年ほど続く世界共通規格です。
知ってる人多いかな。

KORGのpadKONTROLというハードウェアMIDIコントローラーとProcessingのMIDIライブラリ「MidiBus」を使用します。
padKONTROLは古いコントローラーで中古で5,000円ぐらいで買えちゃう。

前回記事にしたVScodeでやっていきます。
ProcessingをVisual Studio Codeで動かしたい

1.MIDIライブラリ「MidiBus」の導入

・ライブラリは公式IDEより行います。
　まずは「ツールを追加」を選択。

Librariesタグより「MidiBus」をインストールしましょう。

2.MIDIデバイスの特定

・次にコードを以下の様に記述。

korgtest.pde

    import themidibus.*;

    // MidiBusインスタンス
    MidiBus myBus;

    void setup() {
        size(300, 300);
        background(255);
        //MIDIデバイスのリストを表示
        MidiBus.list();
        myBus = new MidiBus(this, 0, 0);
    }

    void draw(){
    }

これで一度実行します。（Ctrl+Shift+Bでビルドタスクを実行【前の記事参考】）
するとPCに接続されたMIDIデバイスの一覧がコンソール上に表示されます。
INPUT、OUTPUTからそれぞれ使用するコントローラーのデバイスNoを見つけます。

今回のpadKONTROLは2がinputとなるので以下の様に編集します。（今回outputは使わないのですが一応追加）

korgtest.pde

   //第２引数にinput,第３引数にoutputのデバイスNoを指定
   myBus = new MidiBus(this, 2, 5);    

3.図形の描画とcontrollerChange関数実装

・図形の描画とMidiBusライブラリの関数controllerChangeを実装しましょう。

korgtest.pde

import themidibus.*;

MidiBus myBus;    // MidiBusインスタンス

void setup() {
    size(300, 300);    //ウインドウのサイズ
    background(255);   //ウインドウ背景の色

    MidiBus.list();                     //MIDIデバイスのリストを表示
    myBus = new MidiBus(this, 2, 5);    //MIDIデバイスのinput,outputを指定
}

float x = 150;    //図形の基準位置x
float y = 150;    //図形の基準位置y
int r = 180;      //図形の半径

void draw(){       
    background(255);        //背景塗りつぶし（図形を削除する目的）
    stroke(0, 0, 0);        //図形の描画線に色を付ける
    ellipse(x, y, r, r);    //円の描画（x座標, y座標, 幅, 高さ）
}

void controllerChange(int channel, int number, int value){

    if(number == 20){      
      x = map(value,0,127,0,width);
    }else{
      y = map(value,0,127,0,width);
    }

    //動かしたコントロールの値を表示
    println("channel:" + channel + " number:" + number +" value:"+ value);
}

解説

1.controllerChange関数はコントロールの値が変更された時に働きます。(字のまんま)
2.動かしているツマミの値を知る為にprintlnで表示してコントロールの情報を調べましょう。（今回の例では20と21を使います）
3.コードは「動かされたコントロールのNumber値により図形の描画位置を変更する」事を行っています。
4.map関数は【valueの範囲「0～127」を「0～width(ウインドウ幅いっぱい)」に変換】しています。

割り当てられたpadKontrolのコントロール値（number）

4.Processingを実行する

ではProcessingを実行してMIDIコントロールを操作してみましょう。
↓実際に動かしているgif動画です。

---

なかなか簡単にMIDIを扱えましたね。
元々はminimライブラリで音楽とProcessingを同期させる事を楽しんでいたのですが、
「自分でもリアルタイムに動かしたいな」という事でMidiBusライブラリの存在に気付いた次第です。

やってる事ってコントローラーの値を図形の要素（今回は図形の位置）に割り当ててるだけですが、
応用してVJとか色々な事が出来そうですね。