Cocos2d-html5 HelloWorld模板和引擎使用簡介

本文主要介紹Cocos2d-html5如何快速的使用模板文件建立游戲項目，以及一些引擎的使用注意事項。

在代碼倉中，已經集成Project的模板，位置在cocos2d-html5/HelloWorld目錄下，包含的文件有：

1. HelloWorld.html
2. HelloWorld.js
3. cocos2d.js
4. ./Classes/AppDelegate.js

    其中，HelloWorld.html文件是網頁的加載文件，里面主要定義了canvas和引導文件cocos2d.js。

    cocos2d.js文件用來加載所有的js文件，然后調用initLoader加載圖片，聲音等資源文件。加載完畢之后，創建出application，並開始運行。目前代碼倉是分離的js文件，版本發布會將引擎文件進行打包和壓縮，變為一個獨立的文件。

    HelloWorld.js用來創建出運行環境的Scene，並將產生的scene返回給AppDelegate。在scene里面可以放置各種layer和sprite，並給layer或者sprite加上各種動作和效果。

    值得一提的是，logo展示背景層的創建方式有點特殊，是采用cc.LazyLayer()創建。采用這么做的好處是，canvas不需要實時對整個畫面進行刷新，節省渲染時間，提高幀率。LazyLayer的方式，可以用來管理游戲的大背景，降低渲染消耗。

    AppDelegate初始化幀率和Director，調用runWithScene開始運行HelloWorld。至此，整個Demo就運行起來了。

    在cocos2d.js中，默認添加的是Canvas Menu，如果要Dom Menu，則替換對應的文件。涉及的文件有以下部分：

    Canvas Menu模式：

    cc.loadjs('menu_nodes/CCMenuItem.js');

    cc.loadjs('menu_nodes/CCMenu.js');

   Dom Menu模式：

   cc.loadjs('base_nodes/CCdomNode.js');

   cc.loadjs('menu_nodes/CCdomMenuItem.js');

   cc.loadjs('menu_nodes/CCdomMenu.js');

    在使用Dom Menu，瀏覽器原生支持，可以有更高的運行效率，但是用Dom Menu創建的Items和Menu只能在Canvas的上方。如果創建出來的菜單需要在Canvas Menu下方的話，需要選用Canvas Menu。

服務器搭建

     引擎使用到的特殊文件類型包括：.tmx .tsx .plist .fnt，需要在服務器中設置支持以上類型的文件。

 

Sean Lin，轉載請注明： http://www.cnblogs.com/SeanLin/archive/2012/05/24/2516714.html