ふとWindowSystemっぽいものを作ってみたくなってProcessingでゴリゴリと作ってみた。ソースコードはもう自分でも読みたくない。

機能としては、

• 複数のウィンドウを描画
• クリック、ドラッグでアクティベート
• ドラッグで移動
• 文字の入力、表示
• 消去ボタン
• ターゲットのポインティング、追跡

と、ウィンドウなら出来て当たり前のことばかりだけど、ゴリゴリ製作した身としては「機能なんだー！」と言ってしまいたい。

最後の「ターゲットのポインティング・追跡」機能はせっかくProcessingなんだから、ということで追加してみた。Processingで何か作った時にオブジェクトを追跡しながらステータス表示とか、そんな感じの賑やかし程度には使える気がする。

誰かもう作ってるだろう、と言うよりもっと便利なライブラリがあるような気がしてきたけど、それを目の当たりにすると心が折れそうなので今はまだ調べずにおく。

使い方はこんな感じで

WindowSystemと言いつつ、クラスの命名はTerminalだったりするのがまず分かりづらい。

グローバルにターミナルを管理するクラスTerminalManagerを作って、あとは適当な場所でTerminalを作ってTerminalManagerにガシガシ突っ込んでいく。

keyPressedイベントをTerminalManagerに渡してやれば、打ったキーはアクティブなTerminalに表示されるし、Terminalから直接print()メソッドを呼んで文字列を入力してもいいので、適当なオブジェクト内でTerminalを作れば上にも書いた通り簡易インスペクタとしても使える。

// ターミナルを管理するクラス
TerminalManager terminalManager;

// ターゲットとなる PVector
PVector target;

void setup() {
  
  size(480, 320);
  
  terminalManager  = new TerminalManager();

  target = new PVector(width/2, height/2);  
  
  // Terminal1
  Terminal terminal = new Terminal("Terminal1");
  terminal.setWindow(10, 10, 200, 200); // 場所とサイズ
  terminalManager.add(terminal); // マネージャに追加
  
  // Terminal2
  Terminal terminal2 = new Terminal("Terminal2");
  terminal2.setWindow(100, 100, 300, 300);
  terminal2.setLineNum(5); // heightを行数で上書き
  terminalManager.add(terminal2);
  
  // Terminal3: ターゲットを追跡する
  Terminal terminal3 = new Terminal("Terminal3");
  terminal3.setWindow(200, 50, 300, 200);
  terminal3.setTarget(target); // ターゲットをセット
  terminal3.setPositionRelatively(true); // ターゲットを追跡
  terminalManager.add(terminal3);
  
  // Terminal4: ターゲットをポイント
  Terminal terminal4 = new Terminal("Terminal4");
  terminal4.setWindow(200, 200, 200, 60);
  terminal4.setLineNum(10);
  terminal4.setTarget(target);
  terminalManager.add(terminal4);
}

void draw() {
  background(128);
  
  // ターゲットの移動
  target.x = width/2 + 100 * cos(0.01 * frameCount);
  target.y = height/2 + 100 * sin(0.01 * frameCount);

  // ターゲットの描画
  ellipse(target, 10);
  text("target", target.x + 5, target.y);
  
  // ウィンドウの更新・描画
  terminalManager.update();
  terminalManager.draw();
}

// 各種イベントを渡してやる
void keyPressed() { terminalManager.keyPressed(); }
void keyReleased() {}
void mouseMoved() { terminalManager.mouseMoved(); }
void mousePressed() { terminalManager.mousePressed(); }
void mouseReleased() { terminalManager.mouseReleased(); }
void mouseDragged() { terminalManager.mouseDragged(); }

そもそもGUIプログラミングしたこと無いのに一から作り始めるのはどうなんだろう。作っている最中は「だいたい思ったとおりの実装でいけるな」とか意気揚々としていたけど、使いやすさはどうせ既存の一般的なライブラリの方がいいんだろうな。

ソースコード:https://github.com/LightbulbCat/PTerm

• Mac OS X 10.9 Marverics
• Processing 2.0.3