Home › Blogs › admin's blog

Doing a LightBox effect in Cocos2D for iPhone

Tue, 08/03/2010 - 23:43 — admin

For a Lightbox kind of effect in cocos2d you can have two layers

1) Background Layer
2) Pop up Layer

When Pop up Layer is shown we need to make the background layer darker.

First thing to be able to make the background layer darker is to extend the background layer from CCColorLayer.
But now if you try to call setOpacity on the layer only the layer will become darker, all the sprites on the layer will still be regular.
To make all sprites of the layer also darker you can override the setOpacity method in your Layer class as shown below

-(void) setOpacity: (GLubyte) opacity {
    for( CCNode *node in [self children] ) {
        if( [node conformsToProtocol:@protocol(CCRGBAProtocol)] ) {
            [(id<CCRGBAProtocol>) node setOpacity: opacity];
        }
        // Handle children that don't support opacity
        else {
            node.visible = ( opacity != 0 );
        }
    }
}

Above code goes thru all children of the layer and sets their opacity also, if they are implementing the CRGBAProtocol.
This solution works fine until you start using spritesheets, CCSpriteSheet doesn't implement CRGBAProtocol, so the recursion for setting the child's opacity stops there.
To fix this issue you can use following code.
-(void) setOpacity: (GLubyte) opacity {
    for( CCNode *node in [self children] ) {
        if( [node conformsToProtocol:@protocol(CCRGBAProtocol)] ) {
            [(id<CCRGBAProtocol>) node setOpacity: opacity];
        }
	else if ([node class] == [CCSpriteSheet class]) {
		for( CCNode *sprite in [node children] ) {
			if( [sprite conformsToProtocol:@protocol(CCRGBAProtocol)] ) {
				[(id<CCRGBAProtocol>) sprite setOpacity: opacity];
			}
		}
	}
        // Handle children that don't support opacity
        else {
            node.visible = ( opacity != 0 );
        }
    }
}

Above code just checks that if the instance of child is of type SpriteSheet it will set opacity on all its childern.