#📘 Cocos Creator 语法入门文档

#1. 基础概念

Cocos Creator 使用 TypeScript/JavaScript 作为主要开发语言，游戏逻辑通常通过脚本来驱动。主要模块：

• 节点 (Node)：场景中的基本元素，可以理解为游戏对象。
• 组件 (Component)：附加到节点上的脚本/功能，比如渲染、物理、脚本逻辑。
• 场景 (Scene)：游戏运行的基本单位，包含多个节点。
• 资源 (Assets)：图片、声音、动画、Prefab 等。

#2. 脚本开发

#2.1 创建脚本

• 在 assets/scripts/ 下创建 .ts 文件
• 脚本一般继承 Component

复制import { _decorator, Component, Node } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('MyScript')
export class MyScript extends Component {
    @property
    speed: number = 10;

    start() {
        console.log("游戏开始！");
    }

    update(deltaTime: number) {
        this.node.setPosition(
            this.node.position.x + this.speed * deltaTime,
            this.node.position.y
        );
    }
}

#3. 生命周期函数

• onLoad()：脚本加载时调用
• start()：第一次 update 之前调用
• update(dt)：每帧调用
• onDestroy()：节点销毁时调用

#4. 常用 API

#4.1 节点操作

复制// 设置位置
this.node.setPosition(100, 200);

// 获取位置
let pos = this.node.getPosition();

// 设置缩放
this.node.setScale(2, 2, 2);

// 设置旋转
this.node.setRotationFromEuler(0, 0, 45);

#4.2 节点查找

复制// 获取子节点
let child = this.node.getChildByName("Player");

// 全局查找
let node = cc.find("Canvas/Player");

#4.3 资源加载

复制import { resources, SpriteFrame } from 'cc';

// 加载图片
resources.load("images/player/spriteFrame", SpriteFrame, (err, spriteFrame) => {
    this.node.getComponent(Sprite).spriteFrame = spriteFrame;
});

#5. 事件系统

#5.1 节点事件

复制// 点击事件
this.node.on(Node.EventType.TOUCH_START, (event) => {
    console.log("点击了节点");
}, this);

#5.2 键盘事件

复制import { systemEvent, SystemEvent, EventKeyboard, macro } from 'cc';

systemEvent.on(SystemEvent.EventType.KEY_DOWN, (event: EventKeyboard) => {
    if (event.keyCode === macro.KEY.a) {
        console.log("按下了 A 键");
    }
});

#6. 动画与动作

复制import { tween, Vec3 } from 'cc';

// 让节点移动
tween(this.node)
  .to(1, { position: new Vec3(200, 200, 0) })
  .start();

#7. 物理系统

#2D 刚体与碰撞

复制// 监听碰撞
onBeginContact(contact, selfCollider, otherCollider) {
    console.log("发生碰撞");
}

#8. Prefab（预制体）

复制import { instantiate, Prefab } from 'cc';

@ccclass('Spawner')
export class Spawner extends Component {
    @property(Prefab)
    enemyPrefab: Prefab = null;

    spawnEnemy() {
        let enemy = instantiate(this.enemyPrefab);
        this.node.addChild(enemy);
        enemy.setPosition(0, 0);
    }
}

#9. UI 系统

复制import { Label } from 'cc';

// 修改文本
let label = this.node.getComponent(Label);
label.string = "Hello Cocos!";

#10. 网络请求

复制// Fetch API
fetch("https://api.example.com/data")
    .then(res => res.json())
    .then(data => console.log(data));

#11. 项目结构（推荐）

复制assets/
 ├── scenes/        # 场景文件
 ├── scripts/       # 脚本文件
 ├── prefabs/       # 预制体
 ├── images/        # 图片资源
 └── audio/         # 音频资源

#12. 总结

• 核心思想：节点 + 组件
• 主要语法：TypeScript/JS（类似前端）
• 常用 API：节点操作、事件、资源、动画
• 实战建议：多练 Prefab + UI + 脚本交互