Skip to main content

创建和使用游戏脚本

脚本的创建​

在Cocos Creator中，脚本也是资源的一部分。在资源管理器中创建的脚本，默认是一个NewComponent组件，称为脚本组件。在资源管理器中右击，并在弹出的快捷菜单中选择【创建】→【脚本(TypeScript)】命令，即可创建一个新的脚本，如图2-5所示。在脚本创建成功后，我们将其命名为Game，使其与Game场景保持一致

  • 在脚本创建成功后，我们将其命名为Game，使其与Game场景保持一致，
  • 在Game脚本创建完成后，我们可以在资源管理器中选中它，此时在属性检查器中，就可以看到脚本对应的内容了。这些代码是编辑器在脚本创建时自动生成的预设内容，

编辑脚本​

  • 此时如果我们尝试对代码进行编辑就会发现，在属性检查器中看到的代码是没有办法直接进行编辑的。如果我们需要编辑对应的脚本文件，则可以在资源管理器中双击需要编辑的脚本。此时CocosCreator会使用外部编辑器打开对应的脚本文件，我们直接在外部编辑器中对代码进行编辑即可。
  • 如果我们已经成功安装并配置了VS Code，那么当双击资源管理器下的Game脚本时，VS Code将会自动打开Game脚本文件，
  • 接下来我们直接在VS Code中对代码进行修改，在start函数中添加一行hello world的输出语句，
    start () {
        // [3]
        console.log('Hello world')
    }
  • 在代码修改完成之后返回Cocos Creator，再次通过属性检查器查看Game脚本，此时可以发现在VS Code界面中编辑的内容已经同步过来了，与此同时Cocos Creator也会自动检测脚本的改动并迅速编译，开发者无须在Cocos Creator中进行多余的刷新操作。

绑定脚本​

  • 在通常情况下，没有被加载的游戏脚本是不会自动运行的，为了方便后续测试脚本，我们可以将其绑定到场景节点中，让其在加载节点时被触发执行。因此在脚本编写完成之后，我们还需要对脚本进行绑定操作。
  • 在Cocos Creator中，脚本可以作为节点的组件存在，因此我们可以通过给节点添加组件来绑定脚本。编辑器提供了两种方式来添加组件：一种是拖动式添加，另一种是通过点击【添加组件】按钮添加。
  • 下面我们采用后者来对脚本进行绑定操作。
  • 在场景中创建一个空节点，并让其作为脚本组件的载体。
  • 右击层级管理器内的空白区域，在弹出的快捷菜单中选择【创建】→【空节点】命令，并将其重命名为Node，如图2-9所示。
  • 在层级管理器中选中新建的【Node】节点，之后在属性检查器中点击【添加组件】→【自定义脚本】→【Game】按钮，即可为当前的节点绑定我们自定义的Game脚本，

如果想删除脚本​

如果想要删除节点下的组件，则可以点击组件右上方的【齿轮】图标，并在弹出的菜单中选择【删除组件】命令，即可删除组件

hello游戏脚本​

  • 在上一小节中，为了让脚本能够被触发执行，我们将其绑定到了场景节点上。当加载场景时，场景下的所有子节点都会被加载；当加载到Node节点时，该节点上绑定的组件也会被同时加载，此时，Game脚本将会以组件的方式运行。因此，当我们在预览运行Game场景时，脚本中添加的调试输出语句【hello world】也将会被触发。为了测试调试输出语句，接下来我们将通过Chrome浏览器的开发者工具来查看相关的调试输出。如果你已经配置了Chrome浏览器为默认预览浏览器，在点击Cocos Creator编辑器的预览按钮时，Game场景就会以浏览器预览方式在Chrome浏览器中打开。我们可以使用快捷键F12，或者点击Chrome浏览器右上角的三个点的按钮，选择【更多工具】→【开发者工具】命令，打开浏览器的开发者工具，

  • 在开发者工具界面中，点击【Console】选项卡切换到调试输出界面，此时我们可以看到脚本运行后打印出来的【hello world】，