円も降らせてみよう

　先ほどは四角の箱のみでしたが、今度は円も降らしてみましょう。

　まずこちらより、サンプルファイルをダウンロード（http://www.thinkit.co.jp/images/article/91/2/9122.zip）してください（9122.zip/7.07 KB）。解凍されたsample2.fla、sample2.asをBox2DFlashAS3_2.0.0フォルダ内に配置してください。

　基本的には前ページのものと一緒ですが、79行目からの「オブジェクトをワールドに追加するメソッド」に円を生成するロジックを追加しています。

　Bodyにシェイプを追加する際にランダムに箱か円を追加するようになっています。違いは「箱の場合のシェイプの生成はb2PolygonDef();」と「円の場合のシェイプの生成はb2CircleDef();」の違いになります。

　ではFlash上でプレビューしてこのFlashを動作させてみましょう。色とりどりの箱に加えて円も落ちてくるのが確認できるかと思います。円が加わることで、オブジェクト同士の動きが違ってくるのもわかるかと思います。

　ちなみに箱のシェイプを作る際、「boxDef.SetAsBox(30, 3);」と、大きさを指定していますが、これはあくまで中心からの距離なので、実際のサイズはその倍になります。ですので、ディスプレイオブジェクトと関連づける際に「bodyDef.userData.width = 30 * 2 * m_physScale;」と2倍しているのです。

　また、多角形を作るにはb2PolygonDefのvertexCountで角の数を設定し、各頂点の座標を指定します。

　さらに複雑な図形を作る場合にはBodyに対して複数のシェイプを登録することで実現できます。四角や、多角形の組み合わせでいろいろな図形も作れますので慣れてきたら試してみてはいかがでしょうか。

Box2DFlashAS3を用いたサイト

　いままでのサンプルを見ていただくと、Box2DFlashAS3は「実験的に使うもの」という印象が強いかもしれません。しかし、最近ではいくつか商用サイトに使われることも増えてきました。以下2つ事例を紹介します。

　BEYES Watch the world（http://www.beyes.jp/recommend/60/）は、世界中の腕時計を紹介するサイトです。上からどんどん腕時計のテクスチャが張られたボックスが落ちてきます。眺めているだけでも楽しいサイトです。

　In an ABSOLUT World（http://www.absolut.com/iaaw/）は、皆が投稿したそれぞれのVisionをさまざまなUIで見ることができるCGMサイト。Box2DFlashAS3以外にもTweenerやPapervision3Dなどのオープンソースのライブラリを使って構築されています。少々重いのが難点ですが、完成度の高いサイトです。FlashもJavaScriptのように単体で開発するのではなく、ライブラリやフレームワークを使って開発するというのも増えてきています。

　いかがだったでしょうか？今回のサンプルはとてもシンプルなロジックですので、Box2DFlashAS3をちょっと試してみたい！という方にはちょうどいい量かと思います。ぜひ皆さんも物理演算シミュレーションの世界を体感してみてください。