Cocos Creator:创建棋盘

Cocos Creator:创建棋盘

  • 创建地图三部曲:
    • 1. 创建layout组件
    • 2. 创建预制体Prefab,做好精灵贴图:
    • 3. 创建脚本LayoutSprite.ts
    • 收尾工作:

创建地图三部曲:

1. 创建layout组件

使用layout进行布局,定义好Grid网格模式,做以下设置:
Cocos Creator:创建棋盘_第1张图片

2. 创建预制体Prefab,做好精灵贴图:

在这里插入图片描述

3. 创建脚本LayoutSprite.ts

import { _decorator, Component, Node, instantiate, Prefab} from 'cc';
const { ccclass, property } = _decorator;

@ccclass('LayoutSprite')
export class LayoutSprite extends Component {

    @property({ type: Prefab })
    private gridItemPrefab = null;

    private myuuid = [];

    start() {
        //实例化一个gridItemPrefab
        for (let i = 0; i < 64; i++) {
            let gridCell = instantiate(this.gridItemPrefab);
            this.node.addChild(gridCell);
            this.myuuid.push(gridCell.uuid);
            console.log(gridCell.uuid);
        }
        // console.log(this.myuuid[0]);
        // console.log(this.node.getChildByUuid(this.myuuid[0]));
        
    }

}

收尾工作:

挂载脚本LayoutSprite.ts到layout组件上(拖上去),挂载预制体prefab到脚本的gridItemPrefab属性上。大功告成!
Cocos Creator:创建棋盘_第2张图片

你可能感兴趣的:(Cocos,Creator,Cocos,Creator)