1 Hello World – Cocos 系列教程

安装

1 下载 Dashboard
在官网的下载页面 https://www.cocos.com/creator 选择对应的系统版本进行下载

2 安装编辑器
安装完Dashboard之后点击左侧的Editor标签进行编辑器安装,建议选择3.0,因为目前官网文档最高支持到3.0

3 Hello World
选择Dashboard的项目标签;
点击右下角的新建按钮;
上面选择第2个Creator模板(Hello World),然后点击右下角的创建并打开
左下方的资源管理器面板中点击鼠标右键,选择创建-> Scene
在左上方的层级管理器面板中点击右键,选择创建->3D对象 -> Cube立方体
在 资源管理器 面板中点击鼠标右键,选择 创建 -> TypeScript,然后命名为 “HelloWorld”
双击新建的HelloWorld脚本,脚本会自动在脚本编辑器中打开,然后在start方法中添加console语句如下:

start () {
// Your initialization goes here.
console.info('Hello world');
}

在 层级管理器 中选中创建的 Cube 节点,然后在 属性检查器 面板最下方点击 添加组件 -> 自定义脚本 -> HelloWorld

4 预览场景
场景搭建完成后,就可以点击编辑器上方的 预览(三角形图标) 按钮来预览游戏了

5 修改摄像机角度
在预览中我们可以看到立方体似乎有点太小了,这时便可以通过调整场景中的 Camera 来调整场景运行时显示的区域,Camera 代表的是游戏中的玩家视角。
首先在 层级管理器 中选中 Main Camera 节点,场景编辑器 中便会显示变换工具 Gizmo,以及玩家视角的小窗口。
然后在 场景编辑器 中拖动 Gizmo,或者修改 属性检查器 中的 Position 属性,使玩家视角窗口中的立方体显示得更为明显。
再次在浏览器中预览

6 项目结构
初次创建并打开一个 Cocos Creator 项目后,开发者项目文件夹的结构如下:
assets:资源目录
build:构建目录(在构建某平台后会生成该目录)
library:导入的资源目录
local:日志文件目录
profiles:编辑器配置
temp:临时文件目录
package.json:项目配置

7 版本控制
开发者应该注意只需要提交 assets、extensions、settings、package.json,或其它手动添加的关联文件。

本站文章如未注明均为原创 | 文章作者:刘晓帆 | 转载请注明来自:前端印象

发表评论

邮箱地址不会被公开。 必填项已用*标注

浏览量:81 次浏览