关于CocosCreator引擎学习的一点心得体会

前言

为了简洁(toulan),文中出现的CCC是CocosCreator的简称。此文是关于我学习CCC的学习路线和我遇到的一些坑,意在能给想了解CCC的学习者一点帮助,由于笔者也处于正在学习的阶段,可能文中某些见解不一定正确,希望读者能指出并一起学习探讨。我一开始接触CCC的时候是因为当时的版本开始了对微信小游戏的支持,所以如果你想学习怎么去制作微信小游戏,CCC是一个很好的选择。当时还是1.8的版本,如今已经升级到2.0的新版本,据官方称,2.0版本很多底层代码都重构了,所以可能文中一些说法已经过时了,不过没关系,遇到疑问的时候希望读者多翻翻官方文档和API,这也是我下文会讲到的。

入门:

1.脚本语言和代码编辑环境:

CCC是用JavaScript作为脚本开发语言,所以在开始游戏开发之前需要先学习下JavaScript,如果之前没接触过也没关系,可以先参考官方出的这篇JavaScript快速入门过一遍。学会基本语法便可以一边学习CCC一边学习JavaScript,一味的学习某样东西会很枯燥,容易失去信心,所以我比较习惯一边学一边做东西,遇到问题多百度和在论坛询问。

同时cocos官方在CCC v1.5 版本的时候增加了对TypeScript脚本的支持,同样可以参考官方的使用TypeScript脚本
相对于JavaScript而言TypeScript是一门强类型语言(像c/c++),最直观的表现在于代码的智能提示更强,而用JavaScript开发不仅智能提示较弱,很多问题也只能在运行的时候才能发现,所以导致效率比较低和维护性差,而TypeScript的出现便是为了解决这些缺点。

但是,CCC的很多学习资料都是用JavaScript作为开发语言的,所以入门的话还是选择JavaScript比较好一点。虽然代码提示比较弱有时挺让人抓狂的。

代码编辑环境方面,理论上支持javascript都可以使用,官方推荐用微软的vs code,体积小比较灵活还支持cocos调试功能,关于怎么配置编辑环境,请参考配置代码编辑环境一文。除了vs code,还可以使用jetbrains 家的webstorm。

2.快速上手制作第一个游戏

官方提供了一个小案例给新手学习,学习之后会对CCC制作游戏的过程有个初步的了解,建议开始之前先看一遍官方文档的新手上路部分,里面会告诉你刚接触CCC你该怎么做,还有怎么用CCC做一个hello world。我当初做这个小案例的时候觉得里面提到的一些跟动画曲线有关的函数有点难以理解,你可以先跟着整体做完整个案例,然后再去回想每一步的作用是什么,多查资料,慢慢就能理解了。

3.论坛讨论与学习

学完了第一个案例以后要学什么?论坛有很多学习资料供你参考,方便的是,论坛里官方大佬已经为我们整理了所有开源游戏、插件的学习,creator 开源游戏、插件、教程、视频汇总。除了大量的学习资料,论坛里也有许许多多的答疑帖子,可以先把你遇到的问题查找一下,看看之前是不是有人已经解决过,如果没有再发帖求助,这里要注意的是发帖的时候要按照一些规范(发帖时会提示你),这样才方便别人帮你解答。论坛里的人说话都很好听,不仅有许多大佬,还有官方引擎组的panda、jare老师等帮我们解答疑问。

4.官方文档和API

这两个算是你开发过程中会不断翻阅的两个有力工具。官方文档会告诉你关于CCC的每一个组件和一些实用的功能是怎么使用的,而且文档是随着官方版本的更新而不断更新的,比如之前提到的CCC2.0版本,官方便出了一篇文章来告诉你怎么去升级到2.0。之前提到的开发语言和环境等等,这些在官方文档中都可以找到。所以我建议你先看一遍文档,并不需要理解所有的内容(当然能理解了更好),然后跟着教程的时候或者自己制作游戏的时候遇到一些困难都可以先翻一翻官方文档,解决不了再到论坛寻求帮助。

API,里面有学习CCC会用到的函数的说明和介绍,还有每一个函数的开源代码,建议跟着教程的时候遇到不太理解的函数时多来翻阅。

学习资料

其中rpg游戏资料那个帖子虽然最后没做完,但还是可以从中学习到很多有用的东西,比如状态机,对话系统等rpg游戏会出现的元素。
视频的话我接触的资料还是帖子比较多,教学视频只发现了官方的,如果有其他资料欢迎补充交流。

我踩过的一些坑

this的指向

CCC里面的游戏物体是用节点来访问的,一般来说一个物体便是一个节点,所以我们怎么去访问节点就显得比较重要了,好比你要怎么去控制游戏里的物体。而this的指向一般是多变的,取决于你在什么环境下运行,当我们在onload函数里可以用this.node来访问我们脚本挂载的节点,而在一些情况下this又直接绑定了node。可能我这里说的不是很清楚,你可以学习之后再慢慢体会。然后这里有一篇关于this的文章我觉得挺好的,this的值到底是什么。如果不确定this的指向的话,可以用浏览器的开发者工具去调试,建议大家要学好怎么用这个调试工具,可以解决很多莫名其妙的问题。

摄像机组件

我在学习早期的教程时,摄像机的移动都是通过移动整个背景来实现,这样做可能会比较损耗性能,一些功能的实现也比较麻烦。然后有天翻文档的时候发现官方原来出了个摄像机组件(早期好像没有),了解了下发现是用更好的方法去实现这个功能,性能上比较好,还带了镜头放缩功能。但是我们要实现一些镜头抖动、缓动跟随,随着节点速度变化的跟随等功能时又该怎么办,这里可以参考下官方的直播视频

其实遇到的坑挺多,还有一些还在填,欢迎一起交流讨论。这里还有一篇文章关于javascript遇到的坑

总结

我的入门学习路线是先学习js基本语法,官方文档,小案例的学习,然后就是跟着汇总贴里的项目码一遍,还有官方的很多视频,遇到不懂的多翻论坛和一些学习群,对了再强调下开发者工具调试的重要性。还有很多东西要学习,欢迎交流讨论,共勉。

文章目录
  1. 1. 前言
  2. 2. 入门:
    1. 2.0.1. 1.脚本语言和代码编辑环境:
    2. 2.0.2. 2.快速上手制作第一个游戏
    3. 2.0.3. 3.论坛讨论与学习
    4. 2.0.4. 4.官方文档和API
  • 3. 学习资料
  • 4. 我踩过的一些坑
    1. 4.0.1. this的指向
    2. 4.0.2. 摄像机组件
  • 5. 总结

  • 网页地址复制成功!