quick-cocos2d-x游戏开发【5】——创建菜单

全栈程序员站长

发布于 2022-07-06 10:29:52

3160

发布于 2022-07-06 10:29:52

文章被收录于专栏：全栈程序员必看

大家好，又见面了，我是全栈君。

一个菜单是游戏中的一个基本要素，quick在里面menuItem有两个包。一个是图片菜单。一个文本菜单。

一个、图片菜单ui.newImageMenuItem(params)

參数：

image: 正常状态的button图像
imageSelected: button按下时的图像（可选）
imageDisabled: button被禁用时的图像（可选）
listener: 回调函数
tag: button的 Tag。会传入回调函数。多个button使用同一个回调函数时。可依据 Tag 区分哪一个button被按下（可选）
x, y: 坐标（可选）
sound: button按下时播放什么音效（可选）

对于params的參数名称是一定不能够写错。和上节中label一样，所以这个还是须要多敲几次记住一下。

tag是配合多个item共用一个回调函数来使用的，所以假设单独写一个function，记得有一个tag參数。

简单写一个图片button

local item1 = ui.newImageMenuItem({
    image = "CloseNormal.png",
    imageSelected = "CloseSelected.png",
    listener = onClicked,
    x = display.cx,
    y = display.height*0.7,
    tag = 1
})

二、文字菜单ui.newTTFLabelMenuItem(params)

文本button的參数许多。除了menuitem一些主要的參数外。还能够使用ui.newTTFLabel()中的參数。比如text文本内容。size文字大小等。

再写一个文字菜单

local item2 = ui.newTTFLabelMenuItem({
    text = "MenuItem",
    size = 50,
    aligh = ui.TEXT_ALIGN_CENTER,
    listener = onClicked,
    x = display.cx,
    y = display.height*0.3,
    tag = 2
})

和Cocos2dx一样，我们还是须要一个Menu大管家来管理这些menuItem，假设使用原来lua的写法。我们要addChild每个item，quick在这里把menu又一次封装，让其使用和c++的写法一样，这就方便非常多了。

local menu = ui.newMenu({item1, item2})
self:addChild(menu)

这样就加入完毕了，回调函数咱们还没说。我们再看下。

local function onClicked(tag)
    	if tag == 1 then
    		print("item1 clicked")
    	elseif tag == 2 then
    		print("item2 clicked")
    	end
end

因为这个function是局部（local）的，所以一定要放在menuItem之前。和C一样。否则程序会认不出该函数。

当然也能够直接在listener内部就写好回调函数，再创建一个item，

local item3 = ui.newTTFLabelMenuItem({
    text = "MenuItem2",
    size = 30,
    aligh = ui.TEXT_ALIGN_CENTER,
    listener = function ()
    	print("item3 clicked")
    end,
    x = display.cx,
    y = display.cy,
})

是不是so easy！

主要的使用就是这样，最后来一个完整的代码和效果。

function MyScene:ctor()
	local function onClicked(tag)
    	if tag == 1 then
    		print("item1 clicked")
    	elseif tag == 2 then
    		print("item2 clicked")
    	end
	end

	local item1 = ui.newImageMenuItem({
	    image = "CloseNormal.png",
	    imageSelected = "CloseSelected.png",
	    listener = onClicked,
	    x = display.cx,
	    y = display.height*0.7,
	    tag = 1
	})

	local item2 = ui.newTTFLabelMenuItem({
	   	text = "MenuItem",
	   	size = 50,
	   	aligh = ui.TEXT_ALIGN_CENTER,
	    listener = onClicked,
	    x = display.cx,
	    y = display.height*0.3,
	    tag = 2
	})

	local item3 = ui.newTTFLabelMenuItem({
	   	text = "MenuItem2",
	   	size = 30,
	   	aligh = ui.TEXT_ALIGN_CENTER,
	    listener = function ()
	    	print("item3 clicked")
	    end,
	    x = display.cx,
	    y = display.cy,
	})

	local menu = ui.newMenu({item1, item2, item3})
	self:addChild(menu)

end

效果例如以下，