Question

quick-cocos2d-x 有哪些ui控件？

Answer 1

在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.同一时刻只能有一个被选中