Cocos 2 d-JS工程におけるファイル構造
8684 ワード
レスリングフォルダ保存リソースファイル
srcフォルダは主なプログラムコードです.
app.jsは、ゲームシーンを実現するJavaScriptファイルです.
レスポンス.jsはsrcフォルダでリソースに対応する変数を定義します.
config.jsonはシミュレータの運転設定情報を保存します.
project.jsonはプロジェクトの配置情報です.
index.はWebプロジェクトのトップページです.
メイン.jsとトップページindex.に対応するJavaScriptファイルは、ゲームシーンの起動を担当しています.
index.コード:
23行:Canvasラベルは、JavaScriptを通じてCanvasに2 Dグラフィックスを描画できます.Cococos 2 d-JSがウェブページで実行するゲームシーンはすべてCanvasによって描画されます.
24行:JavaScriptファイルCCBoot.jsを導入して、私達はこのファイルを守る必要がありません.
25行:JavaScriptファイルのmain.jsを導入して、私達はこのファイルを維持しなければなりません.
mail.jsコード:
ccc.gameはゲーム起動の対象です.
2~4行:ゲームビューのプロパティを設定します.
3行:ゲームビューのサイズを設定して、スクリーンの適応問題に関連して、ccc.Resolution Policy.SHOW_ALLはスクリーン適応戦略です.
グラム.レスポンスパラメータは、Src/resource.jsファイルで定義されているリソースをロードする配列である.
6行:Hello World Sceneのシーンを実行します.cc.directorは監督対象です.
10行:ccc.game.run()はゲーム起動の対象です.
project.json
6行:フレームレートを60に設定し、スクリーン1/60秒で一回更新します.
11行:ゲームエンジンをロードするモジュール
13~15行:JavaScriptファイルをロードする必要があると宣言しました.ここのファイルは主に私達が作成したものです.私達は毎回JavaScriptファイルを追加して工事中になります.ここに声明を追加します.
config.jsonコード:
3行:横画面の表示を設定しますか?それとも縦画面の表示を設定しますか?
4行:シミュレータに表示されるタイトルを設定します.
5、6行:スクリーンの幅と高さを設定します.
7行:ファイルの入り口コードを設定します.
app.js
srcフォルダは主なプログラムコードです.
app.jsは、ゲームシーンを実現するJavaScriptファイルです.
レスポンス.jsはsrcフォルダでリソースに対応する変数を定義します.
config.jsonはシミュレータの運転設定情報を保存します.
project.jsonはプロジェクトの配置情報です.
index.はWebプロジェクトのトップページです.
メイン.jsとトップページindex.に対応するJavaScriptファイルは、ゲームシーンの起動を担当しています.
index.コード:
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>Cocos2d-html5 Hello World test</title>
6 <link rel="icon" type="image/GIF" href="res/favicon.ico"/>
7 <meta name="apple-mobile-web-app-capable" content="yes"/>
8 <meta name="full-screen" content="yes"/>
9 <meta name="screen-orientation" content="portrait"/>
10 <meta name="x5-fullscreen" content="true"/>
11 <meta name="360-fullscreen" content="true"/>
12 <style>
13 body, canvas, div {
14 -moz-user-select: none;
15 -webkit-user-select: none;
16 -ms-user-select: none;
17 -khtml-user-select: none;
18 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
19 }
20 </style>
21 </head>
22 <body style="padding:0; margin: 0; background: #000;">
23 <canvas id="gameCanvas" width="800" height="450"></canvas>
24 <script src="frameworks/cocos2d-html5/CCBoot.js"></script>
25 <script src="main.js"></script>
26 </body>
27 </html>23行:Canvasラベルは、JavaScriptを通じてCanvasに2 Dグラフィックスを描画できます.Cococos 2 d-JSがウェブページで実行するゲームシーンはすべてCanvasによって描画されます.
24行:JavaScriptファイルCCBoot.jsを導入して、私達はこのファイルを守る必要がありません.
25行:JavaScriptファイルのmain.jsを導入して、私達はこのファイルを維持しなければなりません.
mail.jsコード:
1 cc.game.onStart = function(){
2 cc.view.adjustViewPort(true);
3 cc.view.setDesignResolutionSize(800, 450, cc.ResolutionPolicy.SHOW_ALL);
4 cc.view.resizeWithBrowserSize(true);
5 //
6 cc.LoaderScene.preload(g_resources, function () {
7 cc.director.runScene(new HelloWorldScene());
8 }, this);
9 };
10 cc.game.run();ccc.gameはゲーム起動の対象です.
2~4行:ゲームビューのプロパティを設定します.
3行:ゲームビューのサイズを設定して、スクリーンの適応問題に関連して、ccc.Resolution Policy.SHOW_ALLはスクリーン適応戦略です.
グラム.レスポンスパラメータは、Src/resource.jsファイルで定義されているリソースをロードする配列である.
6行:Hello World Sceneのシーンを実行します.cc.directorは監督対象です.
10行:ccc.game.run()はゲーム起動の対象です.
project.json
1 {
2 "project_type": "javascript",
3
4 "debugMode" : 1,
5 "showFPS" : true,
6 "frameRate" : 60,
7 "id" : "gameCanvas",
8 "renderMode" : 0,
9 "engineDir":"frameworks/cocos2d-html5",
10
11 "modules" : ["cocos2d"],
12
13 "jsList" : [
14 "src/resource.js",
15 "src/app.js"
16 ]
17 }6行:フレームレートを60に設定し、スクリーン1/60秒で一回更新します.
11行:ゲームエンジンをロードするモジュール
13~15行:JavaScriptファイルをロードする必要があると宣言しました.ここのファイルは主に私達が作成したものです.私達は毎回JavaScriptファイルを追加して工事中になります.ここに声明を追加します.
config.jsonコード:
1 {
2 "init_cfg": {
3 "isLandscape": true,
4 "name": "CocosJSGame",
5 "width": 960,
6 "height": 640,
7 "entry": "main.js",
8 "consolePort": 6050,
9 "debugPort": 5086,
10 "forwardConsolePort": 10088,
11 "forwardUploadPort": 10090,
12 "forwardDebugPort": 10086
13 },
14 ...........
15 ]
16 }3行:横画面の表示を設定しますか?それとも縦画面の表示を設定しますか?
4行:シミュレータに表示されるタイトルを設定します.
5、6行:スクリーンの幅と高さを設定します.
7行:ファイルの入り口コードを設定します.
app.js
1 var HelloWorldLayer = cc.Layer.extend({
2 sprite:null,
3 ctor:function () {
4 //////////////////////////////
5 // 1. super init first
6 this._super();
7 //.....
8
9 return true;
10 }
11 });
12
13 var HelloWorldScene = cc.Scene.extend({
14 onEnter:function () {
15 this._super();
16 var layer = new HelloWorldLayer();
17 this.addChild(layer);
18 }
19 });