4．マウスからの入力

　マウスからの入力で絵を描くことを考えます。この場合、これまでとちょっとプログラムの形が変わります。今までは上から順に命令を実行して一番下まで行くと終わりでしたが、setup()とdraw()を使うと最初に一度だけsetup()のブロックを実行し、その後、draw()のブロックを実行し続けます。終了はウィンドウの×を押して終わりにします。

(1) マウスの位置に円を描くプログラム

　短いですが次のプログラムを実行してみてください。マウスを動かすとそこに円が描かれます。

setup()は{　}の中の命令がプログラムの最初に一度だけ実行されます。このプログラムではウィンドウを500×500の大きさで作っています。

draw()はプログラムが終わるまで、ずっと繰り返し実行されます。この中のmouseXとmouseYはprocessingがマウスの座標を格納する特別な変数です。システム変数と呼ばれます。ですから、ellipseはマウスの位置(mouseX, mouseY)を中心に直径30ピクセルの円を描きます。

mouseX, mouseYにどんな値が入っているかは、下のプログラムの様に一行だけ加えればコンソールにその値が現れます。

draw()は、デフォルトでは1秒間に60回実行されます。1回の実行を１frameと呼びます。その回数を変えるのが

frameRate(N);

です。Nは1秒間のframe数です。また、pmouseX, pmouseYには1frame前の座標が入ります。これらを使ってマウスのスピードによって円の大きさを変えるプログラムを作りましょう。マウスのスピードは1frameで動いた距離を使いましょう。距離の計算には2乗する関数sq(), ルートを求める関数sqrt()を使います。

7行目は、距離を求める関数distを使って、dist(pmouseX, pmouseY, mouseX, mouseY);書き換えることもできます。

演習1　マウスの位置に原点(0,0)から直線を引くプログラムを作成せよ。

演習2　ウィンドウのサイズを(500, 500)として、マウスの位置にウィンドウの四隅から直線を引くプログラムを作成せよ。

(2)　マウスを追いかける
　今度は、少し遅れてマウスを追いかけるプログラムを作ってみましょう。難しくはありません。xからx1に向かう時にすぐに座標をx1にしてしまうのではなく、中間の

x=x+(x1-x)*α

に移動させる。αはスピードを調整する係数で0より大きく1より小さい値とする。デフォルトでdraw()は1秒間に60回実行されるが、draw内の変数の値は消えてしまう。消えないようにするにはdraw()の外で宣言する必要がある。下のプログラムでは、そうした変数x，y，alphaを1，2行目に宣言している。2行目の宣言文はdraw()内で10行目に宣言しても結果は同じとなる。

次に、draw()内の10行目、

background(0);

と加えてみましょう。これで、draw()が実行されるたびに背景が黒く塗りつぶされます。実行結果がどう変わるかやってみてください。

演習3　背景を白にして、マウスのスピードに応じて半径が変化する黒い円がマウスを追いかけてくるプログラムを作りなさい。

演習4　背景を白、サイズを(500, 500)として、中心(250，250)で半径100の円周上の36点からマウスの位置に直線を引くプログラムを作成せよ。なお、frame毎に背景を白く塗りつぶすものとする。