cocos2d-lua消除游戏实战（一）主场景和游戏场景设计

使用版本为3.7，官方最新版本。

一、会用到的知识点和注意事项

  

    

•    使用ccui.button，3.7版本框架与之前是有差别的，需要注意我们不在使用cc.ui，而是使用ccui(详细的可以看看luabinding)。 ccui.button.create会调用luabinding ，luabinding会调用C++静态方法。
•     display.newTTFLabel({text = tostring(self.highSorce), font = "font/earth38"})  ，使用label标签的时候我们可以去display.lua看看它是如何实现的。内部调用的跟button的时序差不多的，调用luabinding，然后luabinding调用C++。而且我们要注意 font/earth38，这个不要加earth38的扩展名,不信自己加一下试一试。
•      游戏资源下面有下载地址，我会在项目完成之后，上传完整版本。

注意：这个本来是书上的例子，但是3.6和3.7版本有差异，算是大版本更新吧，官网是这么说的。我就升级了一下这个小项目。

二、主场景设计

                            有一个背景 mainBg.png

                          开始按钮startBtn_N.png 

点击迁移场景到游戏场景

local MenuScene = class("MenuScene", function()
    return display.newScene("MenuScene")
end)

function MenuScene:ctor()
    -- 1.加载精灵帧
    display.addSpriteFrames("fruit.plist", "fruit.png")

    -- 2.背景图片
    display.newSprite("mainBG.png")
        :pos(display.cx,display.cy)
        :addTo(self)
    -- 3.开始按钮
   local btn  = ccui.Button:create("startBtn_N.png","startBtn_S.png","",1)
      btn:align(display.CENTER, display.cx, display.cy - 80)
        btn:addTo(self)
   btn:addTouchEventListener(function(event)
            print("TODO: switch to PlayScene!")

            local playScene = import("app.scenes.PlayScene"):new()
            display.replaceScene(playScene, "turnOffTiles", 0.5)

       end)
     

end

function MenuScene:onEnter()
end

function MenuScene:onExit()
end

return MenuScene

三、游戏场景

local PlayScene = class("PlayScene", function()
    return display.newScene("PlayScene")
end)

function PlayScene:ctor()
	-- init value
	self.highSorce = 0
	self.stage = 1
	self.target = 123
	self.curSorce = 0

	self:initUI()
end

function PlayScene:initUI()
	-- 背景图片
	display.newSprite("playBG.png")
		:pos(display.cx, display.cy)
		:addTo(self)

	-- high sorce
	display.newSprite("#high_score.png")
		:align(display.LEFT_CENTER, display.left + 15, display.top - 30)
		:addTo(self)

	display.newSprite("#highscore_part.png")
		:align(display.LEFT_CENTER, display.cx + 10, display.top - 26)
		:addTo(self)

	self.highSorceLabel = display.newTTFLabel({text = tostring(self.highSorce), font = "font/earth38"})
		:align(display.CENTER, display.cx + 105, display.top - 24)
        :addTo(self)
	
	-- 声音
	display.newSprite("#sound.png")
		:align(display.CENTER, display.right - 60, display.top - 30)
		:addTo(self)

	-- stage
	display.newSprite("#stage.png")
		:align(display.LEFT_CENTER, display.left + 15, display.top - 80)
		:addTo(self)

	display.newSprite("#stage_part.png")
		:align(display.LEFT_CENTER, display.left + 170, display.top - 80)
		:addTo(self)

	self.highStageLabel = display.newTTFLabel({text = tostring(self.stage), font = "font/earth32"})
		:align(display.CENTER, display.left + 214, display.top - 78)
        :addTo(self)
	
	-- target
	display.newSprite("#tarcet.png")
		:align(display.LEFT_CENTER, display.cx - 50, display.top - 80)
		:addTo(self)

	display.newSprite("#tarcet_part.png")
		:align(display.LEFT_CENTER, display.cx + 130, display.top - 78)
		:addTo(self)

	self.highTargetLabel = display.newTTFLabel({text = tostring(self.target), font = "font/earth32"})
		:align(display.CENTER, display.cx + 195, display.top - 76)
        :addTo(self)

	-- current sorce
	display.newSprite("#score_now.png")
		:align(display.CENTER, display.cx, display.top - 150)
		:addTo(self)

	self.curSorceLabel = display.newTTFLabel({text = tostring(self.curSorce), font = "font/earth48"})
		:align(display.CENTER, display.cx, display.top - 150)
        :addTo(self)
	
	-- TODO:倒计时条
end

function PlayScene:onEnter()
end

function PlayScene:onExit()
end

return PlayScene

四、项目效果展示：

资源下载