Processingでお絵描き入門その１（続き未定） - にたまごほうれん草アーカイブ

ちょっくらグラフィカルなプログラミングに挑戦したくなり（何度目だ…）、Processingなるものを知ったので試してみた。

まずは環境構築

試した環境はUbuntu 9.10。手順としては、

ダウンロードページから、自分の環境向けのものをダウンロード
展開してprocessingを実行
エディタが起動

で、開発＆実行する環境が整う。試してないけどWindowsなどの環境でもおそらくこれくらい簡単。残念なのは、コマンドラインから実行する術が準備されていないこと。これは、他の方法（後述）を使えばなんとかなるかもしれない。

サンプルを動かしてみる

起動したエディタの[File]->[Examples]から色々なサンプルを実行することができる。3Dのものとかを動かしてみてへーへーすげーとか言いながら学習意欲をかきたてるといいと思います。

コードをコピペして少しいじる

Getting Startedページにあるサンプルコードをとりあえずコピペ。そしてCtrl+Rで実行。おお、動いた！
単純にコピペするだけじゃなくて、とりあえず色がもっとぐりぐり動くよう以下のように修正。

int WIDTH=400;
int HEIGHT=400;

void setup()
{
    size(WIDTH,HEIGHT);
    stroke(255);
}

void draw()
{
    background(0,255*mouseX/WIDTH,255*mouseY/HEIGHT);
    line(WIDTH/2,HEIGHT/2,mouseX,mouseY);
}

ぎゃあ、目がチカチカする！

公開してみる

HTMLファイルを置く環境がある人は、Processing.jsを使うとHTMLファイル上でProcessingプログラムを動作させることができます。今回は手っ取り早く作成するために、HTML部分などはProcessing.jsで魚の群れシミュレーション - もやし日記のものを拝借しました。

作ったものはこちら

他にも、

ruby-processingなるものがあるらしい。

Getting Started - ruby-processing - GitHub

こちらは、Rubyの文法でProcessingを動作させるものみたいなので厳密には別になるのかな。

とりあえず、

エディタの編集しにくさは置いといて、それなりに書いて動かせるようになりたい。