【唠叨】

开关类CCControlSwitch继承于控件类CCControl。

控件类CCControl主要向子类提供了一系列的控件触发事件。当子控件触发相关的事件后，就会执行相关的控件事件回调函数。这与之前讲的CCMenu中的菜单按钮回调是类似的。

控件类CCControl主要有三个子类：

（1）开关控件CCControlSwitch

（2）滑块控件CCControlSlider

（3）按钮控件CCControlButton

本节讲的是其子类其中之一：开关类CCControlSwitch。

【Demo下载】

https://github.com/shahdza/Cocos_LearningTest/tree/master/demo_%E5%BC%80%E5%85%B3%E6%8C%89%E9%92%AECCControlSwitch

【3.x】

（1）去掉 “CC”

（2）对象类 CCObject 改为 Ref

（3）标签类LabelTTF 改为 Label

（4）CCControlEvent 改为强枚举 Control::EventType

（5）CCControlEventValueChanged改为Control::EventType::VALUE_CHANGED

（6）按钮事件回调依旧为 cccontrol_selector ，没有使用 CC_CALLBACK_2

（7）关于创建函数create，必须引起注意！

> 这是3.x的一个BUG。

////v3.x会报错，必须指定onLabel、offLabel。不能为nullptrcreate(Sprite*maskSprite,Sprite*onSprite,Sprite*offSprite,Sprite*thumbSprite);//v3.x版本中，必须使用这个来创建create(Sprite*maskSprite,Sprite*onSprite,Sprite*offSprite,Sprite*thumbSprite,Label*onLabel,Label*offLabel);//

（9）其他地方几乎无变化。

【CCControlSwitch】

开关控件CCControlSwitch，应该也是很常见的UI控件，想必大家都不陌生。比如声音开关的控制，一些功能的启用与禁用都需要用到开关控件。

1、CCControl主要向开关类CCControlSwitch提供了以下控件事件

//CCControlEventValueChanged//当控件的值发生改变时触发。//

2、绑定控件事件的方法

////绑定控件事件//addTargetWithActionForControlEvents(this,cccontrol_selector(HelloWorld::valueChanged),CCControlEventValueChanged);voidaddTargetWithActionForControlEvents(CCObject*target,SEL_CCControlHandleraction,CCControlEventcontrolEvents);//删除控件事件//removeTargetWithActionForControlEvents(this,cccontrol_selector(HelloWorld::valueChanged),CCControlEventValueChanged);voidremoveTargetWithActionForControlEvents(CCObject*target,SEL_CCControlHandleraction,CCControlEventcontrolEvents);//

3、需要引用以下头文件及命名空间

//#include"cocos-ext.h"//包含cocos-ext.h头文件usingnamespacecocos2d::extension;//引用cocos2d::extension命名空间//

4、常用操作

//classCCControlSwitch:publicCCControl{/***创建CCControlSwitch的两种方式*///CCControlSwitch::create("底图","打开状态图","关闭状态图","拨动开关图");//v3.x会报错，必须指定onLabel、offLabelstaticCCControlSwitch*create(CCSprite*maskSprite,CCSprite*onSprite,CCSprite*offSprite,CCSprite*thumbSprite);//CCControlSwitch::create("底图","打开状态图","关闭状态图","拨动开关图","打开状态文字","关闭状态文字");staticCCControlSwitch*create(CCSprite*maskSprite,CCSprite*onSprite,CCSprite*offSprite,CCSprite*thumbSprite,CCLabelTTF*onLabel,CCLabelTTF*offLabel);/***设置开关状态*setOn,isOn,hasMoved,setEnabled*/voidsetOn(boolisOn);//设置开关状态voidsetOn(boolisOn,boolanimated);//设置开关状态boolisOn(void){returnm_bOn;}//获取开关状态boolhasMoved(){returnm_bMoved;}//获取当前开关是否为手动拨动开关（区别于点击拨动）virtualvoidsetEnabled(boolenabled);//设置开关是否能操作};//

【代码实战】

1、资源图片

第一组开关：

第二组开关：

2、引入文件和命名空间

//#include"cocos-ext.h"usingnamespacecocos2d::extension;//

3、在HelloWorld.h中声明控件回调函数、显示开关的状态Label

//CCLabelTTF*label;//用于显示开关控件的状态ON/OFFvoidvalueChanged(CCObject*sender,CCControlEventcontrolEvent);//当值改变时触发的控件事件//

4、在HelloWorld.cpp中分别创建两种方式的开关控件

////第一组开关CCSprite*bg1=CCSprite::create("ControlSwith_bg.png");CCSprite*on1=CCSprite::create("ControlSwith_on.png");CCSprite*off1=CCSprite::create("ControlSwith_off.png");CCSprite*thumb1=CCSprite::create("ControlSwith_thumb.png");CCControlSwitch*controlSwitch2=CCControlSwitch::create(bg1,on1,off1,thumb1);controlSwitch2->setPosition(midPos-ccp(100,100));this->addChild(controlSwitch2);//绑定事件，当开关控件的值发生改变时触发事件。controlSwitch2->addTargetWithActionForControlEvents(this,cccontrol_selector(HelloWorld::valueChanged),CCControlEventValueChanged);//第二组开关CCSprite*bg2=CCSprite::create("switch-mask.png");CCSprite*on2=CCSprite::create("switch-off.png");CCSprite*off2=CCSprite::create("switch-on.png");CCSprite*thumb2=CCSprite::create("switch-thumb.png");CCLabelTTF*TTFon=CCLabelTTF::create("on","Arial",20);CCLabelTTF*TTFoff=CCLabelTTF::create("off","Arial",20);CCControlSwitch*controlSwitch3=CCControlSwitch::create(bg2,on2,off2,thumb2,TTFon,TTFoff);controlSwitch3->setPosition(midPos-ccp(-100,100));this->addChild(controlSwitch3);//

5、实现控件回调函数

////事件响应函数，值改变时，修改label标签的内容voidHelloWorld::valueChanged(CCObject*sender,CCControlEventcontrolEvent){//获取事件的传递者CCControlSwitchCCControlSwitch*controlSwitch=(CCControlSwitch*)sender;//根据开关控件的状态，设置label标签的内容if(controlSwitch->isOn()){label->setString("ON");}else{label->setString("OFF");}}//

6、运行结果

7、分析与总结

（1）是不是感觉第一组的按钮有点奇怪？开关和底图没有完全覆盖，另外开状态的图片和关状态的图片也没有完全消失。呵呵

（2）第二组开关按钮的效果比较好，所以你应该明白为啥我选了两组不同的图片来创建两种开关控件了吧？