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

news/2024/11/15 20:38:14/

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

一是转发#吱口令#~!@#¥%……&*,长按复制此消息领红包之类的

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


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

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

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

话不多说,先上成品:

游戏地址:

Cocos Creator | Plane lab.crossincode.com

(暂时只提供手机版,电脑上比例没限制)

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


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

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

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


除了 Cocos Creator,其实我最近也尝试了另外两个比较常用的网页小游戏引擎:EgretUnity

简单分享下我的体验:

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 模型的,需要有一定专业技能才能搞定。当然它也提供了素材商店,里面有很多免费素材可以使用。之前我们的文章 地球上所有人站在一起会是什么样? 里就用到了 Unity。


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


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

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

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


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



════
其他文章及回答:

如何自学Python | 新手引导 | 精选Python问答 | 如何debug? | Python单词表 | 知乎下载器 | 人工智能 | 嘻哈 | 爬虫 | 我用Python | 抓抖音 | requests | AI平台 | AI名画

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


http://www.ppmy.cn/news/858004.html

相关文章

【玩物立志-scratch少儿编程】骑上小摩托(动态背景+摄像头控制操作)

前言 🚀 博主主页:阿阿阿阿锋的主页_CSDN 🚁 编程工具:scratch网页版 🚁 本程序相关资源:图片素材及程序源码 scratch是一款主要面向小朋友们的编程工具,也有很多的大朋友们喜欢它,因…

C++测手速小游戏

终于有空写点代码了(作业好多awa) 今天带来的是一款非常有趣的测手速游戏,玩家可以测试自己的反应速度。 创作背景: MCYH的反应速度及其迟钝。 为了锻炼自己,MCYH制作了一款测手速的小游戏,以达到提高反应速…

Java阶段五Day05

Java阶段五Day05 文章目录 Java阶段五Day05问题解析无法启动Naocs Nacos服务注册发现Nacos运行架构nacos-server是一个服务进程 配置注册服务端客户端csmall-for-jsd-business-adapter 整合nacos-clientyaml详细配置注册信息在nacos中的内存状态多实例注册服务抓取(…

学计算机需要培训班吗?我对计算机培训班的浅谈

在学习IT技术的过程中,你是否也被安利过各种五花八门的技术培训班?这些培训班都是怎样向你宣传的,你又对此抱有着怎样的态度呢?在培训班里学技术,真的有用吗? 文章目录 一、引入话题二、学习IT上培训班的益…

Photoshop CS6 for Mac破解版/序列号简介

Photoshop无论是在Windows平台还是Mac平台,都是最受欢迎的图像处理工具,Mac志为大伙找到了最新的Adobe photoshop CS6for Mac破解版,无需序列号,希望能够帮助到大家。 Photoshop CS6 for Mac破解方法: 1、断网 2、开始安装&#…

ADOBE CS3 序列号

今天帮一朋友装台电脑,是vista的,原先她想要装成XP,不过经过努力,弄了张集成ICH9驱动的安装光盘,终于XP上了,不过最终由于指纹识别、摄像头找遍都找不到驱动,于是又装回Vista U版去了。系统搞定…

Adobe flash professional CS5的序列号

Adobe flash professional CS5的序列号 2011年02月17日 用户操作 [留言] [发消息] [加为好友] AIR Android Flash Flex Flex-chart FMS SFS 生活点滴 项目技术文章 存档 [b] Adobe flash professional CS5的序列号 [/b][b]收藏 [/b] 1302-1856-1610-7184-8664-4749 1302-1629-…

Adobe Illustrator CS5 序列号及安装方法

Adobe Illustrator CS5 序列号及安装方法 我给经验说一下吧,靠了,累死我了,PS安装一点不费劲,就这个ai怎么弄都不好用,一装好就被adobe认出来是非法的。现在好了,咱不按电驴上的方法破解hosts,咱自己找了个方法,人工编辑hosts!就大功告成了!轻松加自在,娃哈哈哈!!…