背景:
本来打算下一个游戏是涂鸦跳跃的,因为图片资源没准备好,暂时往后推迟。刚好笔者手头上有部分水果忍者的游戏素材,于是上周末花了一些时间把水果忍者实现了;以前读大学的时候这款游戏就风靡大街小巷,记得当时同学间也比赛谁得的分数高,乐趣无穷;笔者在那会还没学过编程,很难理解切西瓜是怎么做出来,现在此一时彼一时了。
因为素材有限,实现的效果可能和原版有差距,例外很多童鞋反映flappy,popstar和原版不同,笔者在此说明:因为是学习demo,差距肯定是有的,好的游戏需要读者精雕细琢,把握好每一个参数和细节,都是需要花时间的。
本系列共有上中下三篇,源码基本完成,分析分为三篇;
ps:
1 CocosEditor已发布新版本,现在提供6个实战demo学习,包括flappy ,popstar ,fruitninja,moonwarroris,fruitattack,testjavascript;
2 运行demo需要配置好http://blog.csdn.net/touchsnow/article/details/19070665,暂不支持其他工具。demo是跨平台的,可移植运行android,ios,html5网页等,代码是基于javascript语言,cocos2d-x游戏引擎,CocosEditor手游开发工具完成的。
源代码下载:
请到代码集中营下载(水果忍者 上):http://blog.makeapp.co/?p=319
不同平台下的效果图:
windows
html5网页
android平台
代码分析:
实战项目里面ccbx场景都是略过的,主要放在代码这块,水果忍者主要有两个场景,一个开始场景StarLayer和主场景MainLayer;
1 StartLayer.js里面有三个按钮,道场,开始,退出。道场功能未去实现,点击开始进入主场景MainLayer;StarLayer里面主要处理三个选项的旋转动画,如下直接无限循环旋转cc.RepeatForever.create(cc.RotateBy.create());圆环顺时针,水果逆时针;
2 切掉绿色西瓜进入主场景;
#西瓜包括两个西瓜碎片,触摸的瞬间,西瓜消失,两个碎片san0,san1产生;并各自执行不同的移动动画,并动画结束后cleanup;
#触摸的瞬间也产生刀锋的效果 cc.MySprite.createFlash(this.rootNode, “flash.png”, this.pBegin, loc);
#0.5s执行延迟函数进入主场景this.rootNode.scheduleOnce;
3 产生刀锋函数,主要是根据pBegin和pEnd两个点计算旋转角度,简单的数学应用;以前不知道学数学干嘛,现在知道了;
4 进入主场景MainLayer,需要每隔一段时间产生向上抛的水果newFruit;
#从水果数组里面随机取一个水果getRandom(FRUIT_DATA.length)
#创建水果精灵,初识位置 x随机取,y的话在屏幕下方-100,fruit.setPosition(cc.p(x, -100));;
#设置水果的各种属性zorder,num等;
#创建一个贝塞尔曲线控制数组,有三个点,决定一条曲线var controlPoints =
cc.p(x, -100),
cc.p(x - offSetX, topY),
cc.p(x - offSetX * 2, -100)
]; 又是数学的应用;
#让水果同时实现贝塞尔曲线动画和旋转动画
#水果数组添加该水果,主要用于后面的水果切除检测 this.fruitList.push(fruit);
#播放抛出音效;
5 每隔一段时间抛出一个newFruit,只要在update更新函数里面编写就行;
如果当前时间距离上一个水果产生时间为0.5s,就又产生一个,周次循环,不断产生水果
CocosEditor开发工具:
CocosEditor,它是开发跨平台的手机游戏工具,运行window/mac系统上,javascript脚本语言,基于cocos2d-x跨平台游戏引擎, 集合代码编辑,场景设计,动画制作,字体设计,还有粒子,物理系统,地图等等的,而且调试方便,和实时模拟;
CocosEditor 下载,介绍和教程:http://blog.csdn.net/touchsnow/article/details/19070665;
CocosEditor官方博客:http://blog.makeapp.co/;
FruitNinja系列文章
http://blog.csdn.net/touchsnow/article/details/22585403
Fruit Ninja(水果忍者)游戏源代码下载、分析(中)
Fruit Ninja(水果忍者)游戏源代码下载、分析(下)