CocosCreator零基础制作游戏《极限跳跃》八、添加游戏积分系统
前面我们实现了整个游戏的流程,下面我们来完善游戏的积分系统。。先来分析下游戏的积分,第一次展示积分的地方就是我们的游戏主场景MainScene,玩家通过一些机制来获取积分,实现积分的更新,当玩家游戏结束后展示玩家所获的的当前积分。
我们一开始制作游戏场景的时候就制作了一个积分节点score,其string属性值为0。打开GAME.js脚本可以发现,一开始的时候我们onLoad方法就初始化了积分。
接着我们在GAME.js脚本里新添加一个函数来实现积分的更新。代码如下:
01
//GAME.js
02
//....省略...
03
04
//积分更新
05
gainScore: function () {
06
this.score += 1;
07
// 更新 scoreDisplay Label 的文字
08
this.scoreDisplay.string =this.score.toString();
09
10
cc.sys.localStorage.setItem("ScoreDis" ,this.scoreDisplay.string);//本地存储
11
12
},
13
14
//.....省略...
这段代码的意思是实现积分+1,增长一个积分。并把积分存储到本地,注意本地存储代码。。。那么什么时候才增长积分呢??
在触摸屏幕接触的时候,如果背景滚动我们就增加一个积分。添加代码位置如下图:
这样每次玩家移动带动背景滚动的时候,积分就会更新。积分更新到时候会存储到本地,这样我们游戏结束的时候就可以正确的显示出来。
新建GameOverScore.js脚本,代码如下:
01
//GameOverScore.js
02
cc.Class({
03
extends: cc.Component,
04
properties: {
05
//积分更新
06
Scores: {
07
default: null,
08
type: cc.Label
09
},
10
},
11
//积分更新
12
disScore: function () {
13
this.score = cc.sys.localStorage.getItem("ScoreDis");//读取本地存储的积分
14
// 更新 scoreDisplay Label 的文字
15
this.Scores.string ="Score: " +this.score.toString();//显示
16
},
17
18
// use this for initialization
19
onLoad: function () {
20
this.disScore();//首次加载时候调用
21
},
22
23
// called every frame, uncomment this function to activate update callback
24
// update: function (dt) {
25
26
27
// },
28
});
这段代码的意识是加载的时候,onLoad函数调用积分更新的方法,实现从本地读取游戏场景中存储的积分。
双击打开GameOver场景,如图:
为GameOver场景Canvas绑定刚刚新建的GameOverScore.js脚本。并把score组件拖进scores进行绑定。
这样游戏结束的时候,就会更新score节点组件的显示内容。下面我们来测试下。双击打开主场景,从游戏场景开始测试积分的更新,以及游戏结束的积分显示。
是不是很好玩啊,哈哈。加个积分排行榜更好啊,以后 慢慢扩展来。。。
到此我们整个游戏已经算完成了,当然一个游戏不能没有声音和音效,下面我们来添加声音系统功能。。。