~~~~本文章为 OwenTsang(fromOld-Boys-Studio)原创,转载务必在明显处注明:
原文连接:http://blog.csdn.net/owen_c/article/details/9074361
学习了cocos2dx也有点时间了,用到页面滚动的时候,用起来有点不顺心,故自己下定决心,好好总结了一下,尽量地向UIKit中的UIScrollview效果靠拢。好了,闲话勿叙,我们直入正题吧。
我将此命名为OBScrollview,本文是居于cocos2d-2.1rc0-x-2.1.2-hotfix中的CCScrollview的基础改写的,测试请注意环境。一 OBScrollview二新增功能介绍
1 动态调节触摸事件优先级,并通过委托通知外界点击事件
enum {//* priority used by the OBScrollView for the event handler
kOBScrollViewHandlerPriority = kCCMenuHandlerPriority-1, };
OBScrollView的默认触摸事件优先级设置为 kOBScrollViewHandlerPriority,优先级比kCCMenuHandlerPriority还高,所以默认情况下,在此OBScrollview中CCMenuItem是不被响应的,但你也可以setTouchPriority来改变。
为什么在此设计比CCMenuItem还高的优先级呢?因为本文更倾向于使用下面的方法来处理点击事件。OBScrollViewDelegate在CCScrollViewDelegate的基础上,增加一个非纯虚函数,
2 加入滚动条(OBScroller)功能
OBScroller有两种方向,水平方向(kOBScrollViewDirectionHorizontal)放在最底端和垂直方向(kOBScrollViewDirectionVertical)位置在最右端。21)可加入背景 void setScrollerBg(const char* bgFile);
22)两种方式的加入实际的滚动小条,
221)void setSpriteScroller(const char* scrollerFile); 此为普通的Sprite
222)void setSpriteScroller(const char* scrollerFile, CCRect rect, CCRect capInsets); 这个设置了一个高级货,CCScale9Sprite,这个能兼容任何形态的滚动条
二 测试示例
void HelloWorld::testBothDirectionScrollview()
{
CCSize viewSize;
CCNode* container = createBothDirectionContainer(viewSize); ///构造container
OBScrollView* scrollView = OBScrollView::create(viewSize,container);///构造OBScrollView
scrollView->setDirection(kOBScrollViewDirectionBoth);///设置方向为水平纵线都可以滚动
scrollView->setDelegate(this);///设置托管
scrollView->setPosition( ccp(CCDirector::sharedDirector()->getWinSize().width / 4,
CCDirector::sharedDirector()->getWinSize().height/ 6));
this->addChild(scrollView);
scrollView->setContentOffset(ccp(0,scrollView->minContainerOffset().y));///设置默认显示左下角的内容
OBScroller* scroller = new OBScroller(kOBScrollViewDirectionVertical,CCSizeMake(verticalScrollerWidth, viewSize.height));///构造垂直的OBScroller
scroller->setSpriteScroller("scroller9.png",CCRectMake(0,0,20,40),CCRectMake(6, 6, 6, 6));///设置滚动小条CCScale9Sprite形式
// scroller->setSpriteScroller("Scroller.png");///设置滚动小条CCSprite形式
scrollView->setScroller(scroller); ///将scroller放入scrollView的右端
scroller->release();///
scroller = new OBScroller(kOBScrollViewDirectionHorizontal,CCSizeMake(viewSize.width, horizontalScrollerHeight));///构造水平的OBScroller
scroller->setSpriteScroller("horizontalScroller9.png",CCRectMake(0,0,40,20),CCRectMake(6, 6, 6, 6));///设置滚动小条CCScale9Sprite形式
// scroller->setSpriteScroller("horizontalScroller.png");///设置滚动小条CCSprite形式
scrollView->setScroller(scroller);///将scroller放入scrollView的底端
scroller->release();
}
void HelloWorld::scrollViewDidClick(CCNode* clickNode)
{
CCLOG("click node id = %d",clickNode->getTag());
}
三 源代码
github地址:https://github.com/OwenTsang/TestOBScrollview
四 效果图
初始效果图
点击之后效果图:
好了,我的第一篇blog总算写好了,欢迎拿砖轻拍,注意是轻拍~~
~~~~~~~~~~~~~转载请注明出处喔~~~~~~~~~~~~~~~
~~~~本文章为 OwenTsang(fromOld-Boys-Studio)原创,转载务必在明显处注明:
原文连接:http://blog.csdn.net/owen_c/article/details/9074361