quick-cocos2d-x 有哪些ui控件
发布网友
发布时间:2022-04-29 14:43
我来回答
共2个回答
热心网友
时间:2022-05-04 15:15
在Quick-Cocos2d-x之前的版本中使用的是菜单Menu,实现菜单的功能。在Quick-Cocos2d-x的v3.x版本中已经移除了菜单Menu,使用自己的封装Button实现菜单的功能。
按钮是一个项目中最基本的东西,因为你不论什么项目都缺少不了按钮。它是Quick中常见的UI控件。
UIButton
按钮Button是基于Node的封装,可以创建带图片的按钮或文本标签的按钮,添加到层Layer上显示。就像普通按钮一样,我们可以很方便的处理按钮事件,按钮的状态。设置背景和显示文字。
注:UIButton不直接使用
按钮的种类
Quick中有三种Button控件,分别是UIPushButton(按钮控件)、UICheckBoxButton(CheckButton控件)和UICheckBoxButtonGroup(CheckButton组控件)。它们是Quick封装的按钮控件, 源码文件分别位于Quick目录的/framework/cc/ui/目录下UIPushButton.lua/UICheckBoxButton.lua/UICheckBoxButtonGroup.lua。
事件
Quick-Cocos2d-x中的按钮控件支持如下的事件:
CLICKED 点击按钮 使用UIButton:onButtonClicked(callback)方法监听按钮的点击事件
PRESSED 按下按钮 使用UIButton:onButtonPressed(callback)方法监听按钮的按下事件
RELEASE 释放按钮 使用UIButton:onButtonRelease(callback)方法监听按钮的释放事件
STATE_CHANGED 状态改变(enable <---> disable) 使用UIButton:onButtonStateChanged(callback)方法监听按钮的状态改变事件
Quick中的各种按钮控件都支持上面的事件。我们可以通过响应的方法监听并处理相应的事件。
UIPushButton
UIPushButton就是我们常见的点击按下按钮,类似于常用的菜单。
UIPushButton是UIButton的子类,也是我们常用的Button。我们可以通过cc.ui.UIPushButton获取UIPushButton。
可以通过cc.ui.UIPushButton.new(images, options)方法创建一个按钮。
其中images是table类型,包含各个按钮状态下的图片。options为可选参数,table类型,包含是否scale9缩放,偏移flipX、flipY值等设置。
UIPushButton按钮的创建支持参数项为空的方式创建,然后在设置按钮各状态的图片,文字等。
代码示例:
下面代码创建了一个按钮,点击按钮触发相应的事件。
myButtonLayer.PUSH_BUTTON_IMAGES = {
normal = "button/Button01.png",
pressed = "button/Button01Pressed.png",
disabled = "button/Button01Disabled.png",
}
function myButtonLayer:createUIPushButton()
pushBtn = cc.ui.UIPushButton.new(myButtonLayer.PUSH_BUTTON_IMAGES, {scale9 = true})
:setButtonSize(240, 60) --设置大小
:setButtonLabel("normal", cc.ui.UILabel.new({
UILabelType = 2,
text = "This is a PushButton",
size = 18
}))-- 设置各个状态的按钮显示文字
:setButtonLabel("pressed", cc.ui.UILabel.new({
UILabelType = 2,
text = "Button Pressed",
size = 18,
color = cc.c3b(255, 64, 64)
}))
:setButtonLabel("disabled", cc.ui.UILabel.new({
UILabelType = 2,
text = "Button Disabled",
size = 18,
color = cc.c3b(0, 0, 0)
}))
:onButtonClicked(function(event) -- 按钮的clicked事件处理
print("pushButton click")
end)
:align(display.LEFT_CENTER, display.left + 80, display.top - 80) --设置位置 锚点位置和坐标x,y
:addTo(self)
end
上面代码使用三种按钮状态图片创建了一个UIPushButton类型的按钮,并设置了大小和显示文本标签。并通过onButtonClicked方法监听按钮的点击事件。
UICheckBoxButtonGroup
UICheckBoxButtonGroup是UICheckBoxButton组控件。用来创建类似radioButton。我们可以通过cc.ui.UICheckBoxButtonGroup获取UICheckBoxButtonGroup。
我们可以通过cc.ui.UICheckBoxButtonGroup.new(direction)方法创建UICheckBoxButton组控件。其中direction为integer类型,表示checkBox排列方向(可选的值有display.LEFT_TO_RIGHT/display.RIGHT_TO_LEFT/display.TOP_TO_BOTTOM/display.BOTTOM_TO_TOP)。创建完成后,可以使用addButton方法添加按钮,removeButtonAtIndex(index)移除指定index的按钮。
注:CheckBoxButton组控件,类似RadioButton.同一时刻只能有一个被选中