cocos2dx基础篇(9) 滑块控件CCControlSlider
【3.x】
(1)去掉 “CC”
(2)对象类 CCObject 改为 Ref
(3)CCControlEvent 改为强枚举 Control::EventType
(4)CCControlEventValueChanged 改为 Control::EventType::VALUE_CHANGED
(5)按钮事件回调依旧为 cccontrol_selector ,没有使用 CC_CALLBACK_2
(6)其他地方几乎无变化。
滑块控件CCControlSlider,应该也是很常见的UI控件,想必大家都不陌生。
比如调节音量的大小:
1、CCControl主要向滑块类CCControlSlider提供了以下控件事件
//
CCControlEventValueChanged //当控件的值发生改变时触发。
//
2、绑定控件事件的方法
//
//绑定控件事件
//addTargetWithActionForControlEvents(this, cccontrol_selector(HelloWorld::valueChanged), CCControlEventValueChanged);
void addTargetWithActionForControlEvents(CCObject* target, SEL_CCControlHandler action, CCControlEvent controlEvents);
//删除控件事件
//removeTargetWithActionForControlEvents(this, cccontrol_selector(HelloWorld::valueChanged), CCControlEventValueChanged);
void removeTargetWithActionForControlEvents(CCObject* target, SEL_CCControlHandler action, CCControlEvent controlEvents);
//
3、需要引用一下的文件及命名空间
//
#include "cocos-ext.h" //包含cocos-ext.h头文件
using namespace cocos2d::extension; //引用cocos2d::extension命名空间
//
4、常用操作
//
class CCControlSlider: public CCControl
{
/**
* 创建CCControlSlider的两种方式
*/
//用CCSprite精灵创建滑块控件
//create("滑块背景图", "划过区域图", "滑块图");
static CCControlSlider* create(CCSprite* backgroundSprite, CCSprite* pogressSprite, CCSprite* thumbSprite);
//直接用图片资源名创建,省去了创建精灵的步骤
//实际上,在其内部依旧是调用上面的create函数创建CCSprite精灵
//create("滑块背景图", "划过区域图", "滑块图");
static CCControlSlider* create(const char* bgFile, const char* progressFile, const char* thumbFile);
/**
* 属性设置
* setValue ,
* setMinimumValue , setMaximumValue
* setMinimumAllowedValue , setMaximumAllowedValue ,
* setBackgroundSprite , setProgressSprite , setThumbSprite
*/
float setValue() | getValue(); //设置当前滑块的值
float setMinimumValue() | getMinimumValue(); //设置滑块最小值
float setMaximumValue() | getMaximumValue(); //设置滑块最大值
float setMinimumAllowedValue() | setMinimumAllowedValue(); //设置允许滑动的最小值
float setMaximumAllowedValue() | setMaximumAllowedValue(); //设置允许滑动的最大值
//设置滑块的背景图、划过区域图、滑块图
//CC_SYNTHESIZE_RETAIN为宏定义:除了创建了set/get以外,还用了retain来保留内存资源。
CC_SYNTHESIZE_RETAIN(CCSprite*, m_backgroundSprite, BackgroundSprite);
CC_SYNTHESIZE_RETAIN(CCSprite*, m_progressSprite, ProgressSprite);
CC_SYNTHESIZE_RETAIN(CCSprite*, m_thumbSprite, ThumbSprite);
};
//
5、滑块的值、最值、允许最值解析
假设滑块的属性值设置如下:
Value = 40;
MinimumValue = 0; MaximumValue = 100;
MinimumAllowedValue = 20; MaximumAllowedValue = 80;
那么滑块只能在Allowed的最小值和最大值之间滑动,即[20,80]的数值之间滑动。
【代码实战】
1、资源图片
2、引入文件和命名空间
//
#include "cocos-ext.h" //包含cocos-ext.h头文件
using namespace cocos2d::extension; //引用cocos2d::extension命名空间
//
3、在HelloWorld.h中声明控件回调函数、显示滑块数值的Label
//
CCLabelTTF* label; //显示滑块数值的Label
void valueChanged(CCObject* sender, CCControlEvent controlEvent); //当值改变时触发的控件事件
//
4、在HelloWorld.cpp中创建滑块控件,并绑定ValueChanged控件事件
//
//创建显示Slider值的标签
label = CCLabelTTF::create("50.0", "Arial", 32);
label->setPosition( midPos + ccp(0, 100) );
this->addChild(label);
//创建滑块控件CCControlSlider
CCControlSlider* slider = CCControlSlider::create("sliderTrack.png", "sliderProgress.png", "sliderThumb.png");
slider->setPosition( midPos );
this->addChild(slider);
//设置属性
slider->setMinimumValue(0); //设置滑块最小值
slider->setMaximumValue(100); //设置滑块最大值
slider->setMinimumAllowedValue(20); //设置允许滑动的最小值
slider->setMaximumAllowedValue(80); //设置允许滑动的最大值
slider->setValue(50); //设置当前滑块的值
//绑定事件,当滑块的值改变时触发控件事件
slider->addTargetWithActionForControlEvents(this, cccontrol_selector(HelloWorld::valueChanged), CCControlEventValueChanged);
//
5、实现控件回调函数
//
//事件响应函数,值改变时,修改label标签的内容
void HelloWorld::valueChanged(CCObject* sender, CCControlEvent controlEvent)
{
//获取事件委托者:滑块控制CCControlSlider
CCControlSlider* slider = (CCControlSlider*)sender;
//修改label的值,显示滑块的当前值
//sprintf为C语言中的字符串格式转换,这里将float转换为字符串
char str[50];
sprintf(str, "%f", slider->getValue() ); //字符串格式转换
label->setString(str);
}
//
6、运行结果
7、分析与总结
滑块只能在Allowed的最值之间滑动。
当然最值不一定要设置0~100,也可以设置其他的值,要看是什么用途了。
cocos2dx基础篇(9) 滑块控件CCControlSlider的更多相关文章
- cocos2dx基础篇(10) 按钮控件CCControlButton
[3.x] (1)去掉 “CC” (2)对象类 CCObject 改为 Ref (3)按钮事件回调依旧为 cccontrol_selector ,没有使用 CC_CALLBACK_2 (4)按钮状态 ...
- 滑块控件CCControlSlider
#include "cocos-ext.h" //包含头文件 using namespace cocos2d::extension;//引用命名空间 /** * 创建CCContr ...
- iOS开发基础篇-手写控件
一.手写控件的步骤 1)使用相应的控件类创建控件对象: 2)设置该控件的各种属性: 3)添加空间到视图中: 4)如果是 UIButton 等控件,还需考虑控件的单击事件等: 二.添加 UIButton ...
- cocos2d-x拖动滑块控件CCControlSlider
#include "GameMusicSetting.h" bool GameMusicSetting::init() { if(!CCLayer::init()) { retur ...
- iOS 9应用开发教程之使用开关滑块控件以及滚动部署视图
iOS 9应用开发教程之使用开关滑块控件以及滚动部署视图 使用ios9中的开关.滑块控件 开关和滑块也是用于和用户进行交互的控件.本节将主要讲解这两种控件. ios9开关 开关控件常用来控制某个功能的 ...
- WPF滑块控件(Slider)的自定义样式
前言 每次开发滑块控件的样式都要花很久去读样式代码,感觉有点记不牢,所以特此备忘. 自定义滑块样式 首先创建项目,添加Slider控件. 然后获取Slider的Window样式,如下图操作. 然后弹出 ...
- winform快速开发平台 -> 基础组件之分页控件
一个项目控件主要由及部分的常用组件,当然本次介绍的是通用分页控件. 处理思想:我们在处理分页过程中主要是针对数据库操作. 一般情况主要是传递一些开始位置,当前页数,和数据总页数以及相关关联的业务逻辑. ...
- Cocos2dx中的四种控件及主要用法
1.控件:即控制对象,控制按钮之类的精灵 2.主要介绍四大类控件: CCControlSlider:进度条 CCControlSwitch:开关 CCScale9Sprite:9妹图(用于缩放) CC ...
- 重新想象 Windows 8 Store Apps (16) - 控件基础: 依赖属性, 附加属性, 控件的继承关系, 路由事件和命中测试
原文:重新想象 Windows 8 Store Apps (16) - 控件基础: 依赖属性, 附加属性, 控件的继承关系, 路由事件和命中测试 [源码下载] 重新想象 Windows 8 Store ...
随机推荐
- VMware虚拟机中的CentOS7安装Nginx后本机无法访问的解决办法
VMware虚拟机中的CentOS7安装Nginx后本机无法访问的解决办法 在linux上安装nginx 请参考:Linux Centos7 安装 nginx 在虚拟机centos7上安装nginx之 ...
- java课堂动手测试2
测试一 编写一个方法,使用以上算法生成指定数目(比如1000个)的随机整数. 程序源代码 import java.util.Random;import java.util.Scanner; publi ...
- 在vue-cli中使用px2rem,配合lib-flexible使用
原文地址 附上github源码 看这里 1.下载lib-flexible npm安装 npm i lib-flexible --save 2.引入lib-flexible 在main.js中引入li ...
- 《Python3-标准库》讲解
一.string:文本常量和模板 函数:capwords()-------------------------------------------------- import string s = ...
- springboot项目作为其他项目子项目
<?xml version="1.0"?> <project xsi:schemaLocation="http://maven.apache.org/P ...
- Linux下lazarus交叉编译 win32[win64]
环境 vmvare + deepin Linux64 + lazarus2.0.6 参考:https://wiki.freepascal.org/Cross_compiling_for_Win32_u ...
- mybatis config 配置设置说明
<!– 配置设置 –> 2. <settings> 3. <!– 配置全局性 cache 的 ( 开 / 关) defau ...
- Buffer转成字符串
如果data为buffer格式,则: data.toString()
- 视图:setContentView()
1.setContentView的作用是将View加载到根view之上,这样当显示view时,先显示根view,然后在显示子view,以此类推,最终将所有view显示出来. 2.setContentV ...
- T3
T3构造图