スマートフォンやhtml5+CSS3など新技術に四苦八苦。jQuery、AjaxなどJavaScriptも難しいですね。そんなWebに悩む人のネタ帳です。

今更ながら、Box2DFlashAS3がおもしろく、ちょっとはまりつつあるこの頃です。

今回はオブジェクトにムービークリップを貼り付けようと思います。
Box2Dではオブジェクト生成しても、基本的にはなにも見えません。前回のサンプルや本家サイトでは赤だの緑だの色がついていますが、あれはデバッグモードでの描写であり、デバックを外すと全てのオブジェクトは透明になってしまいます。
そこで、通常ではオブジェクトと同サイズのムービークリップを用意して、繰り返し処理でオブジェクトを追いかけるような処理を実装します。

以下サンプルです。ステージをクリックするとボールが落下してきますが、それぞれのボールにはこのブログのロゴの形をしたムービークリップがついてゆくようにしています。結果的としてロゴがごろごろ動いているように見えるわけです。






ソースは主に前回との差分です。まずはオブジェクトにムービークリップをセットするところから。b2BodyDefに対して予め用意したムービークリップ「mc」を設定します。そしてaddChildでステージに追加します。

var body:b2BodyDef = new b2BodyDef();
body.userData = mc;
body.userData.width = mc.width;
body.userData.height = mc.height;
addChild(body.userData);

最後に、ENTER_FRAMEで描写開始をしているところに、ムービークリップが追従するような処理を追加します。この処理は一般的なコードで、いろんなサンプルサイトで紹介されています。

world.Step(1 / 30, 10);
for (var bb:b2Body = world.m_bodyList; bb; bb = bb.m_next){
	if (bb.m_userData is MovieClip){
		bb.m_userData.x = bb.GetPosition().x*100;
		bb.m_userData.y = bb.GetPosition().y*100;;
		bb.m_userData.rotation = bb.GetAngle() * (180/Math.PI);
	}
}

さて、今度はこのロゴをドラッグで投げ飛ばしたいですねー。

このエントリーをはてなブックマークに追加

Comment

Comment Form

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

Monthly Archives

Search