官網對于<em>Cocos Code IDE</em>已經不提供下載地址和維護了创千,<em>Cocos Code IDE</em>是基于<em>eclipse</em>做的一個封裝淀散。可能大家一致覺得不好用的緣故吧瘩欺,找到了知乎包含王哲的回答
首先是Code IDE 1.x版本用Eclipse就是個坑蜘腌,被谷歌帶進去的∧牛現在谷歌自己棄坑了。接著我們嘗試了基于IntelliJ開發(fā)了Code IDE 2.0撮珠,出到2.0 beta版沮脖。結論是,在IntelliJ上做到最終想要的效果芯急,要和場景編輯器勺届、UI編輯器無縫集成,是非常困難的娶耍。特別是要「無縫集成」這件事情非常難達到免姿。目前采用第三套方案,在Cocos Studio的框架體系內用C#開發(fā)代碼編輯器榕酒,希望這第三次嘗試的這條路能夠走順吧胚膊。
不過我對于新出的這個<em>Cocos Creator</em> 完全不知道怎么使用故俐,感覺不是寫代碼的人用的,所以折騰這尋找到了<em>Cocos Code IDE</em> 的以前下載地址紊婉。
windows版本的直接下載雙擊安裝即可药版。
<em>Cocos Code IDE</em> 就是一個eclipse 很好使用,debug喻犁,打包之類的功能都非常好使用槽片。接下來看一下<em>helloworld</em>項目。
這個時候用sublime打開項目肢础,因為<em>Cocos Code IDE</em>對于項目文件列的不全还栓。
對比一下
- framworks
包含兩個引擎 里面會有<em>cocos2d-html5</em>和<em>js-bingings</em>,還有個<em>runtime-src</em>传轰,這個是項目編譯完成后在各個平臺生成的項目剩盒,有android、ios_mac路召、win2勃刨。在對應的平臺打開項目也是一樣的。 - index.html
web的首頁入口兼容html5格式的股淡。 - main.js
這里是程序的入口身隐,啟動的時候做一下預加載等
cc.game.onStart = function(){
if(!cc.sys.isNative && document.getElementById("cocosLoading")) //If referenced loading.js, please remove it
document.body.removeChild(document.getElementById("cocosLoading"));
// Pass true to enable retina display, disabled by default to improve performance
cc.view.enableRetina(false);
// Adjust viewport meta
cc.view.adjustViewPort(true);
// Setup the resolution policy and design resolution size
cc.view.setDesignResolutionSize(800, 450, cc.ResolutionPolicy.SHOW_ALL);
// The game will be resized when browser size change
cc.view.resizeWithBrowserSize(true);
//load resources
cc.LoaderScene.preload(g_resources, function () {
cc.director.runScene(new HelloWorldScene());
}, this);
};
cc.game.run();
- project.json定義了一些配置的東西
{
"project_type": "javascript",//語言的設置 js
"debugMode" : 1, //日志級別的控制
"showFPS" : true,
"frameRate" : 60,//幀率
"id" : "gameCanvas",
"renderMode" : 0,
"engineDir":"frameworks/cocos2d-html5", //引擎設置
"modules" : ["cocos2d"],//需要的模塊
"jsList" : [//需要的js文件導入,引擎會加載
"src/resource.js",
"src/app.js"
]
}
在index.html中做了引入
<script src="frameworks/cocos2d-html5/CCBoot.js"></script>
- public 就是編譯后發(fā)布的東西
- res 就是存放資源的地方 圖片之類的
- runtime 是編譯完成所產生的包
- src 就是源代碼存放的地方 其中有resource.js 就是加載res目錄下面的圖片資源
var res = {
HelloWorld_png : "res/HelloWorld.png",
CloseNormal_png : "res/CloseNormal.png",
CloseSelected_png : "res/CloseSelected.png"
};
var g_resources = [];
for (var i in res) {
g_resources.push(res[i]);
}
- tools 就是一些工具東西唯灵。
接著說一下程序的運行流程
瀏覽器上第一步肯定是加載index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Cocos2d-html5 Hello World test</title>
<link rel="icon" type="image/GIF" href="res/favicon.ico"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="full-screen" content="yes"/>
<meta name="screen-orientation" content="portrait"/>
<meta name="x5-fullscreen" content="true"/>
<meta name="360-fullscreen" content="true"/>
<style>
body, canvas, div {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
-khtml-user-select: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
</style>
</head>
<body style="padding:0; margin: 0; background: #000;">
<canvas id="gameCanvas" width="800" height="450"></canvas>
<script src="frameworks/cocos2d-html5/CCBoot.js"></script>
<script cocos src="main.js"></script>
</body>
</html>
其中先加載<script src="frameworks/cocos2d-html5/CCBoot.js"></script>
這個js就是去加載project.json還有其他一些的配置贾铝。然后再去加載<script cocos src="main.js"></script>
,這個類就是一些圖片音頻等資源的預先加載。然后啟動游戲cc.game.run();
埠帕。