CCScrollView Class Reference
| Inherits from | CCNode : CCResponder : NSObject |
|---|---|
| Conforms to | UIGestureRecognizerDelegate |
| Declared in | CCScrollView.h |
Overview
A scroll view implementation similar to but technically unrelated to UIScrollView.
The scroll view supports pagination, where content snaps back to the nearest page when the user stopped dragging the content. The behavior is similar to flicking through photos in the iOS Photo Album app.
If you initialize the CCScrollView with a contentNode, the scroll view’s contentSize will be set to automatically scale with the content node’s size. You can also set the scroll view’s contentSize to a fixed size to limit where the scroll view reacts to touches, but this will not prevent the content node from drawing its contents over the bounds of the scroll view (ie CCScrollView is not combined with CCClippingNode behavior). Though you could use a clipping node as the content node, and add the actual content node to the clipping node if that’s what you’re looking for.
In pagination mode, the contentNode must have a contentSize that’s a multiple of the number of pages you want to display. Ie in a horizontal paging scroll view with width 350 points and 7 pages the content node’s width must be 2450 points. If there’s a mismatch you’ll notice that as you flick through pages they won’t be aligned perfectly with the rectangle defined by the scroll view’s position and contentSize.
A simple code example for a scroll view positioned at the center, extending 200 points to the right and up:
Objective-C:
CCSprite* contentNode = [CCSprite spriteWithImageNamed:@"Default.png"];
CCScrollView* scrollView = [CCScrollView scrollViewWithContentNode:contentNode];
scrollView.contentSizeType = CCSizeTypePoints;
scrollView.contentSize = CGSizeMake(200, 200);
CGSize viewSize = [CCDirector sharedDirector].viewSize;
scrollView.position = CGPointMake(viewSize.width / 2.0, viewSize.height / 2.0);
[self addChild:scrollView];
Swift:
let contentNode = CCSprite(imageNamed: "Default.png")
let scrollView = CCScrollView(contentNode: contentNode)
scrollView.contentSizeType = CCSizeType(widthUnit: .Points, heightUnit: .Points)
scrollView.contentSize = CGSizeMake(200, 200)
let viewSize = CCDirector.sharedDirector().viewSize()
scrollView.position = CGPoint(x: viewSize.width / 2.0, y: viewSize.height / 2.0)
addChild(scrollView)
Notice that you have to change the contentSizeType if you want to feed point coordinates into the contentSize because the type defaults to CCSizeTypeNormalized.
Refer to the CCScrollViewTest for more code examples.
Note: CCScrollView internally uses UIGestureRecognizer instances to control the scrolling. You may run into issues when using your own gesture recognizers while a CCScrollView is active.
Warning: You should not manually alter the contentNode’s CCNode properties while it is part of a scroll view, specifically don’t modify properties or run actions that affect its position, size and scale.
Warning: Contrary to its name, this node is not supposed to be used to scroll game worlds! Specifically it is not meant to scroll content based on the position of other objects, such as the player character’s node. For this kind of scrolling, CCScrollView is inefficient and can have adverse side-effects. CCScrollView is supposed to be used for content that’s scrolled directly through user interaction (dragging, flicking). For that, it captures user input, so one major issue would be to allow user interaction on the game world’s contents and converting coordinates of touch input to the actual scroll location. For “correct” game world scrolling, please find a solution better suited to the purpose. For one such solution and more details about CCScrollView in general please refer to the Learn SpriteBuilder book.