Asial Blog

Recruit! Asialで一緒に働きませんか?

Box2DFlashAS3を使ってゲームっぽいものを作ってみる

カテゴリ :
フロントエンド(HTML5)
タグ :
Tech
Box2D
Flash
ActionScript
こんばんは。松田です。
今回は以前ちょっとだけいじってみたActionScript用2D物理エンジンBox2DFlashAS3を使って簡単なゲームを作ってみたいと思います。

前回のエントリーはこちら

今回は前回いじったものをちょっとずつ直しながら、ゲームっぽく仕上げてみたいと思います。

ゲームセンターにあるなつかしのコインゲームをつくってみます。
コインを入れると上からコインがカタカタと落ちて来て、下のほうにある枠に入ります。
横一列に並ぶといっぱいコインがもらえ、同じマスに2つコインが入ると全部ボッシューとなります。
高校時代に近くのゲーセンに行くと、最初にこのゲームをやって所持コインを増やしてから他のゲームに回ってました。なついです。
参考URLでも出せれば説明しやすいのですが、正式名称がわからないのでググれませんでした。あれってなんてゲームなんですかねー。


さて、今回作るものは以下のような感じです。
  1. 1.コインの初期方向を決める左右に揺れて動く棒
  2. 2.パチンコのピンのような障害物となるちっちゃいbox
  3. 3.最終的にコインが収まる枠(枠の中にコインが2枚たまると床部分が一瞬消えるようにする)


2は単純にboxをたくさん配置するだけなので特に説明不要です。
3も単純ですが、枠の床部分を消すために、 world.DestoryBody(b2Body) を使用して床のboxを削除する必要があります。(この削除方法がわかるまで苦労しました・・・)

1のようなオブジェクトを作るには、自動的に動くモーター機能のついた、回転ジョイント(Revolute Joint)を使う必要があります。
回転ジョイントのおおまかな使い方は以下の通りです。
  1. ・動くboxを作成
  2. ・動きの支点となるちっちゃいboxを作成
  3. ・ジョイントの設定をするb2RevoluteJointDefを作成し、モーターの速度、ジョイントに使用する上記二つのオブジェクトを指定する
  4. ・world.CreateJoint(def)でジョイントを設置

他のコインが2枚重なった判定やその他のもろもろの処理はものすっごく汚い判定になってしまったので説明は省きます。
ソースコードはここ

別画面で開く
「投入」ボタンを押すとコインを落とします。
下に9つの枠がありますが、コインが隣同士に並ぶと払い戻し金が増えます。
2枚並ぶと4枚払い戻し、3枚並ぶと8枚、4枚並ぶと16枚・・・。
ただし、同じ枠に2枚コインが入ってしまうと全て没収されます。
そろそろ危ないな・・・と思ったタイミングで「払戻」ボタンを押しましょう。

いろいろと不具合が残りまくりですがそろそろ眠気がピークに達してきたので続きはそのうち・・・。

Box2Dはマニュアルがほとんど見当たらないので、目的の処理を行う方法を探すまでがなかなか大変ですね。