【Cocos2d-x for WP8 学习整理】(3)CCScrollView 实现捕鱼达人一样的场景选择界面
投稿于 被查看 17835 次 评论:9
【Cocos2d-x for WP8 学习整理】(3)CCScrollView 实现捕鱼达人一样的场景选择界面
UI 界面一般是游戏里比较独立的地方,因为游戏引擎一般都比较注意基础的功能封装,很少会关注UI,但是 UI 确是玩家第一眼看到的效果,因此能否实现一个美观的UI对于提升游戏的
幸运的是cocos2d-x意识到了这个问题,自从2.0版本之后逐步加入了几个常用控件,在这里我们详细说一下 CCScrollView 。
CCScrollView 经常被用在场景选择界面里,以《捕鱼达人》为例,几个场景各个占据一个屏幕的宽度,滑动即可切换不同的场景。
看源码可知,CCScrollView
这样便达到了滑动展示的效果。
使用方法:
GalleryLayer::init(){
bRet = ;
{
CC_BREAK_IF( !CCLayer::init() );
m_nCurPage = ;
CCSize visibleSize = CCDirector::sharedDirector()->getVisibleSize();
CCPoint origin = CCDirector::sharedDirector()->getVisibleOrigin();
CCLayer *pLayer = CCLayer::create();
helpstr[] = {};
( i = ; i <= ; ++ i)
{
memset(helpstr, , (helpstr));
sprintf(helpstr,,i);
CCSprite *pSprite = CCSprite::create(helpstr);
pSprite->setScale(MIN(visibleSize.width / , visibleSize.height / ));
pSprite->setPosition(ccp(visibleSize.width * (i-), visibleSize.height / ));
pLayer->addChild(pSprite);
}
m_pScrollView = CCScrollView::create(CCSizeMake(visibleSize.width, visibleSize.height), pLayer);
m_pScrollView->setContentOffset(CCPointZero);
m_pScrollView->setDelegate();
m_pScrollView->setDirection(kCCScrollViewDirectionHorizontal);
pLayer->setContentSize(CCSizeMake(visibleSize.width*, visibleSize.height));
->addChild(m_pScrollView);
CCSpriteFrameCache *pCache = CCSpriteFrameCache::sharedSpriteFrameCache();
pCache->addSpriteFrame(CCSpriteFrame::create(,CCRectMake(, , , )),);
pCache->addSpriteFrame(CCSpriteFrame::create(,CCRectMake(, , , )),);
( i = ; i <= ; ++ i)
{
CCSprite *pPoint = CCSprite::createWithSpriteFrameName();
pPoint->setTag(i);
pPoint->setPosition(ccp( origin.x + (visibleSize.width - * pPoint->getContentSize().width)/ + pPoint->getContentSize().width * (i-), origin.y + ));
->addChild(pPoint);
}
CCSprite *pPoint = (CCSprite *)->getChildByTag();
pPoint->setDisplayFrame(pCache->spriteFrameByName());
bRet = ;
}
();
bRet;
}
但是对于场景选择来说,还需要个滑动完成自动定位的功能,自动的将当前的内容滚动到屏幕的中央。CCScrollView提供了一个手动设置位移的方法,
我们只需要在CCScrollView所在的Layer里的 touchEnded事件里调用该函数,然后传入计算出来的值即可。
实现方法:
GalleryLayer::adjustScrollView( offset){
m_pScrollView->unscheduleAllSelectors();
CCSize visibleSize = CCDirector::sharedDirector()->getVisibleSize();
CCPoint origin = CCDirector::sharedDirector()->getVisibleOrigin();
CCSpriteFrameCache *pCache = CCSpriteFrameCache::sharedSpriteFrameCache();
CCSprite *pPoint = (CCSprite *)->getChildByTag(m_nCurPage);
pPoint->setDisplayFrame(pCache->spriteFrameByName());
(offset < )
{
m_nCurPage ++;
}
{
m_nCurPage --;
}
(m_nCurPage <)
{
m_nCurPage = ;
}
(m_nCurPage > )
{
m_nCurPage = ;
}
pPoint = (CCSprite *)->getChildByTag(m_nCurPage);
pPoint->setDisplayFrame(pCache->spriteFrameByName());
CCPoint adjustPos = ccp(origin.x - visibleSize.width * (m_nCurPage-), );
m_pScrollView->setContentOffset(adjustPos, );
}
此外,CCScrollView还提供设置Delegate,类定义如下:
CCScrollViewDelegate{
:
~CCScrollViewDelegate() {}
scrollViewDidScroll(CCScrollView* view) = ;
scrollViewDidZoom(CCScrollView* view) = ;
我们可以通过 setDelegate 方法传入接受响应的对象,每当滑动或者放大的时候,就会调用响应的方法。可以在接受委托的对象里实现各种效果。
示例代码下载:
http://download.csdn.net/detail/u010810951/6441983
参考文章:
http://codingnow.cn/cocos2d-x/1024.html
用户评论