Cocos Framework 项目教程

1. 项目目录结构及介绍

Cocos Framework 项目的目录结构如下：

cocos-framework/
├── assets/
│   └── ...
├── scripts/
│   ├── animator/
│   ├── common/
│   │   ├── cmpt/
│   │   ├── config/
│   │   ├── hack/
│   │   ├── util/
│   │   └── ...
│   ├── creator/
│   ├── ts/
│   └── ...
├── res/
│   └── shader/
├── settings/
│   └── ...
├── .gitignore
├── LICENSE
├── README.md
├── jsconfig.json
├── project.json
├── tsconfig.json
└── ...

目录结构介绍

• assets/: 存放项目资源文件，如图片、音频、预制体等。
• scripts/: 存放项目的脚本文件，包括动画状态机、全局管理器、UI组件、工具类等。
  • animator/: 动画状态机相关脚本。
  • common/: 通用脚本，包括组件、配置、工具类等。
    • cmpt/: 常用UI组件。
    • config/: 配置文件，如多语言配置。
    • hack/: 引擎源码的修改或扩展。
    • util/: 工具类脚本。
  • creator/: Cocos Creator 相关脚本。
  • ts/: TypeScript 脚本。
• res/: 存放资源文件，如着色器（shader）。
• settings/: 项目设置文件。
• .gitignore: Git 忽略文件配置。
• LICENSE: 项目许可证文件。
• README.md: 项目说明文档。
• jsconfig.json: JavaScript 配置文件。
• project.json: 项目配置文件。
• tsconfig.json: TypeScript 配置文件。

2. 项目启动文件介绍

Cocos Framework 的启动文件通常是 project.json 和 scripts/creator/ 目录下的脚本文件。

project.json

project.json 是 Cocos Creator 项目的核心配置文件，包含了项目的各种设置，如场景、预制体、脚本等。

{
  "project_type": "javascript",
  "debugMode": 1,
  "showFPS": true,
  "frameRate": 60,
  "id": "example_game",
  "renderMode": 0,
  "engineDir": "frameworks/cocos2d-html5",
  "modules": ["cocos2d"],
  "jsList": [
    "src/resource.js",
    "src/app.js"
  ]
}

scripts/creator/

scripts/creator/ 目录下的脚本文件通常是项目的入口脚本，负责初始化游戏场景、加载资源、启动游戏逻辑等。

// scripts/creator/main.ts
import { Game } from './game';

cc.game.onStart = function() {
  Game.init();
  cc.director.runScene(new GameScene());
};

cc.game.run();

3. 项目的配置文件介绍

Cocos Framework 的配置文件主要集中在 scripts/common/config/ 目录下，包括多语言配置、全局事件配置等。

多语言配置

多语言配置文件通常位于 scripts/common/config/ 目录下，如 En.ts 和 Zh.ts。

// scripts/common/config/En.ts
export const En = {
  "welcome": "Welcome to Cocos Framework!",
  "start_game": "Start Game"
};

// scripts/common/config/Zh.ts
export const Zh = {
  "welcome": "欢迎使用 Cocos Framework！",
  "start_game": "开始游戏"
};

全局事件配置

全局事件配置文件通常位于 scripts/common/util/Events.ts。

// scripts/common/util/Events.ts
export enum EventName {
  GAME_PAUSE = "game_pause",
  GAME_RESUME = "game_resume",
  TIME_SCALE = "time_scale"
}

通过这些配置文件，开发者可以方便地管理项目的多语言支持、全局事件等。