Box2D(Titanium)サンプルコードを読み下してみよう第2編 ui.js

■ 次にui.js
Titanium向けBox2DのサンプルであるTiBallの2つめのファイルui.jsのソースコードを読んでいきたいと思います。
★マークの部分で重要なことを書いていますので拾い読みしてください。

大まかにいえば、ui.jsはメニュー画面やゲーム画面を載せるような大きなViewとそれを載せるWindowをつくるところです。

1. 即時関数でapp.uiのオブジェクトを作ります。あとはここに順次載せていく。

2. app.uiにoverlayというプロパティを持たせる。
★ ここのoverlay重要。Box2Dのタップなどのイベントの制御は（生成されたボディそのものではなく）このoverlayに載せていくことになる。
⇒つまり、動いているボディを制御するためには、（そのボディそのものにイベントリスナをつけることはできず）e.globalPoint.xなどの座標を指定するなどした、見えない新しいボディを生成して、その別のボディが”衝突”したように見せかけて制御する。イベントはTitaniumのものを使用する。
※ボディとは、ゲームの世界で動くもの（ピンボールのボール）やゲームの世界で動かないもの（ピンボールの壁など）のこと。詳しくはworld.jsの項で後述。

3. メニュー画面やゲーム本体のWindowやViewの載せていきかたはソースコードを読めば分かる。Titaniumなどと一緒。

上記をまとめた感じでソースコードに落としこんでみます。

以上です。

It works!

Ads verification

2011-12-01