小游戏开发上手体验 - Cocos Creator

妖狐艹你老母 2022-04-22 02:20 205阅读 0赞

微信群里最大的骚扰源有两种：

一是转发\#吱口令\#~！@\#￥%……&\*，长按复制此消息领红包之类的

另一种就是各种小程序和小游戏的分享

前天有同学无意间把一个小游戏分享到了答疑群中，我看了一下，其实游戏的代码逻辑并不复杂（简化版的跳一跳，套上个吃鸡的主题），于是就随手立了一个FLAG：

![v2-835d606d584188b05c4a53327759eace_b.jpg][]

正好我最近也有研究下小游戏的打算，趁周日没什么事，说干就干吧。

不过作为上手项目，我选择了一个更熟悉的游戏：**打飞机**

话不多说，先上成品：

![v2-16deaed89ed310a12f111e8dcba2ddbe_b.jpg][]

游戏地址：

[Cocos Creator | Planelab.crossincode.com][Cocos Creator _ Planelab.crossincode.com]

（暂时只提供手机版，电脑上比例没限制）

文章刚发出去一阵子估计人会很多，游戏加载慢，打不开可以稍等一会儿。

老读者应该知道，之前我们用 pygame 做过这个打飞机游戏的教程。公众号（Crossin的编程教室）对话里回复关键字 **pygame** 可获取教程及代码。

但 pygame 开发的游戏是无法通过网页发给别人在线玩的，更不能做成微信小游戏。

所以我这次是用了游戏引擎 **Cocos Creator**。它使用 JavaScript 作为开发语言，开发出的游戏可以直接生成微信小游戏、网页、iOS、安卓等平台上的版本。冲着这一点，也就勉强可以忍受用 js 开发的痛苦了。

除了 Cocos Creator，其实我最近也尝试了另外两个比较常用的网页小游戏引擎：**Egret** 和 **Unity**

简单分享下我的体验：

**Cocos Creator**

我是 cocos2dx 的老用户，从很早版本就开始使用，用它开发过商业游戏。cocos2d 最早源自 python，之前教室也发过一些用 cocos2d 系引擎（python/js）开发的游戏（分别回复关键字 **贪吃蛇**、**皮皮虾**、**火箭**），但说实话，各种版本和小 bug 让人体验真的不太好，所以我是想着换别的试试。但 Cocos Creator 意外地让我眼前一亮。它其实已经抛弃了以前 2dx 的开发流程，改走组件化、数据驱动的模式（应该是借鉴了 unity 的优点），跟 cocos2dx 可以说是完全两样东西了。虽然我觉得有些地方让人不习惯（主要是 node 和组件的关系变化），另外代码提示和调试信息还是比较弱（也可能是我姿势不对），但总得感觉还行，应该是比较适合我自己的需求。

**Egret**

Egret 在前两年 HTML5 小游戏刚兴起的时候发展非常快，一整套的开发工具也很完善，不仅可以写小游戏，也可以写 HTML5 的移动页面。但我这次在用的时候，在第一步用户登录的地方就卡住了，各种无法连接，就根本用不了开发工具，官网搜了一圈也没找到解决方案（听说开发者群比较活跃，需要在那里问问题）。后来好不容易才弄成功了。Egret 还是基于代码的开发模式，有一系列配套工具处理开发中的各种环节，个人感觉更适合团队分工使用。

**Unity**

Unity 作为世界级的老牌引擎，功能足够强大，跟前俩就不是一个级别的（Cocos Creator 大概就是 2D 低配版的 Unity）。但从另一个角度来说，也因此太“重”了。而且因为各种素材是基于 3D 模型的，需要有一定专业技能才能搞定。当然它也提供了素材商店，里面有很多免费素材可以使用。之前我们的文章 [地球上所有人站在一起会是什么样？][Link 1] 里就用到了 Unity。

所以仅从我个人开发小游戏自娱自乐的角度来看，我本是想抛弃过去 cocos 那一套东西，结果试了一圈发现 cocos creator 更适合……当然这不代表其他的引擎不好，还是要看你的需求，选择合适你的。

今天这篇我就不讲游戏的代码实现了，感兴趣的可以先看看代码，地址见文末。因为一来是改用了 JavaScript，二来数据驱动的模式和之前代码驱动的模式有很大的区别。

举个例子：以前你要在游戏上显示一行文字，你需要在代码中定义一个 Label 对象，添加到显示层上，设置它的位置、显示效果、显示的文字内容。而现在你只要拖动一个 Label 组件到场景中，在属性面板上输出相关数值即可。

之后我也会写更多的小游戏，对此感兴趣的同学，或者有什么好玩的点子，都可以留言讨论。如果大家觉得有需要，后面我可以来详细写下这方面的教程。

本文相关的代码和素材已上传，需要的同学请在公众号（Crossin的编程教室）对话栏回复关键字 **飞机**

════  
*其他文章及回答：*

欢迎微信搜索及关注：**Crossin的编程教室**

![154816tsh373rusgwbxs7w.png][]

[v2-835d606d584188b05c4a53327759eace_b.jpg]: http://crossin-forum.b0.upaiyun.com/upload-by-code/20181101/v2-835d606d584188b05c4a53327759eace_b.jpg
[v2-16deaed89ed310a12f111e8dcba2ddbe_b.jpg]: http://crossin-forum.b0.upaiyun.com/upload-by-code/20181101/v2-16deaed89ed310a12f111e8dcba2ddbe_b.jpg
[Cocos Creator _ Planelab.crossincode.com]: https://link.zhihu.com/?target=http://lab.crossincode.com/static/plane/
[Link 1]: https://link.zhihu.com/?target=http://mp.weixin.qq.com/s?__biz=MjM5MDEyMDk4Mw==&mid=2650167652&idx=1&sn=10156cc93992379b08a4208520e23bfb&chksm=be4b541c893cdd0ae26ce9db3a9790273efae2ecc6a77c5a253617c3294611f2156baff8a84f&scene=21#wechat_redirect
[Python]: https://www.zhihu.com/question/20702054/answer/19022301
[Link 2]: https://zhuanlan.zhihu.com/p/25824007
[Link 3]: https://zhuanlan.zhihu.com/p/34685564
[debug]: https://zhuanlan.zhihu.com/p/45298171
[Python 1]: http://zhuanlan.zhihu.com/p/36064871
[Link 4]: https://zhuanlan.zhihu.com/p/44918640
[Link 5]: https://zhuanlan.zhihu.com/p/36581953
[Link 6]: http://zhuanlan.zhihu.com/p/29043669
[Link 7]: http://zhuanlan.zhihu.com/p/28726244
[Python 2]: https://zhuanlan.zhihu.com/p/37664927
[Link 8]: http://zhuanlan.zhihu.com/p/46396868
[requests]: https://zhuanlan.zhihu.com/p/38466193
[AI]: https://zhuanlan.zhihu.com/p/39937847
[AI 1]: https://zhuanlan.zhihu.com/p/46801141
[154816tsh373rusgwbxs7w.png]: http://crossin-forum.b0.upaiyun.com/forum/201806/28/154816tsh373rusgwbxs7w.png