Fruit Ninja(水果忍者)遊戲源代碼下載、分析（中）---可運行Android，Ios，Window，Mac，Html5平臺

背景：

  上一篇，已經實現了水果不斷向上拋的效果和開始界面，這一篇我們將分析如何切水果，獲得分數；運行demo需要配置好CocosEditor，暫不支持其他工具。demo是跨平臺的，可移植運行android，ios，html5網頁等，代碼是基於javascript語言，cocos2d-x遊戲引擎，CocosEditor手遊開發工具完成的。

源代碼下載：

請到代碼集中營下載(水果忍者 cocos2d-JS 源代碼)：http://blog.makeapp.co/?p=319

不同平臺下的效果圖：

windows

html5網頁

android平臺

代碼分析：

1 創建水果靜態數組，每一個水果都有四個參數，編號，分數，本身的圖片，切除後的碎片；這裏定義好了，下面直接用；

FRUIT_DATA = [
    {
        num: 0,
        score: 1,
        fruitImage: "apple.png",
        cutImage: ["apple-1.png", "apple-2.png"]
    },
    {
        num: 1,
        score: 2,
        fruitImage: "banana.png",
        cutImage: ["banana-1.png", "banana-2.png"]
    },
    {
        num: 2,
        score: 2,
        fruitImage: "basaha.png",
        cutImage: ["basaha-1.png", "basaha-2.png"]
    },
    {
        num: 3,
        score: 3,
        fruitImage: "peach.png",
        cutImage: ["peach-1.png", "peach-2.png"]
    },
    {
        num: 4,
        score: 5,
        fruitImage: "sandia.png",
        cutImage: ["sandia-1.png", "sandia-2.png"]
    },
    {
        num: 5,
        score: 0,
        fruitImage: "boom.png",
        cutImage: "boomlight1.png"
    }
];

2 檢測碰撞事件；

# 觸摸有onTouchBegan和onTouchMoved，這是兩個點，可以確定刀鋒的方向，上一節已講過；var flash = cc.MySprite.createFlash(this.rootNode, "flash.png", this.pBegin, loc);

# 首先檢查碰撞，水果和移動點發生碰撞cc.rectContainsPoint(fruit.getBoundingBox(), loc)

#如果碰撞，播放音效；playEffect；

#創建flash

#水果消失，併產生切成兩半 fruit slice

#根據水果的數據獲得分數提示 scoretip

MainLayer.prototype.onTouchesMoved = function (touches, event)
{
if (this.gameStatus == OVER) {
return;
    }

var loc = touches[0].getLocation();
for (var i = 0; i < this.fruitList.length; i++) {
var fruit = this.fruitList[i];
if (fruit && fruit.cleanuped == false) {
if (cc.rectContainsPoint(fruit.getBoundingBox(), loc)) {


//splatter audio
                cc.AudioEngine.getInstance().playEffect(FRUIT_SOUNDS.splatter, false);


//flash
var flash = cc.MySprite.createFlash(this.rootNode, "flash.png", this.pBegin, loc);

//Fruit Slice
this.newSliceFruit(fruit.num, fruit.getPosition(), flash.getRotation());
                fruit.runAction(cc.ScaleTo.create(0, 0));
                fruit.cleanuped = true;

//scoreTip
var fruitScore = FRUIT_DATA[fruit.num].score;
this.scoreTip(fruit.getPosition(), fruitScore + "");

this.totalScore += Number(fruitScore);
this.totalScoreFont.setString(this.totalScore);
            }
        }
else {
this.fruitList.splice(i, 1);
        }
    }
};

3 水果切成兩半的方法

#三個參數 水果編號num，切除的位置fruitPosition ,旋轉角度rotation；

#從數組取出水果兩個碎片圖片，並創建兩個cut1 cut2精靈

#創建兩個cut的貝塞爾動作bezier1 bezier2，方向是相反的

#兩個cut 分別runAction（）；

#本來切除的瞬間有一個果汁濺在牆上的效果shadow，因爲沒找到合適的圖片 代碼註釋掉了

MainLayer.prototype.newSliceFruit = function (num, fruitPosition, rotation)
{
//one fruit sliced two piece,cut1 and cut2
var data = FRUIT_DATA[num];
var cutImages = data.cutImage;
var cut1 = cc.MySprite.create(this.rootNode, cutImages[0], fruitPosition, 100);
var cut2 = cc.MySprite.create(this.rootNode, cutImages[1], fruitPosition, 100);
    cut1.setRotation(rotation);
    cut2.setRotation(rotation);

var controlPoints1 = [
        fruitPosition,
        fruitPosition,
        cc.p(fruitPosition.x - 200, -100)
    ];
var bezier1 = cc.BezierTo.create(1, controlPoints1);

var controlPoints2 = [
        fruitPosition,
        fruitPosition,
        cc.p(fruitPosition.x + 200, -100)
    ];
var bezier2 = cc.BezierTo.create(1, controlPoints2);

var action2 = cc.RotateBy.create(1, getRandom(360));
    cut1.runAction(cc.Spawn.create(cc.Sequence.create(bezier1, cc.CleanUp.create(cut1)), action2));
    cut2.runAction(cc.Spawn.create(cc.Sequence.create(bezier2, cc.CleanUp.create(cut2)), action2.clone()));


//fruit shadow
/*var shadowImages = ["shadow2.png"];
     var colors = [cc.c4b(200, 0, 0, 20), cc.c4b(0, 200, 0, 20), cc.c4b(0, 0, 200, 20), cc.c4b(200, 200, 0, 20)];
     var shadow = cc.MySprite.create(this.rootNode, shadowImages[getRandom(shadowImages.length)], fruitPosition, 10);
     shadow.setColor(colors[getRandom(colors.length)]);
     shadow.setScale(0.5);
     shadow.runAction(cc.Sequence.create(cc.DelayTime.create(2), cc.CleanUp.create(shadow)));*/

};

4 提示分數，這個很簡單，只是一個創建文字標籤的方法

MainLayer.prototype.scoreTip = function (p, message)
{
var director = cc.Director.getInstance();
var size = director.getWinSize();
var label = cc.LabelTTF.create(message, "Arial", 30);
    label.setPosition(cc.p(p.x, p.y + 50));
    label.setColor(cc.c3b(0, 255, 0));
    label.setZOrder(10000);
this.rootNode.addChild(label);
    label.runAction(cc.Sequence.create(cc.DelayTime.create(0.8), cc.CleanUp.create(label)));
return label;
};

這一篇就到這裏；

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/；