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

原创文章，欢迎转载！转载请注明： 转载自Cocos2D开发网--Cocos2Dev.com

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

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

这是效果图：（呵呵，我不会画图，素材是扒的国外的一个游戏，游戏还没有写完。只能截部分图）

实现原理：

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

首尾一样为了循环的时候无缝连接。也就是两个1叠到一起。想象成一片字条，两个1重叠后就是一个1-10的圈。

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

实现代码：

1、创建一张很长的图的Texture，

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

2、创建一个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 //设置坐标，添加到场景

3、手指滑动的时候，不停的绘制上面的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());

4、当手指离开屏幕时，记得校准显示的数字，因为玩家可能滑到显示一半图就TouchEnd了，所以还得校准下。

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

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

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

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

OK，实在没空将它封装起来，这里只是给大家一个思路。当然也有更好的办法。