這學期要開設”web程式設計課”,總覺得做一個部落格或者是某某管理系統,雖然頗為考驗一個人的程式設計水準,卻很是無趣,是以我計劃做html5遊戲,遊戲畢竟對沒有接觸過程式設計的人來說是很神奇的物品(滿足筆者小小的虛榮心)。
在網上搜尋了很久,也沒有找到關于Cocos2d-html5的比較正式的文檔(不過關于Cocos2d-x的文檔倒是很多)。是以我決定不依靠教程也不依靠文檔,單單看引擎庫裡的tests代碼來學習該引擎,這應該會是一個比較有趣的體驗(雖然不一定會成功,但自學能力對于coder是非常重要的技能)。
前段時間剛剛看過一篇“如何學一門新技術”的文章。文章傳遞的思想是:如果你要學一門新技術,不要從最基礎的語言開始慢慢準備,那樣會磨光你的耐心,而是應該直接動手做你要做的工程,後期再來關注語言細節和基礎。放在Cocos2d-html5引擎學習上就是,雖然筆者對于JavaScript,html5,css3的了解甚少,但還是毅然拿起了引擎開幹,等過段時間,有需要了,再來好好補償基礎内容。
以上的内容僅僅是開篇的感想,以下才是幹貨。
首先看看tests檔案夾的内容:
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsICdzFWRoRXdvN1LclHdpZXYyd2LcBzNvwVZ2x2bzNXak9CX90TQNNkRrFlQKBTSvwFbslmZvwFMwQzLcVmepNHdu9mZvwFVywUNMZTY18CX052bm9CX90TUPVTQE5kerpWT4FEVkZXUYpVd1kmYr50MZV3YyI2cKJDT29GRjBjUIF2LcRHelR3LcJzLctmch1mclRXY39jM2UTOwADNxITMxATM0EDMy8CX0Vmbu4GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.jpg)
1.檔案夾的内容是具體的測試檔案,先不考慮。
2.build.xml是編譯引擎生成的檔案清單報告。
3.main.js遊戲的入口
4.tests_resources-html5.js定義遊戲将要使用的資源的檔案。
5.tests-boot-html5.js引擎的配置檔案。
6.test_main.js該遊戲(測試例程)的主要結構檔案,類似于C++的main。
7.其它和jsb有關的内容,不考慮。
main.js的最後一行(63)表明遊戲從TestController(場景或層)開始。
考慮TestController這個類,
這個類繼承了LayerGradient,呈現了一個層,層的顔色是漸變的,層上有兩個菜單:第一個菜單有兩個菜單項(關閉按鈕,控制是否自動測試的開關按鈕),第二個菜單有對應不同測試項目的多個菜單項。還實作了滾動滑鼠和拖動滑鼠第二個菜單滾動的響應事件。(有關各個類,函數的具體内容,留待研究單個測試執行個體時考慮,現在主要把握遊戲邏輯)
如上述,遊戲啟動後,呈現了這樣一個層。
當我們點選第二個菜單中的任意一項時,會觸發菜單項的響應函數,生成目标測試例的場景,并将目前主場景替換為該場景,我們會在該場景中實作該測試例的所有操作。
考慮所有測試例場景有共性,是以我們實作一個TestScene 類并在該類中實作各個場景的共性功能,以供其它所有場景類繼承。
場景上有一個菜單,菜單上有一個傳回TestController層的菜單項。
考慮所有測試例的層有共性,是以實作一個BaseTestLayer實作所有層的共性功能,以供其它所有層繼承。
層上有,兩個代表測試内容的标題,一個菜單上面有3個菜單項,分别表示重新測試,下一個測試,上一個測試。
完成以上邏輯後,就可以一個個實作測試例了,主要是實作一個個層。
注意:我們在不同檔案中定義的變量,如果希望被其它檔案找到的話,就需要特别注意檔案的包含順序,如下圖:
後面的檔案可以找到前面的檔案定義的變量,但是前面的檔案時無法找到後面的檔案定義的變量,關于這個問題,初期困擾了筆者許久。
結束了外層邏輯的建立後,就可以一個一個的考慮測試例,來深刻的研究這個引擎。是以現在對于外層的這些類和函數不了解也沒有關系。