原文链接: cocos 躲避球游戏(1) --创建项目和场景切换
参考实现
https://github.com/gdgoldlion/Man-Game-20s
从零开始走一遍流程
场景切换效果如下
新建项目
注意坐标系原点位置在左下角, 以及会自动创建一个默认场景
创建场景和按钮
创建四个场景, 分别为关于页面, 游戏主页面, 和设置页面 和登录页面, 并从右边拖拽label标签进去, 表明该页内容
为按钮设置名称, 和修改按钮结点下的label, 设置显示的文字
修改label文字
修改项目运行时的默认场景
现在点击预览就是下面的样子了
添加脚本
cc.Class({
extends: cc.Component,
properties: {
label: {
default: null,
type: cc.Label,
},
startBtn: {
default: null,
type: cc.Button,
},
configBtn: {
default: null,
type: cc.Button,
},
},
startBtnHandle() {
console.error("startBtnHandle");
cc.director.loadScene("GameScene");
},
configBtnHandle() {
console.error("configBtnHandle");
cc.director.loadScene("ConfigScene");
},
onLoad() {
this.startBtn.node.on(
cc.Node.EventType.TOUCH_START,
this.startBtnHandle.bind(this)
);
this.configBtn.node.on(
cc.Node.EventType.TOUCH_START,
this.configBtnHandle.bind(this)
);
},
start() {},
// update (dt) {},
});
把对应的组件拖进去
刷新后可以看到能够拿到内容了
实现点击按钮切换场景
startBtnHandle() {
console.error("startBtnHandle");
cc.director.loadScene("GameScene");
},
configBtnHandle() {
console.error("configBtnHandle");
cc.director.loadScene("ConfigScene");
},
onLoad() {
this.startBtn.node.on(
cc.Node.EventType.TOUCH_START,
this.startBtnHandle.bind(this)
);
},