quick-cocos2d-x button使用方法

demo中给出了以下几种按钮

1 普通按钮(pushbutton)

2 复选框(checkbox_button)

3 单选框(radio_button)

官网上还没有这些函数的api说明,看demo吧

1 cc.ui.UIPushButton

此按钮纹理有三态 nomal, pressed, disabled

目前看来有2种创建方式

1 local btn = cc.ui.UIPushButton.new('btn.png', {scale9 = false})
2 local btn = cc.ui.UIPushButton.new({'nomal.png', 'pressed.png', 'disabled.png'}, 
                                      scale9 = true)

这两种方式的不同在于第二种方式包含三态,第1种方式只有一态.

按钮创建好了,接下来看它的方法

btn:setButtonSize(wdith, height)                --设置按钮的大小
btn:setButtonLabel('state', cc.ui.UILabel)      --设置按钮文字,第一个状态即纹理三态的英文,第二个参数可设置字体,颜色,大小
btn:onButtonPressed(function(event)             --按钮按下回调函数
    local label = event.target:getButtonLabel()
    label::setColor(display.COLOR_RED)
end)
btn:onButtonRelease(function(event)             --按钮释放回调函数
    local label = event.target:getButtonLabel()
    label::setColor(display.COLOR_BLUE)    
end)
btn:onButtonClicked(function(event)             --点击按钮回调函数
    local button = event.target                 --event.target即按钮对象
end)
btn:setButtonEnabled(false)                     --设置按钮状态
btn:setButtonLabelString("disabled", "text...") --仅设置按钮文字
btn:align(anchorpoing, x, y)                    --设置对齐方式和位置
btn:getButtonLabel()                            --获取按钮的cc.ui.UILable对象
btn:setButtonLabelAlignment(anchorpoint)        --设置按钮文字的对齐方式
btn:setButtonLabelOffset(x, y)                  --设置按钮文字的x,y偏移

以上便是从demo中kiang出来的方法和属性

checkbox_button, radio_button实质上都是 checkbox,不过radio_button多了个group的概念.

checkbox的标准纹理有6态

off, off_pressed, off_disabled, on, on_pressed, on_disabled.

最简单的是2态

off, on

创建一个checkbox_button

chkbox = cc.ui.UICheckBoxButton.new({})          --中间的{}是几态的纹理路径

按钮的方法对checkbox_button也适用,这里就不重复了.

即使任何方法都不写,chkbox也可以在界面上正常的工作.

它自动的方法有:

chkbox:isButtonSelected()                        --该checkbox是否为on状态
chkbox:setButtonSelected(bool)                   --设置checkbox的选择状态
chkbox:onButtonSelectChanged(function(event)     --checkbox的点击
end)

创建一组radio_button,首先创建一个group,然后在group中创建checkbox

--创建一个group
local group = cc.ui.UICheckBoxButtonGroup.new(
                  display.TOP_TO_BOTTOM)                     
:addButton(cc.ui.UICheckBoxButton.new({})               -- 在group中添加第一个radio_button
    :setButtonLabel()
    :setButtonLabelOffset(20, 0)
    :align(display.LEFT_CENTER))
:addButton(cc.ui.UICheckBoxButton.new({})               -- 在group中添加第二个radio_button
    :setButtonLabel()
    :setButtonLabelOffset(20, 0)
    :align(display.LEFT_CENTER))
 :setButtonsLayoutMargin(10, 10, 10, 10)                -- 此四个参数为top, right, bottom, left,设置group中每个按钮的边缘位置
    :onButtonSelectChanged(function(event)
        printf("Option %d selected, 
               Option %d unselected", event.selected, event.last)
    end)

group的方法有

group:onButtonStateChanged(function(event)      -- 单击按钮变化时回调
     
end)
group:getButtonAtIndex(1)                       -- group设置当前按钮的索引,下标从1开始,返回值为cc.ui.UICheckBoxButton
group:removeButtonAtIndex(2)                    -- group删除当前索引的按钮