UIScrollView solution for cocos2d-x

Extensions
#1

Hi everyone, I was looking for an UIScrollView like solution for cocos2d-x and all I could find is this great class named CCScrollView created by GParvaneh:
http://www.givp.org/blog/2010/12/30/scrolling-menus-in-cocos2d
So I took its code and ported it into c++ and works great now. (tested on airplay-sdk platform)
I’ve attached the new class.
I would be happy if this class will be part of the official cocos2d & cocos2d-x.

Enjoy.
Leo

update 27-6-2011: update files & add CCScrollLayerButton class (explained later in this post)


CCScrollLayer.cpp.zip (1.3 KB)


CCScrollLayer.h.zip (0.7 KB)


CCScrollLayer.cpp.zip (1.3 KB)


CCScrollLayer.h.zip (0.7 KB)


CCScrollLayerButton.cpp.zip (0.9 KB)


CCScrollLayerButton.h.zip (0.5 KB)

1 Like
#2

Awesome. I will run it at Wednesday, after my short holiday finishes. :stuck_out_tongue:

#3

@walzer
this implementation is something like page indicator, not uitableview.

#4

WenSheng play with this source in this afternoon, and show me the effect.
I would like to add a “extra” folder parallels to cocos2dx, or a new repository on github, to place these funny & helpful classes.
Riq is facing the same question now, waiting for his resolution.

#5

Hi，leo, we have created the “cocos2d-x-extensions” repository here http://github.com/cocos2d/cocos2d-x-extensions/
Can you add a test code to show how to use your class, and commit to the extension repository?

#6

the usage is very simple:

@
CCMutableArray<CCLayer*> layers;
layers.addObject(layer1);
layers.addObject(layer2);
layers.addObject(layer3);
layers.addObject(layer4);

CCScrollLayer* pScrollLayer = CCScrollLayer::layerWithLayers(&layers, 0);
pScrollLayer->setPosition(ccp(0,0));
addChild(pScrollLayer,0);
@

I don’t know how to use git I’ll be happy if you can apply it for me.

#7

it seemed no one has tested on android at all, even failed to compile. there is no CGPoint but CCPoint.

#8

cocos2d::CGPoint is used in a very very old version

#9

An updated version is attached. (using CCPoint)
I’ve also added class called “CCScrollLayerButton” - this class is used to create buttons that can be put inside scrollable layer and allow dragging the layer without pressing the button. the actual result is when tapping the button it activates the selector method and when dragging the button it dragged with the scrollable layer.

an example of usage:

@
CCMutableArray<CCLayer*> layers;
layers.addObject(layer1);
layers.addObject(layer2);
layers.addObject(layer3);
layers.addObject(layer4);

CCScrollLayer* pScrollLayer = CCScrollLayer::layerWithLayers(&layers, 0);
pScrollLayer~~>setPosition);
addChild;
// add scrollable buttons to layer 1
CCScrollLayerButton* level1Button = CCScrollLayerButton::buttonWithFile);
CCScrollLayerButton* level2Button = CCScrollLayerButton::buttonWithFile);
layer1~~>addChild(level1Button);
layer1->addChild(level2Button);
@

#10

CCScrollButton is so awesome! very Thank you to you.

But, I find a simple bug but very critical error.
if you have none target and selector, program have a error.

so I try to fix some source like that as* ccTouchEnded ( CCTouch* pTouch, CCEvent* pEvent )*

if ( target = null )
{
( target->*selector ) ( this );
}

but I am not sure.
is it correct?

#11

Your fix is correct, but why would you want a Button without a selector? You can simply use CCSprite.

#12

Sometimes I make a source without selector.

such as

CCScrollLayerButton* level2Button = CCScrollLayerButton::buttonWithFile(“sprite.png”, null, null );

I got a reason why I remove a menu_selector. Because I don’t know what I do for button event.

I work for some great programmer, so I hope they should fill in button event.

And I just start to program for 2 month with c++.

#13

I test some code using your source.

I put it MenuItemSprite instead of CCSprite.

Hm may be it is not complete code. However, I am sure if you want to change some function, it will be helpful.

button change a image with selected Sprite. oh ye!

> class CCScrollLayerButton  : public CCMenuItemSprite, CCTargetedTouchDelegate
> {
> ......
> }

> CCScrollLayerButton::initWithFile ( CCNode* normal, CCNode* selected, CCNode* disabled, SelectorProtocol* target, SEL_MenuHandler selector )
> {
> KDbool init = CCMenuItemSprite::initFromNormalSprite ( normal, selected, disabled, target, selector );
> 
> if ( !init )
> {
> return false;
> }
> ..... 
> 
> }

I got a normal sprite ( or ccprogress … etc ) rect. Sometimes, CCProgress has a size parameter with 9.patch png.
I just get a basic size with nomal sprite.

> CCRect CCScrollLayerButton::rect ( KDvoid )
> {
> CCSize s = this->getNormalImage ( ) ->getContentSize ( );   
> return CCRectMake ( -s.cx / 2, -s.cy / 2, s.cx, s.cy );
> }

the last change is so simple. just change parameter

> CCScrollLayerButton* CCScrollLayerButton::buttonWithFile ( CCNode* normal, CCNode* selected, CCNode* disabled, SelectorProtocol* target, SEL_MenuHandler selector )
> {
> CCScrollLayerButton *pRet = new CCScrollLayerButton ( );
> 
> if ( pRet && pRet->initWithFile ( normal, selected, disabled, target, selector ) )
> {
> pRet->autorelease ( );
> return pRet;
> }
> 
> CC_SAFE_DELETE ( pRet )
> 
> return KD_NULL;
> }
#14

What’s the license on this?

#15

Whatever you choose…

#16

How to decrease the scroll width and height.

#17

Scroll height and width.

#18

it’s good… well done.

#19

i want reduce the layer size how can i do this.plz help me

#20

Hi everybody, i hope you’ll can help me.
I work since 2 weeks with cocos2d, and I want to make a scrolling menu. I just saw this class, CCScrollLayer, and I want to know how can I use it to make my menu. (And what is the SCrollLayerButton ?) How can i use it ?

Thank you in advance. :slight_smile: