转载请注明出处:帘卷西风的专栏(http://blog.csdn.net/ljxfblog)
cocos2dx有checkbox和button,但是checkbox是个复选框,也没有table按钮,本文主要是利用这两个控件来实现单选框和table按钮的功能。
主要思路就是,通过响应checkbox和button的事件,来设置和他一组的其他控件的状态来达到我们需要的效果。
我的工作环境时cocos2dx3.2+lua。
首先看看checkbox的实现,我用来实现男女性别的选择。
local manCheck = self:getChild("CheckBox_Man")
local womanCheck = self:getChild("CheckBox_Woman")
if manCheck and womanCheck then
local function callback(sender, eventType)
if eventType == ccui.CheckBoxEventType.selected then
if sender == manCheck then
womanCheck:setSelectedState(false)
else
manCheck:setSelectedState(false)
end
elseif eventType == ccui.CheckBoxEventType.unselected then
if sender == manCheck then
womanCheck:setSelectedState(true)
else
manCheck:setSelectedState(true)
end
end
end
manCheck:addEventListener(callback)
womanCheck:addEventListener(callback)
manCheck:setSelectedState(true)
womanCheck:setSelectedState(false)
end
然后再来一个table按钮的实现。
先定义一些table的常量定义:
--定义常量
local Item_Tag_All = 1000
local Item_Tag_Equip = 1001
local Item_Tag_Material = 1002
local Item_Tag_Other = 1003
local ButtonSwitch =
{
[Item_Tag_All] = "全部",
[Item_Tag_Equip] = "装备",
[Item_Tag_Material] = "材料",
[Item_Tag_Other] = "其他",
}
然后创建按钮,并设置tag:
--筛选按钮
local width = title_bg:getContentSize().width
for tag = Item_Tag_All, Item_Tag_Other do
if ButtonSwitch[tag] then
local curbtn = ccui.Button:create()
curbtn:setTouchEnabled(true)
curbtn:setScale9Enabled(true)
curbtn:loadTextures(BTN__NORMAL, BTN_SELECTED, "", ccui.TextureResType.plistType)
curbtn:setSize(cc.size(100, 53))
local size = curbtn:getContentSize()
curbtn:setPosition(cc.p(width + size.width / 2, winSize.height - 20 - size.height / 2))
curbtn:setTitleText(ButtonSwitch[tag])
curbtn:setTitleFontSize(25)
curbtn:setTag(tag)
self._widget:addChild(curbtn)
--注册点击事件
local function callback_tag(sender, eventType)
if eventType == ccui.TouchEventType.ended then
showTable(tag)
end
end
curbtn:addTouchEventListener(callback_tag)
width = width + curbtn:getContentSize().width + 10
end
end
最后是显示按钮的规则,把同组的其他table设置成正常,选中的设置成高亮:
--显示一个table
function showTable(showTag)
for tag = Item_Tag_All, Item_Tag_Other do
local tagBar = self._widget:getChildByTag(tag)
if tagBar then
if showTag == tag then
tagBar:setBrightStyle(ccui.BrightStyle.highlight)
else
tagBar:setBrightStyle(ccui.BrightStyle.normal)
end
end
end
end
好了,分享完了。看看效果图吧!