跳ね回るボール

説明

画面をタップまたはクリックすると、その位置からボールが3つ放たれます。ボールは重力に引っ張られて落ちていき、床や壁を跳ね回ります。

Studioで試す

以下のリンクから Jasmine Tea でこのサンプルプログラムを Studio 画面で開いて実際に試すことができます。プログラムを実行したいときは、エディターの右下にある青色の「実行」ボタンを押してください。

Studio で開く

プログラム

cls
balls@=[]
damp=0.95
gravity=9.8
reaction=0.7
t=time()
idx=0
render 0
do
  tap mx,my
  if mx<>-1 then
    for i=1 to 3
      sx=random(-30, 30)
      sy=random(-20, 0)
      c=random(1,37)
      balls@[idx]=[mx,my,sx,sy,c]
      idx=idx+1
      if 50<idx then
        idx=0
      end if
    next
  end if
  if 10<time()-t then
    cls 2
    for i=len(balls@)-1 to 0 step -1
      ball@=balls@[i]
      x=ball@[0]
      y=ball@[1]
      sx=ball@[2]
      sy=ball@[3]
      c=ball@[4]
      circle (x,y),10,c,c
      sy=sy+gravity/5
      x=x+sx/5
      y=y+sy/5
      if x>639 or x<0 then
        sx=-1*sx
        x=x+sx/5
      end if
      if y>399 then
        sy=sy*-1*reaction
        sx=sx*damp
        y=399
      end if
      balls@[i]=[x,y,sx,sy,c]
    next
    t=time()
    render 1
    render 0
  end if
loop

解説

各ボールの情報は、2行目の ball@ 配列が持ちます。各ボールは、情報から構成されています。

* ボールの位置(x, y)

* ボールのスピード(sx, sy)

* ボールの色(c)

これらが [x, y, sx, sy, c] という順番で配列として ball@ 配列の各要素に格納されます。

9行目から51行目で do, loop 命令を使って無限ループしています。この中で、タップされたときの処理と、ボールの描画処理を繰り返し行っています。

10行目から22行目では、画面をタップされた際に、新規に3つのボールを ball@ 配列に追加しています。ボールの個数は最大50個と制限しているために、ボールの格納位置を idx 変数で管理しています。ボールを一つ追加すると、idx 変数の値を +1 しています。そして、50個を超えたときは、idx 変数の値を 0 に戻しています。

ボールの描画処理は、23行目から50行目で行っています。外側の do, loop 命令による無限ループの度に描画処理を行うのではなく、time 関数を使って 10ms ごとに描画処理を行うようにしています。

25行目から46行目で、ball@ 配列の要素をひとつずつ取り出して、各ボールの描画を行っています。まずグラフィック画面を cls 命令で消去します。次に、各ボールを circle 命令を使って描画していきます。その後、スピードや重力、跳ね返りの度合いの値を使ってボールの位置を変化させて、ball@ 配列の各要素の配列を更新しています。これを繰り返すことで、ボールがアニメーションしているように見えます。