週刊三軒茶屋 第41号 著作:たけい 公開日:2005/01/10

JAVAアプリケーションを作ってみよう(3)

今回は、JAVAアプリケーションの開発ツールである「Processing」の「Continuous Mode」で動きのあるアプリを作成します。「Processing」ってなに?って方はこちらを参照して下さい。また、「Continuous Mode」ってなに?って方はこちらを参照して下さい。

<座標系について>

Processingの座標系は、(x,y,z)の3次元構成となっていますが、まずは(x,y)の2次元座標として扱います。モード説明のときにディスプレイサイズを定義する方法を紹介しましたが、例えば

size(300,300);

で定義された座標系は、


となります。左上端が原点となり下方向が「X軸」、右方向が「Y軸」となります。

<動きのあるアプリ>

次は、上で定義した座標系で「円」を動かしてみます。円を表示させるための関数は、

// ellipse(x,y,r1,r2) (x,y)が中心座標。r1及びr2が長径・短径(r1=r2で円)
ellipse(150,150,5,5);

のようにellipse(x,y,r1,r2)を使用します。上の例では座標(150,150)の位置、つまりウィンドウの中心に半径5の円を表示します。

int x1,y1 ; // 物体1の座標
int x2,y2 ; // 物体2の座標

void setup(){
 size(200,200);
 background(200);

 x1 = 0 ; // 物体1の初期座標
 y1 = 100 ;

 x2 = 200 ; // 物体2の初期座標
 y2 = 100 ;
}

void loop(){
 background(200);
 ellipse(x1,y1,5,5);
 ellipse(x2,y2,5,5);

 if(x1==200) x1=0;
 else x1++;
 if(x2==0) x2=200;
 else x2--;
}

を実行すると、プログラムの行番通りに

 1.アプレットのディスプレイウィンドウのサイズを指定する。
 2.1で指定したウィンドウの背景色を決定する。
 3.物体1及び物体2の初期位置を設定する。

 ここまでがsetup()です。

 4.背景色を塗る。
 5.座標(x1,y1)に円を描く。
 6.座標(x2,y2)に円を描く。
 7.次の物体1及び物体2の位置を決定する。

4〜7の動作をloop()で繰り返します。つまり円(物体1)がウィンドウの中央を左から右へ移動します。また、円(物体2)がウィンドウの中央を右から左へ移動します。

実行結果はこちらから

<framerate()の使い方>

1秒間に表示されるフレームの数を設定します。例えば、framerate(10)とすると1秒間に10回(100[ms]毎)にウィンドウのリフレッシュが行なわれます。

void setup(){
 size(200,200);
 background(200);
 framerate(10);

 x1 = 0 ; // 物体1の初期座標
 y1 = 100 ;

 x2 = 200 ; // 物体2の初期座標
 y2 = 100 ;
}

実行結果を見てみましょう。左が、framerate(10)とした場合、右がframerate(40)とした場合です。

実行結果はこちらから

これを利用して表示速度を制御することが可能です。ただし、CPUの性能が低い場合、決定したレートで表示されない(できない)そうです。

<delay()の使い方>

プログラムを設定時間の間だけ強制停止します。停止時間は1[ms]単位で指定します。例えば、delay(100)とした場合は、プログラムを100[ms]間停止します。

void loop(){
 background(200);
 ellipse(x1,y1,5,5);
 ellipse(x1,y1,5,5);

 if(x1==200) x1=0;
 else x1++;
 if(x2==0) x2=200;
 else x2--;

 delay(100) ;
}

実行結果を見てみましょう。左が、delay(100)とした場合、右がdelay(25)とした場合です。

実行結果はこちらから

これを利用して表示速度を制御することも可能です。


今回紹介したframerate()とdelay()を使用することによりウィンドウ上の動きが制御可能となります。どちらを使うかは状況次第です。動作レートが不変で良い場合は、framerate()をsetup()で1回コールすれば良いですし、場面ごとにレートを随時変える場合は、delay()の方が便利かもしれません。

次回は、3D(あるいは3Dぽく見える)アプリを作成します。



週刊 さんちゃTOPページへ