官方文档

关键词

组件控制台模拟器浏览器伪代码游戏脚本日志输出

文字记录

大家好,下边我们来讲解一下游戏脚本的运行。在上节课我们已经创建了一个游戏脚本,但是怎么样来运行它呢?这节课来演示和讲解一下。首先打开 cocos, 然后在这里边我们双击 pigscript 这个脚本,那么它就会直接在 VSCode 里边打开它。

由于这样有一个 bug ,所以需要我们先把它叉掉,然后从左边的这个文件列表里边再打开,这时候就可以正常的编写了,这样的一个类,大家可能是有点熟悉的,毕竟大家都应该是写过 class 的,比如说 Java 里边的类或者是JavaScript里边也有类的概念,这里边就定义了一个类,然后这个叫做属性,然后这个叫做方法
image.png
你可能不懂,但是没有关系,我们写着写着就懂了。比如说在这个 start 的方法里边,我们就加上一句日志输出,我们可以使用用 cc.log 这个方法,看我们使用 cc.log 这个方法就可以来输出一条日志。这个也是系统也就是 cocos 给我们提供的 API ,在这里边你可以输入一段文字,我们稍微修改一下,然后就把它保存。

当我们保存之后,在 cocos 里边就会自动的刷新。你可以看到点中这个脚本的时候,在属性检查器这里边内容已经有了刷新,下边我们看一下对于这样的一个 cc.log这样的一句代码,怎么样才能运行它呢?好我们就不用管它,直接运行一下我们这个项目就可以了,把这个游戏运行起来,然后它就会被自动的调用。

运行的时候我们还是选择以模拟器方式,这里有两种方式,模拟器,浏览器,我们选择的是模拟器方式来运行。那这时候就会打开一个 cocos 的模拟器,在这模拟器里边运行我们刚才做好的这个游戏,那我们看一下这个日志打印输出放到什么地方了。在这边可以看到有一个控制台窗口,它是有很多行的,你需要把这个控制台窗口往下拉一下,这边有滚动条,拉到最下边就可以看到一句打印输出,组件 pigscript start 那这句话刚好就是我们自己打印出来的,这就充分说明了当我们启动这个程序的时候,那么这个组件的这个方法 start 方法被调用了
image.png
至于他为什么被调用,我们来分析一下。 你看现在我们已经把这个游戏脚本 pigscript 作为佩奇这个节点的一个组件。那么当这个游戏加载的时候,那么会加载所有的节点,然后这边所有的组件也会被加载,它会加载sprite组件,也会加载我们的 pigscript 组件,那么在加载的时候,它那就会自动的来运行它。
image.png
如果我们用一个伪代码来表示的话,可以这样来理解,比如说它内部会创建一个 pigscript 的一个组件对象,然后再把这个组件对象挂载到这个节点下边,然后挂载的时候名字就叫做 pigscript ,然后再调用这个组件的 onload 方法,然后调用的组件的 start 方法,我们没有办法直接观察里边的运行,我们只能猜测,它内部应该是这么样来执行的,这是一个伪代码,并不是一个真实代码。

通过这几行代码,大家应该能够大致的明白这个组件 star 的方法会被调用,因为这个组件本身被实例化了,创建这个组件对象,它会自动调用这个组件的 start 方法,那么这个 onload 还有这个 start 的方法都称之为生命周期回调 life-cycle callback ,那如果你学过安卓开发的话,应该对生命期回调应该是有深刻的印象,也就是这是游戏引擎自己定义好的一种模式,一种流程。
image.png
当你创建组件的时候,它就会调用这个组件的这些方法。

  • 比如说,当它初始化的时候,就会执行你这个组件的 onload 方法
  • 当第一次激活的之前就会调用它的 start 方法
  • 那么那每帧更新的时候调用 update 方法
  • 启用它的时候是 unenable 方法
  • 禁用的时候是 undisable 方法
  • 然后组件销毁的时候是那个 on destroy 这个方法

也就是说这个组件的生命周期,就是回调用这几个方法,那么这个你也可以在他的文档里边看到,在这个基本工作流程,脚本开发指南、生命期回调里边记录他的几个说明。那通过这样的一个解释,大家应该就明白了这几个方法什么意思。这里边它注释掉了,我们也可以把它打开。
image.png
onload 方法就是这个组件在初次加载的时候,初始化的时候被调用, start 会被第一次启用之前来调用,明白了吧,这是我们这节课所要讲的东西。那么至于其他的部分,比如说类是怎么定义的,不用管,反正他已经自动帮我们写好了。然后这个属性我们后边再说。

总之,我们这节课的工作很简单了,我们练一下 cc.log 放到这个 start 方法里边试一下就可以了。而这个写法和 javascript 写法并没有什么区别。比如说我们也可以拼一个字符串出来,这样也是可以的。

好的,比如说我们现在改了之后,我们在这里边它会自动刷新的,然后我们再执行一下,重新执行一下这个游戏项目。然后我们看一下控制台里面的输出,这里边就拼凑了一个字符串,所以说我们在 TypeScript 大家之前可能听过也没有学过,但是没有关系,我们学起来很快,因为它就是 javascript 的一个加强版。

好的,我们说一下要点与细节,刚才我们演示的是模拟器方式的运行,还有用浏览器方式运行也演示一下,如果用浏览器方式的话,那就是以网页游戏的形式来发布了,你看在这个网页里边打开了这样的一个游戏界面,打开之后日志输出哪里了呢?不用想,肯定是输出到这个这个浏览器本身的控制台里边了
image.png
如果你是一个前端开发者或者学过我们的网页技术篇的话应该知道在这里边对于谷歌浏览器的话应该是 F12,开发者工具,然后就能够看到打开这个谷歌浏览器的开发者工具,然后在这个控制台,窗口里边就能够找到它。

不过你在 f12 的时候要注意一下,因为 f12 可能被它截获了,你需要在别的地方,在外边按一下 f12 才能够打开这个控制台,如果你在这个窗口里边的话是打开不了的,好的,那我们后边应该主要是两种方式都会有,我们这节课就先演示这么多。