Question

I’ve been trying to set up the parallax node correctly but need some help with this.

This http://goo.gl/Piqy5 would be the frame of the game and for the parallax node area I have 3 layers:
background layer (zoomable but not scrollable, z order -1)
layer 1 (z order 1)
layer 2 (z order 2)

//Adding the layers to the parallax node
CGPoint offsetLayer = ccp(0,0);
//background layer
[parallaxNode addChild:backgroundLayer z:-1 parallaxRatio: ccp(0,0) positionOffset: offsetLayer];
//layer 1
[parallaxNode addChild:secondParallaxLayer z:1 parallaxRatio: ccp(0.5,0) positionOffset: offsetLayer];
//layer 2
[parallaxNode addChild:firstParallaxLayer z:2 parallaxRatio: ccp(1.1,0) positionOffset: offsetLayer];


//the pan/zoom & scroll controller
 _controller = [[CCPanZoomController controllerWithNode:baseLayer] retain];
 _controller.boundingRect = boundingRect;
_controller.zoomOutLimit = _controller.optimalZoomOutLimit;
 _controller.zoomInLimit = 2.0f;
[_controller centerOnPoint:CGPointMake(screenSize.width/2.0, screenSize.height/2.0)];
[_controller enableWithTouchPriority:-2 swallowsTouches:YES];

I think I should fix using:

//Setting the touch delegate to my CCScene
@interface GameScene : CCScene <CCStandardTouchDelegate>


//and add register to touch delegate
[[CCTouchDispatcher sharedDispatcher] addStandardDelegate:self priority:2];


- (CGPoint)convertPoint:(CGPoint)point fromNode:(CCNode *)node {
    return [self convertToNodeSpace:[node convertToWorldSpace:point]];
}

- (void)ccTouchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
#define CLAMP(x,y,z) MIN(MAX(x,y),z)
    if ([[[event allTouches] allObjects] count] == 2) {

        UITouch* touch1 = [[[event allTouches] allObjects] objectAtIndex:0];
        UITouch* touch2 = [[[event allTouches] allObjects] objectAtIndex:1];

        // calculate scale value
        double prevDistance = ccpDistance([touch1 previousLocationInView:[touch1 view]], [touch2 previousLocationInView:[touch2 view]]);
        double newDistance  = ccpDistance([touch1 locationInView:[touch1 view]], [touch2 locationInView:[touch2 view]]);

        CGFloat relation = newDistance / prevDistance;
        CGFloat newScale = self.scale * relation;

        if ((newScale >= MIN_SCALE) && (newScale <= MAX_SCALE)) {

            CGPoint touch1Location = [baseLayer convertTouchToNodeSpace:touch1];
            CGPoint touch2Location = [baseLayer convertTouchToNodeSpace:touch2];

            // calculate center point between two touches
            CGPoint centerPoint = ccpMidpoint(touch1Location, touch2Location);

            // store center point location (ScrollableView space)
            CGPoint centerPointInParentNodeSpace = [self convertPoint:centerPoint fromNode:baseLayer];
            CGPoint oldPoint = ccp(centerPointInParentNodeSpace.x * (self.scale), centerPointInParentNodeSpace.y * (self.scale));
            self.scale = newScale;

            CGPoint newPoint = ccp(centerPointInParentNodeSpace.x * (self.scale), centerPointInParentNodeSpace.y * (self.scale));
            CGPoint diff = ccp(oldPoint.x - newPoint.x , oldPoint.y - newPoint.y);

            [baseLayer setPosition:ccp(baseLayer.position.x + (diff.x*(1/self.scale)), baseLayer.position.y + (diff.y*(1/self.scale)))];
        }
    } else if ([[[event allTouches] allObjects] count] == 1)    {
        // get touch locations
        UITouch *touch = [[event allTouches] anyObject];

        CGPoint touchPosition = [[CCDirector sharedDirector] convertToGL:[touch locationInView:[touch view]]];
        CGPoint oldPosition = [[CCDirector sharedDirector] convertToGL:[touch previousLocationInView:[touch view]]];

        // calculate difference in position
        CGPoint diff = ccpSub(touchPosition, oldPosition);
        self.position = ccpAdd(self.position, diff);
    }

#undef CLAMP
}

Any remarks or help would be great! 🙂

Answer 1

Check out CCLayerPanZoom in the Cocos2d Extensions on Github. I have used this class to enable pinch zoom and pan in my game