Comments前回は「cocos2d-html」の特徴や環境の構築についてご説明しました。今回はサンプルプログラムがどのように動作しているのかについて解説します。<cocos2d-htmlの基本構造>「cocos2d-html」は、以下の構成となっています。※サンプルプログラムも同様の構成<cocos2d-htmlのサンプルプログラム解説>サンプルプログラムは、以下のファイル構成となっています。resource.jsindex.htmlを実行すると、最終的には「myApp.js」という「scene」が実行され、その中でレイヤーとスプライトを設定し、画面に表示されます。そこに至るまでの流れについて、簡潔に解説します。■index.htmlの読み込みindex.htmlをテキストエディタで開きます。本HTMLファイルでは、一番最後に「cocos2d.js」を読み込んでいることがわかります。次に、「cocos2d.js」の内容を見てみます。■cocos2d.jsの読み込みcocos2d.jsをテキストエディタで開きます。「cocos2d.js」では、cocos2d-htmlの基本設定を行います。それぞれの項目について、以下の内容を設定します。上記の設定値を元に「cocos2d-html」の初期化処理が行われます。その後「cocos2d-html」のエンジン側から「main.js」の読み込み処理が要求されます。■main.jsの読み込みmain.jsをテキストエディタで開きます。main.jsの最後の行に以下の処理があります。cocos2dApp(HelloWorldScene);main.jsファイルが読み込まれると、本処理によってこのアプリの最初のシーンが生成されます。生成されるシーンは「HelloWorldScene」を設定してありますが、[src]-[myApp.js]に定義されています。新しくアプリを作成する場合は、この[myApp.js]を作り込んでいくことになります。<myApp.jsの解説(最初に表示されるシーン)>シーン・レイヤー・スプライトについては、全てクラス構造になっています。レイヤーの構造が重要ですので、要点を解説します。3シーンにレイヤーを紐付け・レイヤーには「cc.Layer」を継承した変数「Helloworld」を使用していることがわかります・「HelloWorld」の「init」メソッドで画像やラベルを生成し、レイヤーに紐付けしています・レイヤーには「init」メソッドの他にも、タッチ関連のイベント等が存在します以上で「cocos2d-html」のサンプルプログラムに関する解説は終了です。<次回以降の更新について>次回はこのサンプルプログラムを、Androidプロジェクトに内包して表示する方法について解説を行います。コメントをキャンセルメールアドレスが公開されることはありません。BlogFeathersFeathersHTMLJavaScript。