第3回　障害物に当たるとボールが跳ね返る

今回から始まるLesson4では簡易的な物理シミュレーションを使って、簡単なFlashゲームを制作して みよう。Flashゲームはちょっとしたミニゲームから、これがFlashでできているの！？と驚くような本格的なものまでさまざまなものがある。いきな り本格的なものは敷居が高いので、まずは簡単なものから始めてみよう。Flashゲームの制作はActionScriptのスキルアップにおおいに役立つ だろう。

（解説：茅原 伸幸）

今回は前回の作例に障害物を追加して、さらにゲーム性を高めてみたい。画面上に風船を飛ばし、ボールが風船に当たると跳ね返る仕組みだ【サンプル1】。

それでは今回追加する風船の描画から始めよう。風船とボールの当たり判定を簡単にするために、円形の風船を描画し、円の中心を基準点としてシンボルに変換する。風船のひもの部分は円の横幅を超えないようにしておく【図1】。

風船のムービークリップが作成できたら、ライブラリからステージに追加し、画面上に3つの風船を配置する。それぞれインスタンス名を「balloon0」、「balloon1」、「balloon2」として、それぞれ大きさを調整しておく【図2】。

風船が配置できたら、前回の【図1】のActionScriptに次の【図3】のActionScriptの黄色い部分を追加する。

今回の作例のポイントは「円と円の衝突判定」だ。ここでは、円（ボール）と円（風船）の中心間の距離が、ふたつの円の半径の合計より小さくなったら衝突、と判定できる【図4】。

中心間の距離は「三平方の定理」で求めることができる（参考：Lesson1 第3回の■Point　二点間の距離を三平方の定理で導き出す）。半径はそれぞれの幅（_width）を1/2で割った値だ。

こうして求められたふたつの値を比較することで、ボールと風船が衝突しているか、していないかの判定ができる。今回は風船が3つあるので、for文を使って毎回3つの風船に対しての判定を繰り返していることになる。

次に、ボールが風船に衝突した場合に跳ね返る処理（【図3】オレンジの部分）を実行する。

【サンプル2】を見てみよう。本来であれば、入射角（黒い矢印）から反射角（グレーの矢印）を計算して、その方向へ跳ね返らせるほうが好ましいが、今回は簡易的に、風船の中心から見て、ボールが風船へ衝突した位置の方向（赤い矢印）へ跳ね返らせるようにしている【サンプル2】。

ボールと風船との角度は、「Math.atan2」メソッドで簡単に求めることができる（詳しくはLesson1の第4回「基準点とマウスポインタの座標から角度を求め、指定する」の項を参考にしてほしい）。一連の処理の流れは次の【サンプル3】で確認してみよう。

ボールと風船との角度を元に、ボールの位置を風船と接する位置に移動し、ボールが風船へ衝突する前のspeedX、speedYの値からボールの衝突前のスピードを求める。さらに、0.9を乗算して衝突後のスピードを設定し、先程求めた衝突後の角度から新しいx方向へのスピード（speedX）、y方向へのスピード（speedY）を設定している。

「円と円の衝突判定」は応用範囲がとても広く、とくにゲームでは多用される手法だろうと思う。ぜひ試してみてほしい。

次回へつづく