cocos2dx基础篇(21) 进度条CCProgressTimer
【3.x】
(1)去掉 “CC”
(2)CCProgressTimerType 改为强枚举 ProgressTimer::Type::
//
RADIAL //扇形进度计时器
BAR //条形进度计时器
//
1、进度动作CCProgressTo、CCProgressFromTo
在讲解进度条CCProgressTimer之前,先讲讲和进度条有半毛线关系的两个动作类:
(1)CCProgressTo (2)CCProgressFromTo
为什么在之前的基本动作CCAction那章不介绍,而放在这里进行介绍呢?这是因为,这两个动作只是针对CCProgressTimer而言的,对其他的CCNode子类(如:CCSprite)没啥用处。
从这两个动作的字面上,也可以看出他们的用处了吧?就是进度条的进度从 a% 变化到 b% 。
使用方法如下:
//
//几秒内从0%变化到指定进度
CCProgressTo::create('时间', '变化到百分之几');
//几秒内从a%进度变化到b%进度
CCProgressFromTo::create('时间', '从百分之几', '变化到百分之几');
//
2、CCProgressTimer
CCProgressTimer就是拿一张CCSprite精灵图片来作为进度条,然后根据一个百分比属性,实现显示/隐藏图片的一部分区域,达到图形化显示进度的作用。
进度条有两种样式:扇形进度条、条形进度条。默认锚点(0.5,0.5)。
常用操作如下:
//
class CCProgressTimer : public CCNodeRGBA
{
/**
* 创建方法 create
*/
//精灵图片作为进度条
CCProgressTimer::create(CCSprite* sp);
/**
* 属性设置
* setSprite , setPercentage , setType
*/
//设置进度条所使用的精灵图片
void setSprite(CCSprite *pSprite);
CCSprite* getSprite();
//设置进度百分值[0,100]
void setPercentage(float fPercentage);
float getPercentage();
//设置进度条样式
// kCCProgressTimerTypeRadial 扇形进度计时器
// kCCProgressTimerTypeBar 条形进度计时器
void setType(CCProgressTimerType type);
CCProgressTimerType getType();
//反进度显示
//条形:从100到0。
//扇形:false顺时针,true逆时针
void setReverseProgress(bool reverse);
/**
* 进度条设置
* setMidpoint , setBarChangeRate
*/
//设置进度条起始的中心位置,范围[0,1](默认图片中点ccp(0.5,0.5))
void setMidpoint(CCPoint);
CCPoint getMidpoint();
//用于做进度条所占的图片比例
void setBarChangeRate(CCPoint);
CCPoint getBarChangeRate();
/**
* 父类继承
* setAnchorPoint , setColor , setOpacity
*/
//设置锚点
void setAnchorPoint(CCPoint anchorPoint);
//设置颜色
virtual void setColor(const ccColor3B& color);
virtual const ccColor3B& getColor() const;
//设置透明度
virtual void setOpacity(GLubyte opacity);
virtual GLubyte getOpacity() const;
};
//
3、setMidpoint
setMidpoint是用来设置进度条的起始中心位置的。
(1)对于扇形进度条:相当于“圆心”,从0到100,慢慢展开扇形。
(2)对于条形进度条:相当于从某点向两边扩散。
3、setBarChangeRate
setBarChangeRate是用于设置条形进度条所占的图片比例,对于扇形是无效的。
下列三组图解中,黄颜色区域表示一开始就已经显示的图片区域。而ccp(x,y):表示宽度还有 x 比例的图片还未显示,高度还有 y 比例的图片还未显示,用作显示进度条。
有下图可知,“进度百分值”是相对剩余ccp(x,y)用作显示进度条的那一部分,已经显示的百分率,而不是整张图片的百分率。
常用方式如下:
//
setBarChangeRate( ccp(1,0) ) : //只有X轴变化。 (起始X轴不显示)
setBarChangeRate( ccp(0,1) ) : //只有Y轴变化。 (起始Y轴不显示)
setBarChangeRate( ccp(1,1) ) : //X,Y轴都变化。(起始X,y轴都不显示)
setBarChangeRate( ccp(0.5,0.5) ): //X,Y轴都变化。(起始X,y轴都已显示一半)
//
三组图片对比图:
4、常用的进度条方式
由上面的讲解可以得出,进度条的显示方式主要受三个设置的影响:
(1)setType :扇形、条形进度条。
(2)setMidpoint :中心位置。
(3)setBarChangeRate:用作条形进度条显示的图片所占比例。
其中(1)的设置决定了进度条的类型。而(2)(3)的配合使用可以有多种不同的显示方式。
常用的(2)(3)配合使用方式如下:
//
//当条形进度条样式为:setBarChangeRate( ccp(1,0) )
ccp(1,0): "从右到左显示"
ccp(0.5,0): "从中间到两边显示"
ccp(0,0): "从左到右显示"
//当条形进度条样式为:setBarChangeRate( ccp(0,1) )
ccp(0,1): "从上到下显示。"
ccp(0,0.5): "从中间到两边显示。
ccp(0,0): "从下到上显示。"
//当条形进度条样式为:setBarChangeRate( ccp(1,1) )
ccp(0,1): "X从左到右显示, Y从上到下显示"
ccp(0,0.5): "X从左到右显示, Y从中间到两边显示"
ccp(1,0): "X从右到左显示, Y从下到上显示"
ccp(0.5,0): "X从中间到两边显示,Y从下到上显示"
ccp(0,0): "X从左到右显示, Y从下到上显示"
ccp(0.5,0.5): "X从中间到两边显示,Y从中间到两边显示"
ccp(1,1): "X从右到左显示, Y从上到下显示"
//
【代码实战】
1、资源图片
2、创建两类进度条:条形、扇形
并定义进度条显示方式。
//
//条形进度条pro1
CCSprite* bg1 = CCSprite::create("Icon.png");
CCProgressTimer* pro1 = CCProgressTimer::create(bg1);
pro1->setPosition( ccp(130, 100) );
this->addChild(pro1);
//条形,定义进度条方式:从右到左显示
pro1->setType(kCCProgressTimerTypeBar);
pro1->setBarChangeRate( ccp(1, 0) );
pro1->setMidpoint( ccp(1, 0) );
//pro1->setReverseProgress(true); //反进度显示
//扇形进度条pro2
CCSprite* bg2 = CCSprite::create("Icon.png");
CCProgressTimer* pro2 = CCProgressTimer::create(bg2);
pro2->setPosition( ccp(350, 100) );
this->addChild(pro2);
//扇形,圆心ccp(0.3 , 0.7)
pro2->setType(kCCProgressTimerTypeRadial);
pro2->setMidpoint( ccp(0.3, 0.7) );
//pro2->setReverseProgress(true); //逆时针
//
3、创建进度动作CCProgressTo、CCProgressFromTo
并让pro1、pro2分别执行两个进度动作。
//
//进度动作
CCProgressTo* ac1 = CCProgressTo::create(2.0f, 100);
CCProgressFromTo* ac2 = CCProgressFromTo::create(2.0f, 30, 100);
pro1->runAction( CCRepeatForever::create(ac1) ); //2秒内,从0到100
pro2->runAction( CCRepeatForever::create(ac2) ); //2秒内,从30到100
//
4、运行结果
若添加反进度显示setReverseProgress()
//
pro1->setReverseProgress(true); //反进度显示
pro2->setReverseProgress(true); //逆时针
//
结果如下:
cocos2dx基础篇(21) 进度条CCProgressTimer的更多相关文章
- [Cocos2d-x For WP8]Progress 进度条
Cocos2d-x可以有多种进度条的展示方式,进度条的种类是根据进度条运动的方向来区分,包括顺时针,逆时针,从左到右,从右到左,从下到上和从上到下6种方式,这和WP8的进度条是由很大的区别的.那么Co ...
- cocos2dx基础篇(3) 常用重要类
---------------------------------------- 入口类main.cpp 主要控制类AppDelegate.cpp -------------------------- ...
- Android自定义控件系列之应用篇——圆形进度条
一.概述 在上一篇博文中,我们给大家介绍了Android自定义控件系列的基础篇.链接:http://www.cnblogs.com/jerehedu/p/4360066.html 这一篇博文中,我们将 ...
- 递增和递减进度条CCProgressTimer
关于scheduleUpdate看这篇即可 http://www.benmutou.com/blog/archives/56 接下来是示例代码: CCSize size = CCDirector::s ...
- 【Cocos2d入门教程二】Cocos2d-x基础篇
上一章已经学习了环境的搭建.这一章对基础概念进行掌握.内容大概有: 1.导演 2.场景 3.节点 4.层 4.精灵 1.导演(Director) 导演存在的主要作用: a.环境设定(帧率 初始化ope ...
- cocos2dx基础篇(23) 粒子系统CCParticleSystem
[3.x] (1)去掉"CC" (2)粒子位置模式 tPositionType 改为强枚举类型 ParticleSystem::PositionType:: // ...
- cocos2dx基础篇(22) 基本动画CCAnimation/CCAnimate
[小知识] CCSpriteFrame :精灵帧. 它是相对动画而产生的,其实就是一张纹理图片. CCAnimationFrame :动画帧. 由精灵帧与间隔帧数组成,是动画CC ...
- cocos2dx基础篇(6) 定时器schedule/update
定时器在大部分游戏中是不可或缺的,即每隔一段时间,就要执行相应的刷新体函数,以更新游戏的画面.时间.进度.敌人的指令等等.cocos2dx为我们提供了定时器schedule相关的操作.其操作函数的定义 ...
- cocos2dx基础篇(16) 基本绘图DrawPrimitives
[3.x] (1)去掉前缀 "cc" (2)将 ccDraw***() 封装到了 DrawPrimitives 命名空间中. (3)重写绘图函数: draw(Ren ...
随机推荐
- Binary Numbers AND Sum CodeForces - 1066E (前缀和)
You are given two huge binary integer numbers aa and bb of lengths nn and mmrespectively. You will r ...
- VS2013 删除"附加依赖项"中“继承的值”
经过好几次尝试,都无法在VS2013中直接删除“继承的值”,于是另辟蹊径,找到了一种解决方法. 相对而言,在 VS2010 中干这件事会容易一点,或者说,成功率更高一点,于是,我的思路就是再装一个 V ...
- Redhat 关闭防火墙和selinux
查看防火墙状态.systemctl status firewalld 临时关闭防火墙命令.重启电脑后,防火墙自动起来.systemctl stop firewalld 永久关闭防火墙命令.重启后,防火 ...
- shiro框架学习-7- Shiro权限控制注解和编程方式
讲解权限角色控制 @RequiresRoles, @RequiresPermissions等注解的使用和编程式控制 配置文件的方式 使用ShiroConfig 注解方式 @RequiresRoles( ...
- 14. ClustrixDB 高可用性的最佳实践
本文档详细介绍了最大化ClustrixDB上运行的应用程序正常运行时间的最佳实践.这涵盖了广泛的主题,从环境需求到变更管理程序,所有这些最终都会影响应用程序的可用性.其中许多是您可能已经熟悉的标准最佳 ...
- springmvc/springboot开发restful API
非rest的url写法: 查询 GET /user/query?name=tom 详情 GET /user/getinfo? 创建 POST /user/create?name=tom 修改 POST ...
- 全方面了解和学习PHP框架 PHP培训教程
PHP成为最流行的脚本语言有许多原因:灵活性,易用性等等.对于项目开发来说,我们通常需要一个PHP框架来代替程序员完成那些重复的部分.本文,兄弟连将对PHP框架进行全面解析. PHP框架是什么? PH ...
- prometheus-pushgateway安装
背景 当prometheus的server与target不在同一网段网络不通,无法直接拉取target数据,需要使用pushgateway作为数据中转点. 弊端 将多个节点数据汇总到 pushgate ...
- js for循环中i++与++i有什么区别
平时都是这样写的for循环, 1 2 3 for(var i = 0; i < 20 ; i++){ .... } 但我看有的人这样写 for (var i = 0; ...
- 地图服务 纬度、经度对应坐标轴x,y
记下,供自己参考,中国地区的经纬度,经度大,纬度小 如上海经纬度为:(经度, 纬度)(y, x)(lon, lat) 121.48 31.22 纬度---lat----x轴 经度---lon---y轴