CocosCreator零基础制作游戏《极限跳跃》七、制作游戏结束场景并实现场景切换
前面我们实现了游戏的碰撞检测,碰到障碍物我们的角色就会死掉并开始掉落,角色掉落到屏幕底部时候游戏结束,并跳到结束场景。
我们在资源管理器新建GameOver场景。双击打开场景,调整大小为480x800,添加界面需要的节点。如图。
这样我们的结束场景就制作好了。可以预览下。
制作好了,结束场景我们就需要把我们游戏的三个场景关联起来了。
首先我们双击打开我们的第一个场景WelcomeScene。然后在资源管理器创建playGo.js脚本。代码如下:
01
//playGo.js
02
cc.Class({
03
extends: cc.Component,
04
properties: {
05
// foo: {
06
// default: null,
07
// url: cc.Texture2D, // optional, default is typeof default
08
// serializable: true, // optional, default is true
09
// visible: true, // optional, default is true
10
// displayName: 'Foo', // optional
11
// readonly: false, // optional, default is false
12
// },
13
// ...
14
},
15
// use this for initialization
16
onLoad: function () {
17
},
18
//切换场景
19
toScene: function(){
20
cc.director.loadScene("MainScene")
21
}
22
// called every frame, uncomment this function to activate update callback
23
// update: function (dt) {
24
// },
25
});
这个脚本就实现一个功能,就是切换场景到MainScene场景,也就是第二个场景我们游戏的主场景。
下面我们为开始按钮绑定脚本事件。
这样我们的切换场景功能就实现了,同样的方法我们给GameOver场景中的重新开始按钮绑定脚本事件。
给退出游戏按钮添加事件脚本,创建脚本ExitScene。代码如下:
01
//ExitScene.js
02
cc.Class({
03
extends: cc.Component,
04
properties: {
05
// foo: {
06
// default: null,
07
// url: cc.Texture2D, // optional, default is typeof default
08
// serializable: true, // optional, default is true
09
// visible: true, // optional, default is true
10
// displayName: 'Foo', // optional
11
// readonly: false, // optional, default is false
12
// },
13
// ...
14
},
15
// use this for initialization
16
onLoad: function () {
17
},
18
19
//退出游戏
20
ExitScene: function(){
21
cc.director.end();
22
},
23
// called every frame, uncomment this function to activate update callback
24
// update: function (dt) {
25
// },
26
});
使用同样的方法,给退出游戏按钮绑定事件。
还剩下一个游戏结束的切换场景事件。打开GAME脚本。添加gameover方法,并在update添加判断和处理。
01
//GAME.js
02
//....省略..
03
//gameover方法 然后在update实现gameover判断
04
gameOver: function () {
05
06
cc.eventManager.removeAllListeners();//移除所有事件监听
07
this.player.stopAllActions();//停止 player 节点的跳跃动作
08
09
cc.director.loadScene("GameOver");//切换场景到结束场景
10
},
11
//加载时执行
12
onLoad: function () {
13
//触摸监听
14
this.setEventControl();
15
// 初始化计分
16
this.score = 0;
17
//添加判断
18
this.isMoving =true;
19
20
},
21
//刷新update
22
update: function (dt) {
23
24
this.setBgMoveCreate();//检测背景
25
26
//gameOver判断 玩家坠落到屏幕底部游戏结束
27
if(this.player.getPositionY() <= -cc.view.getVisibleSize().height/2){
28
this.unscheduleAllCallbacks();
29
30
if(this.isMoving)
31
{
32
this.gameOver();
33
this.isMoving =false;
34
}
35
36
}
37
38
},
39
//......省略代码....
下面我们来测试下整个流程环节。双击WelcomeScene场景从第一个场景开始预览。
到此我们整个游戏流程以及完了,接下来完善积分系统,还有声音系统整个游戏就可以上线了。下面我们继续来做积分系统。。