cocos2d-x 模拟IOS时间选择器效果

原创文章,欢迎转载!转载请注明:转载自Cocos2D开发网--Cocos2Dev.comspa

原文连接地址:cocos2d-x 模拟IOS时间选择器效果code

IOS 的时间选择期UIDatePicker效果挺不错,像之类的效果均可以用它实现,我业余写的游戏中要用到一个这样的选择期,网上找了下也没找到什么。就本身模拟的写了个。orm

这是效果图:(呵呵,我不会画图,素材是扒的国外的一个游戏,游戏尚未写完。只能截部分图)游戏

实现原理:事件

能滚动的两个控件就是两个CCSprite。里面可以滚动的图片是一个很长的图,也就是从上到下有1,2,3,4,5,6,7,8,9,10,1 ,共11个数字。图片

首尾同样为了循环的时候无缝链接。也就是两个1叠到一块儿。想象成一片字条,两个1重叠后就是一个1-10的圈。开发

这样我只须要不停的绘制这个圈的一部分就是实现转动了。get

实现代码:string

一、建立一张很长的图的Texture,it

1 CCTexture2D*m_diceNumsTexture = CCTextureCache::sharedTextureCache()->addImage("dicenums.png");

二、建立一个Sprite,显示第一步的一部分图

1 floatscollDiceNumValue = 0.0f;
2
3 CCSprite* diceNum = CCSprite::spriteWithSpriteFrame(CCSpriteFrame::frameWithTexture(m_diceNumsTexture, cocos2d::CCRectMake(0, scollDiceNumValue, 58, 82)));
4
5 diceNum->setTag(tag_choose_dice_num);
6
7 //设置坐标,添加到场景

三、手指滑动的时候,不停的绘制上面的Sprite,

在move事件中获得手指当前一帧和上一帧的位置的差值scollValue。而后在schedule中调用下面的代码:

scollDiceNumValue += scollValue;

if (scollDiceNumValue<0) {

scollDiceNumValue=492;//若是滑到1还想日后滑,就开始显示10

}

if(scollDiceNumValue>492){

scollDiceNumValue=0;//若是滑到10还想往前滑,就开始显示1

}

CCSprite* temDiceNum = (CCSprite*)choooseLayer->getChildByTag(tag_choose_dice_num);

temDiceNum->setTextureRect(CCSpriteFrame::frameWithTexture(m_diceNumsTexture,

CCRectMake(0, scollDiceNumValue, 58, 82))->getRect());

四、当手指离开屏幕时,记得校准显示的数字,由于玩家可能滑到显示一半图就TouchEnd了,因此还得校准下。

校准的办法就是求余,余数不为零就是没对准,须要校准

余数大于一个格子的高的一半是,继续下滑。

余数小于一个格子的高的一半是,继续上滑。

目的是往最接近完整的地方靠近。

OK,实在没空将它封装起来,这里只是给你们一个思路。固然也有更好的办法。