Cocos2d-x进度条倒计时实现

素材:

实现:

//进度条背景
	CCSprite *progressbgSprite;
	progressbgSprite = CCSprite::create("time_slot-hd.png")	;
	progressbgSprite->setAnchorPoint(ccp(0,0));	//修改定点对应点
	progressbgSprite->setPosition(ccp(0, size.height-22));
	progressbgSprite->setScaleX(0.4f);
	progressbgSprite->setScaleY(0.7f);
	this->addChild(progressbgSprite, 1);
	progressbgSprite->setVisible(true);

	//进度条正面红条
	CCSprite *progressSprite = CCSprite::create("time_bars-hd.png");
	progress = CCProgressTimer::create(progressSprite);//创建进度条
	progress->setAnchorPoint(ccp(0,0));
	progress->setType(kCCProgressTimerTypeBar);	//中间为从左向右的进度条,类型为水平
	progress->setScaleX(0.4f);
	progress->setScaleY(0.7f);
	progress->setPosition(ccp(0,size.height-22));

	//进度动画运动方向
	progress->setMidpoint(ccp(0,0));
	//进度条宽高变化
	progress->setBarChangeRate(ccp(1,0)); //设置进度条为从左向右随进度增长而显现
	progress->setPercentage(100.0f);//值
	this->addChild(progress,1);
	progress->setVisible(true);

让进度条1秒减一点,直到为0

 void Game::update(float dt)
 {
	 int cu=progress->getPercentage(); //获取进度条的值
	 if (cu > 0)
	 {
		 cu=cu-1.0f;
		 progress->setPercentage(cu); //设置进度条的值
		 CCString *str = CCString::createWithFormat("%d",cu);
		 numsTTF->setString(str->getCString());//设置进度条上字的值
	 }
 }

结果:

Cocos2d-x进度条倒计时实现

时间: 2024-11-07 17:38:53

Cocos2d-x进度条倒计时实现的相关文章

基于jQuery漂亮的圆形进度条倒计时插件

jQuery Final Countdown是一款时尚的圆形进度条样式的jQuery倒计时插件.该倒计时插件可以显示倒计时的秒.分钟.小时和天数.它采用圆形进度条来作为倒计时的动画,非常的时尚大方. 在线预览   源码下载 使用方法 该倒计时插件依赖于jQuery和KineticJS-一个HTML5 Canvas库.使用是要将它们引入. <script type="text/javascript" src="js/jquery.min.js"></

几个Web前端经典使用的炫丽进度条(上)

1.  jQuery带圆形进度条倒计时 源码下载  /  在线演示 2. jQuery网站页面加载进度条 源码下载 /  在线演示 3.13款页面加载样式特效 源码下载/   在线演示 几个Web前端经典使用的炫丽进度条(上)

HTML5 canvas绘制倒计时+环形进度条

需求: 1.页面在进入时后台会提供一个固定时间和固定百分比,例如:18小时16分30秒,25%2.页面要求在进入时,有环形进度条从0推进到25%的效果,进度条旁的显示进度的黄色方块要始终保持跟随进度条最前方如图3.环形进度条中间计时器,要从获取到 具体时间后开始倒计时 设计图: JS代码如下: //补零function setDigit(num, n){ var str=''+num; if(str.length<n) { str='0'+str; } return str;}//设定时间fun

自定义圆形进度条 自定义倒计时进度条

自定义圆形进度条 自定义倒计时进度条 版权声明:转载必须注明本文转自严振杰的博客: http://blog.csdn.net/yanzhenjie1003 此控件源码已开源到Github:https://github.com/yanzhenjie/CircleTextProgressbar,欢迎Star. 欢迎加入我博客左侧的QQ交流群一起探讨. 效果预览 源代码传送门:https://github.com/yanzhenjie/CircleTextProgressbar 实现与原理 这个文字圆

页面效果:圆形进度条 环形进度条

环形进度条(1.5秒之内倒计时) 效果做的比较粗糙,就是css的 clip属性,先切右边一半,再切左边一半.根据三角函数计算y高度 http://www.w3school.com.cn/cssref/pr_pos_clip.asp css的clip属性 <script src="http://cdn.bootcss.com/jquery/1.12.1/jquery.min.js"></script> <script type="text/java

自定义圆形进度条

关于控件呢,我想大家应该都很熟悉了吧,android应用开发MVC架构中,控件担任着至关重要的作用,感觉可以说是基于控件的事件模型人机交互的基础吧.这种特性感觉在wpf开发中体现得更为直接,感兴趣的同学可以去了解一下.而android框架自身就已经给我们提供了很多控件.那么问题来了?为什么有那么多控件可以用,你还要去屑自定义控件呢?是因为大家闲的蛋疼吗?显然不是.个人认为只要有两方面吧,要么是觉得有些原生控件是在是丑得难以忍受(即使是在你已经自定义了他的shape,圆角,selector等一系列

1.CCProgressTo进度动作,条形进度条,扇形进度条

 1 Bar形进度 CCSprite * proBack = CCSprite::create("barback.png"); proBack->setPosition(ccp(winSize.width/2 - 100,winSize.height/2)); addChild(proBack); CCProgressTimer * left = CCProgressTimer::create(CCSprite::create("bar.png")); l

95秀-PK 动画 进度条 描边 圆角图片

PK界面 <?xml version="1.0" encoding="utf-8"?> <merge xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <Rela

iOS_31_cocos2d_Progress进度条

最终效果图: 进度条节点[CCProgressNode],构造时依赖一个Sprite 为[CCProgressNode]添加一个CCActionProgressFromTo动作 也可以在update方法中,更改[CCProgressNode]的percentage属性,实现进度条效果 [CCProgressNode]基本属性: [CCProgressNode]构造方法: 它的类型只有两种: 雷达和条形 进度条场景代码 // // ProgressScene.h // 31_cocos2D入门 /