Quick Cocos （2.2.5plus）CoinFlip解析（MenuScene display AdBar二次封装）

转载自：http://cn.cocos2d-x.org/tutorial/show?id=1621

从Samples中找到CoinFlip文件夹，复制其中的 res 和 script 文件夹覆盖新建工程中的 res 和 script文件。

用player运行，游戏可正常打开。

打开main.lua

 function __G__TRACKBACK__(errorMessage)
     print("----------------------------------------")
     print("LUA ERROR: " .. tostring(errorMessage) .. "\n")
     print(debug.traceback("", ))
     print("----------------------------------------")
 end
 
 require("app.MyApp").new():run()   --启动后执行 MyApp 脚本，并执行 run 方法。

main.lua 是lua脚本的启动文件。

无需改动。

打开 MyApp.lua

require("config")
require("framework.init")
require("framework.shortcodes")
require("framework.cc.init")

local MyApp = class("MyApp", cc.mvc.AppBase)

function MyApp:ctor()
    MyApp.super.ctor(self)
    self.objects_ = {}
end

function MyApp:run()
    CCFileUtils:sharedFileUtils():addSearchPath("res/")
    display.addSpriteFramesWithFile(GAME_TEXTURE_DATA_FILENAME, GAME_TEXTURE_IMAGE_FILENAME)

    -- preload all sounds
    for k, v in pairs(GAME_SFX) do
        audio.preloadSound(v)
    end

    self:enterMenuScene()
end

function MyApp:enterMenuScene()
    self:enterScene("MenuScene", nil, "fade", 0.6, display.COLOR_WHITE)
end

function MyApp:enterMoreGamesScene()
    self:enterScene("MoreGamesScene", nil, "fade", 0.6, display.COLOR_WHITE)
end

function MyApp:enterChooseLevelScene()
    self:enterScene("ChooseLevelScene", nil, "fade", 0.6, display.COLOR_WHITE)
end

function MyApp:playLevel(levelIndex)
    self:enterScene("PlayLevelScene", {levelIndex}, "fade", 0.6, display.COLOR_WHITE)
end

return MyApp

run方法主要做了三件事：设置资源路径，加载游戏资源，进入主场景。

与此同时MyApp还封装了所有场景和它们的切换方法。

进入第一个场景——MenuScene

local AdBar = import("..views.AdBar")
local BubbleButton = import("..views.BubbleButton")

开头两句 import 方法和c++中用处相同，MenuScene要用到以上两个子定义的类。

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

class方法有两个参数，第一个参数是类名。第二参数可以通过两种形式传递参数，一种是传入一个函数，另一种方式是传入一个Quick的类或者是Lua对象。

当传入函数时，新创建的类会以传入的函数作为构造函数。当传入的是一个对象时，会以传入的对象为父类派生下来。

所以此处是新建了一个类。

接下来是ctor方法：

 function MenuScene:ctor()
     self.bg = display.newSprite("#MenuSceneBg.png", display.cx, display.cy)   -- bg是self的一个属性。此处是一个Sprite，用于背景的添加。
     self:addChild(self.bg)　　　　　　　　　　　　　　　　　　　　　　　　　　　　    -- 将此 Sprite 节点添加到 MenuScene 这个节点中。

     self.adBar = AdBar.new()                                                  -- 信息条：adBar。
     self:addChild(self.adBar)

     -- create menu
     self.moreGamesButton = BubbleButton.new({　　　　　　　　　　　　　　　　　　　-- button 是 MenuScene 的一个属性
         image = "#MenuSceneMoreGamesButton.png",
         x = display.left + ,                                               -- 设置图片位置的坐标相对于边和底的距离
         y = display.bottom + ,
         sound = GAME_SFX.tapButton,
         prepare = function()
             self.menu:setEnabled(false)　　　　　　　　　　　　　　　　　　　　　　 -- 关闭 menu 键的功能，防止在item作用的时候menu键也作用
         end,
         listener = function()
             app:enterMoreGamesScene()　　　　　　　　　　　　　　　　　　　　　　　　-- 此方法在MyApp.lua中
         end,
     })

     self.startButton = BubbleButton.new({
         image = "#MenuSceneStartButton.png",
         x = display.right - ,
         y = display.bottom + ,
         sound = GAME_SFX.tapButton,
         prepare = function()
             self.menu:setEnabled(false)
         end,
         listener = function()
             app:enterChooseLevelScene()
         end,
     })

     self.menu = ui.newMenu({self.moreGamesButton, self.startButton})
     self:addChild(self.menu)
 end

ctor 方法相当于构造函数，一旦new，就会调用ctor。

（信息条就是底下这个绿色的东西）

有用的信息：
display.width和display.height表示屏幕宽度
display.cx和display.cy表示屏幕的x轴中间位置和y轴中间位置
display.left和display.right表示屏幕的最左边和最右边(x轴坐标为0和display.width的点)
display.top和display.bottom表示屏幕的顶部和底部(y轴坐标为0和display.height的点）
display.CENTER、display.LEFT_TOP、display.CENTER_TOP等分别表示node的锚点位置。

ADBar.lua

 local AdBar = {}

 function AdBar.new()
     local sprite = display.newSprite("#AdBar.png")
     sprite:align(display.BOTTOM_CENTER, display.cx, display.bottom)
     return sprite
 end

 return AdBar

AdBar 是一个二次封装的精灵，new时，将自动创建并返回一个设置好精灵帧、锚点、X坐标和Y坐标的精灵。

（二次封装的目的除了外部的方便调用外，最大的动能就是代码的复用！所以可以预测到后面的编写中必定将会继续用到这个信息条）