到目前为止，我们已经实现了选择植物种类的功能，那么，当植物选择完毕之后，我们点击“一起摇滚吧”按钮，开始游戏，首先是一个准备 安放 植物的字体显示，然后玩家可以选择我的植物面板上的植物，然后对植物进行安放，现在我们就来实现这些功能。

我们在MainScene类中的showChooseWindow函数中的按钮回调onButtonClicked中添加开始游戏功能：

function MainScene:showChooseWindow()
-- 地图平移的距离
local distance=self.map:getContentSize().width-display.width
-- 地图平移过去之后，展示僵尸
self.map:runAction(cc.Sequence:create(cc.MoveBy:create(1.0,cc.p(-distance,0)),cc.CallFunc:create(function()
-- 获取玩家植物面板
local myPlantWindow=self:getChildByTag(MY_PLANT_WINDOW_TAG)
-- 创建植物选择面板
local choosePlantWindow=display.newSprite("fight/chose/fight_choose.png")
:align(display.LEFT_TOP,display.height-myPlantWindow:getContentSize().height*0.5)
:addTo(self)
-- 创建选择完毕按钮
local startBtn=cc.ui.UIPushButton.new({
normal="fight/chose/fight_start.png"
})
:align(display.RIGHT_TOP,choosePlantWindow:getContentSize().width,display.height-myPlantWindow:getContentSize().height*0.5-choosePlantWindow:getContentSize().height)
:addTo(self)
-- 选择完毕按钮回调
startBtn:onButtonClicked(function()
-- 如果玩家没有选择植物 直接return
if #self.myPlants==0 then
return
end
-- 将玩家选择的植物卡片的监听移除
for i,myPlant in ipairs(self.myPlants) do
myPlant:removeAllNodeEventListeners()
end
-- 将没被玩家选择的其余卡片移除
for i,plant in ipairs(self.canChooseplants) do
plant:removeFromParent()
end=
self.canChooseplants=nil
-- 移除面板
choosePlantWindow:removeFromParent()
startBtn:removeFromParent()
-- 地图回滚
self.map:runAction(cc.Sequence:create(cc.MoveBy:create(1.0,cc.p(distance,cc.CallFunc:create(function()
-- 滚回去之后清楚展示用的僵尸
for i,shoeZombies in ipairs(self.showZombiesList) do
shoeZombies:removeFromParent()
end
self.showZombiesList=nil
-- 播放开始动画
self:playStartAnim()
end)))


end)
-- 添加被选择卡牌
self:addCanChoosePlant()


end)))
end

-- 播放准备安放植物动画，之后战斗开始，创建战斗层FightLayer
function MainScene:playStartAnim()
local startSpr=display.newSprite("fight/startready_01.png")
:pos(display.cx,display.cy)
:addTo(self)
local animation=display.getAnimationCache("startAnim")
if animation==nil then
animation=cc.Animation:create()
-- local rect={x=0,y=0,width=self.zombies:getContentSize().width,height=self.zombies:getContentSize().height}
for i=1,3 do
animation:addSpriteFrame(cc.SpriteFrame:create(string.format("fight/startready_%02d.png",i),cc.rect(0,startSpr:getContentSize().width,startSpr:getContentSize().height)))
end
animation:setDelayPerUnit(1.0)
display.setAnimationCache("startAnim",animation)
end
startSpr:runAction(cc.Sequence:create(cc.Animate:create(animation),cc.CallFunc:create(function()
startSpr:removeFromParent()
self:startFight()
end)))
end

function MainScene:startFight()
self.isFightstage=true
self.fightLayer=FightLayer.new()
:addTo(self)
end

战斗层FightLayer我们再下一节再来详细的讲，现在开始游戏按钮的功能就已经实现了，因为玩家在主游戏场景中还要选择自己的卡片，然后安放植物，所以我们要在MainScene中添加一个触摸监听函数，用来监听玩家是否选择了植物，又是否安放了植物，所以我们再MainScene的构造函数ctor的最后加入一个addTouchListener函数，如下：

function MainScene:ctor()

.................
-- 对战层
self.fightLayer=nil

-- 添加触摸回调
self:addTouchListener()
end

-- cc.rectIntersectsRect(rect1,rect2)判断两个矩阵是否有重合的部分 可用于检测是否碰撞
-- cc.rectContainsPoint(rect,point)判断点是否在矩阵内部，可用于时候点击了某个精灵
function MainScene:addTouchListener()
self:setTouchEnabled(true)
self:setTouchMode(cc.TOUCH_MODE_ONE_BY_ONE)
self:addNodeEventListener(cc.NODE_TOUCH_EVENT,function(event)
-- 如果点击屏幕并且是战斗状态
if event.name=="began" and self.isFightstage then
-- 默认是没有点击到卡片
local isClickCard=false
-- 遍历卡片 检测卡片是否被点击
for i,myPlant in ipairs(self.myPlants) do
-- 如果点击卡片并且卡片不是冷却状态
if cc.rectContainsPoint(myPlant:getBoundingBox(),cc.p(event.x,event.y)) and not myPlant.isCooling then
-- 如果能量足够 才执行以下代码
if self.dataLayer.energy>=myPlant.energy then
-- clickCardIndex默认为0，第一次条件不成立 作用：被选择的卡片会变暗，将上一张被选择的卡片变亮
if self.clickCardIndex~=0 then
self.myPlants[self.clickCardIndex]:setCardOpacity(255)
end
-- 被选择的卡片变暗
myPlant:setCardOpacity(50)
-- 设置战斗层此时被选择的植物的类型，方便创建对应的植物并添加
self.fightLayer.choosePlantType=myPlant.plantType
-- 点击了卡片
isClickCard=true
-- 记录当前被选中的卡片下标
self.clickCardIndex=i
break
end
end
end
-- 如果没有点击到卡片
if not isClickCard then
-- 则调用战斗层的添加植物的方法
self.fightLayer:addPlant(event)
end


end
return true
end)

好的，主游戏场景中的开始游戏，选择植物和安放植物的功能就实现了，这一篇就讲到这里，下一篇我们来将核心的一个层，FightLayer战斗层是怎么实现的。