PopStar(消灭星星)游戏源代码下载、分析及跨平台移植---第三篇(分数)

背景:

   经过消灭星星第二篇算法,最高的山峰已经过去了,剩下的都是小沟小河,没什么难度了。这一节笔者继续完成消灭星星的分数篇,这节主要包括:触摸提示得分 比如4 blocks 80 points,然后产生单个星星分数并移动到总分上,最后保存最高分; 

ps:

1 CocosEditor已发布新版本,现在提供6个实战demo学习,包括flappy ,popstar ,fruitninja,moonwarroris,fruitattack,testjavascript;

2 代码是基于javascript语言,cocos2d-x游戏引擎,cocos2d-x editor手游开发工具完成的;

3 运行demo需要配置好CocosEditor,暂不支持其他工具。demo是跨平台的,可移植运行android,ios,html5网页等。

 

 

源代码下载:

请到代码集中营下载(第三四篇合并  分数和关卡):http://blog.makeapp.co/?p=319

 

 

不同平台下的效果图:(windows、html5、android)

 

window平台

PopStar(消灭星星)游戏源代码下载、分析及跨平台移植---第三篇(分数)_第1张图片

 

 

mac平台

PopStar(消灭星星)游戏源代码下载、分析及跨平台移植---第三篇(分数)_第2张图片

 

 

html5网页平台

PopStar(消灭星星)游戏源代码下载、分析及跨平台移植---第三篇(分数)_第3张图片

 

android平台

 

       PopStar(消灭星星)游戏源代码下载、分析及跨平台移植---第三篇(分数)_第4张图片   PopStar(消灭星星)游戏源代码下载、分析及跨平台移植---第三篇(分数)_第5张图片

 

代码分析:

 

1  进入MainLayer.js在onEnter函数里面,我们需要获取数据库里面的最高分,在cocos里面我们一般通过sys.localStorage.getItem 和sys.localStorage.setItem来获取和存储简单的数值;

 

[javascript]  view plain copy 在CODE上查看代码片
 
  1. this.bestScore = sys.localStorage.getItem("starBestScore");  
  2.     if (this.bestScore != null && this.bestScore != undefined) {  
  3.         this.bestScore = Number(this.bestScore);  
  4.     }  
  5.     else {  
  6.         this.bestScore = 0;  
  7.     }  
  8.     this.bestScoreFont.setString(this.bestScore + "");  



 

2  定义分数规则

我们先定义分数规则,选择的星星越多,分数越高,所以规则是一个二次函数 score=length*length*5;比如选择4个星星 分数就是4*4*5=80,如果选择10个星星 分数就是10*10*5=500;然后触摸星星的时候,如果相同星星的数量大于1时 提示获取的分数

 

[javascript]  view plain copy 在CODE上查看代码片
 
  1. if (this.sameColorList.length > 1) {  
  2.   cc.AudioEngine.getInstance().playEffect(PS_MAIN_SOUNDS.select, false);  
  3.   this.showScoreTip();  
  4. }  
  5. else {  
  6.   this.scoreTipLabel.setVisible(false);}  

 

 
提示分数函数showScoreTip;
[javascript]  view plain copy 在CODE上查看代码片
 
  1. MainLayer.prototype.showScoreTip = function ()  
  2. {  
  3.     this.scoreTipLabel.setVisible(true);  
  4.     var length = this.sameColorList.length;  
  5.     var tip = length + " blocks " + length * length * 5 + " points";  
  6.     this.scoreTipLabel.setString(tip);  
  7. }  


3  确定删除相同颜色星星的时候,找到removeSameColorStars,在for循环里面给每个星星加入分数字体;
cc.StarLabel.createScore是笔者自定义的创建文字函数,startScoreSprite从创建位置MoveTo到总分数位置,然后CleanUp,最后有一个回调函数cc.CallFunc.create,这个函数用的很多,读者必须深刻理解它。回调里面主要处理分数的添加,还有一个判断是否达到目标分数的处理this.isClear;
 
[javascript]  view plain copy 在CODE上查看代码片
 
  1. var starScoreSprite = cc.StarLabel.createScore(this.rootNode, cc.p((36 + col * this.starSize), (36 + row * this.starSize)), this.oneStarScore + "");  
  2.            starScoreSprite.runAction(cc.Sequence.create(  
  3.                    cc.MoveTo.create(0.3 + k / 20, this.scoreFont.getPosition()),  
  4.                    cc.CleanUp.create(starScoreSprite),  
  5.                    cc.CallFunc.create(function ()  
  6.                    {  
  7.                        this.totalScore += this.oneStarScore;  
  8.                        this.scoreFont.setString(this.totalScore + "");  
  9.                        if (this.totalScore >= this.targetScore) {  
  10.                            if (this.isClear == false) {  
  11.                                this.isClear = true;  
  12.                                this.tipLabel.setVisible(true);  
  13.                                this.tipLabel.setString("Clear!");  
  14.                                this.tipLabel.runAction(cc.Sequence.create(cc.DelayTime.create(1),  
  15.                                        cc.MoveTo.create(1, cc.p(110, 1000))  
  16.                                ));  
  17.                                cc.AudioEngine.getInstance().playEffect(PS_MAIN_SOUNDS.stageclear);  
  18.                            }  
  19.                        }  
  20.                    }, this)  
  21.            ));  
 
 
 
4 死局时候根据剩余的星星给不同的分值。剩的越少,给分数越高;
[javascript]  view plain copy 在CODE上查看代码片
 
  1. if (deadCount < 10) {  
  2.                       if (deadCount == 0) {  
  3.                           this.totalScore += 1000;  
  4.                           this.scoreFont.setString(this.totalScore + "");  
  5.                       }  
  6.   
  7.                       this.oneDeadStarScore = Math.floor((1000 - deadCount * 100) / deadCount);  
  8.                       this.oneDeadStarScore = this.oneDeadStarScore - this.oneDeadStarScore % 10;  
  9.                       var starScoreSprite = cc.StarLabel.createScore(this.rootNode,  
  10.                               cc.p((36 + ii * this.starSize), (36 + jj * this.starSize)), this.oneDeadStarScore + "");  
  11.                       starScoreSprite.runAction(cc.Sequence.create(  
  12.                               cc.ScaleTo.create(0, 0),  
  13.                               cc.DelayTime.create(delay), cc.ScaleTo.create(0, 1),  
  14.                               cc.MoveTo.create(0.3 + jj / 20, this.scoreFont.getPosition()),  
  15.                               cc.CleanUp.create(starScoreSprite),  
  16.                               cc.CallFunc.create(function ()  
  17.                               {  
  18.                                   this.totalScore += this.oneDeadStarScore;  
  19.                                   this.scoreFont.setString(this.totalScore + "");  
  20.                               }, this)  
  21.                       ));  
  22.                   }  



5 游戏结束,当前得到的游戏分数如果大于最高分,存储最高分;
[javascript]  view plain copy 在CODE上查看代码片
 
  1. if (this.totalScore > this.bestScore) {  
  2.        sys.localStorage.setItem("starBestScore"this.totalScore + "");  
  3.    }  
 
6 自定义函数,有些函数用的很普遍,笔者一般都会在Main.js定义好,比如下面一些
[javascript]  view plain copy 在CODE上查看代码片
 
  1. cc.CleanUp = {};  
  2. cc.CleanUp.create = function (sprite)  
  3. {  
  4.     return cc.CallFunc.create(function ()  
  5.     {  
  6.         sprite.cleanuped = true;  
  7.         sprite.removeFromParent(true);  
  8.     });  
  9. }  
  10.   
  11. cc.StarParticle = {};  
  12. cc.StarParticle.create = function (node, x, y, name)  
  13. {  
  14.     var particle = cc.ParticleSystem.create("Resources/particles/" + name + ".plist");  
  15.     particle.setAnchorPoint(cc.p(0.5, 0.5));  
  16.     particle.setPosition(cc.p(x, y));  
  17.     particle.setZOrder(120);  
  18.     node.addChild(particle);  
  19.     return particle;  
  20. };  
  21.   
  22. cc.StarLabel = {};  
  23. cc.StarLabel.createScore = function (node, p, message)  
  24. {  
  25.     var label = cc.LabelTTF.create(message, "Arial", 30);  
  26.     label.setPosition(p);  
  27.     label.setColor(cc.c3b(255, 255, 255));  
  28.     label.setZOrder(10000);  
  29.     node.addChild(label);  
  30.     return label;  
  31. };  
  32.   
  33. cc.StarLabel.createTip = function (node, p, message)  
  34. {  
  35.     var label = cc.LabelTTF.create(message, "Arial", 30);  
  36.     label.setPosition(p);  
  37.     label.setColor(cc.c3b(255, 255, 255));  
  38.     label.setZOrder(10000);  
  39.     node.addChild(label);  
  40.     return label;  
  41. };  
  42.   
  43. cc.Toast = {};  
  44. cc.Toast.create = function (node, message, delay)  
  45. {  
  46.     cc.log("toast");  
  47.     var director = cc.Director.getInstance();  
  48.     var size = director.getWinSize();  
  49.     var label = cc.LabelTTF.create(message, "Arial", 40);  
  50.     label.setPosition(size.width / 2, size.height / 2 + 100);  
  51.     label.setColor(cc.c3b(255, 255, 255));  
  52.     label.setZOrder(10000);  
  53.     node.addChild(label);  
  54.     label.runAction(cc.Sequence.create(cc.DelayTime.create(delay), cc.CleanUp.create(label)));  
  55.     return label;  
  56. };  
  57.   
  58. cc.rectCreate = function (p, area)  
  59. {  
  60.     return  cc.rect(p.x - area[0], p.y - area[1], area[0] * 2, area[1] * 2);  
  61. }  
  62.   
  63.   
  64. function getRandom(maxSize)  
  65. {  
  66.     return Math.floor(Math.random() * maxSize) % maxSize;  
  67. }  

很简单,笔者感觉没写什么。。。
 
 
cocos2d-x跨平台游戏引擎
 
cocos2d-x是全球知名的游戏引擎 ,引擎在全球范围内拥有众多开发者,涵盖国内外各知名游戏开发商。目前Cocos2d-x引擎已经实现横跨ios、Android、Bada、MeeGo、BlackBerry、Marmalade、Windows、Linux等平台。编写一次,到处运行,分为两个版本 cocos2d-c++和cocos2d-html5 本文使用了后者;
cocos2d-x 官网: http://cocos2d-x.org/
cocos2d-x 资料下载   http://cocos2d-x.org/download

 

 

 

CocosEditor开发工具:

CocosEditor,它是开发跨平台的手机游戏工具,运行window/mac系统上,javascript脚本语言,基于cocos2d-x跨平台游戏引擎, 集合代码编辑,场景设计,动画制作,字体设计,还有粒子,物理系统,地图等等的,而且调试方便,和实时模拟;

CocosEditor 下载,介绍和教程:http://blog.csdn.net/touchsnow/article/details/19070665

CocosEditor官方博客:http://blog.makeapp.co/

你可能感兴趣的:(cocos2d-html5,cocos2d-js,cocoseditor,消灭星星源代码,PopStar源代码)