http://www.cocos2d-iphone.org/archives/47

this seems to be a good explanation.

Thanks - only just found the reply. Do you know of a good explanation of sprites v Atlas textures? I can't find one.

Hi codecowboy.

Sure: I used a technique much like yours: An image mask with multiple copies of the image.

It works like this:

- I have 1 CGImageRef which is the full image (320x480), transparency included
- 1 mask (CGImageRef) (black&white image with no transparency).
- Of course: each piece knows its coordinates from our full image

Some piece of code from the game (this is used on each piece):

[code]
// creates a uiimage (variable pieceImage) representing our piece (without the mask yet) from our photo
pieceRef = CGImageCreateWithImageInRect(photoRef, pieceRect);

// creates a uiimage (variable imageMask) representing the mask that will be applied to our piece
maskRef = CGImageCreateWithImageInRect(imageMaskRef, maskRect);

// creates a uiimage (pieceImageMask) with our final piece image (already masked)
pieceImageMask = [ImageUtils maskImageRef:pieceRef withMask:maskRef];

if (pieceRef == NULL || maskRef == NULL) {
Sys_Error("invalid reference to pieceRef or maskRef");
}

// create the jigsaw piece with the new image
piece = [JigsawPiece spriteWithCGImage:pieceImageMask]; // masked piece
[/code]

The secret is the "ImageUtils maskImageRef" which gets the image and mask, returning a new image masked, using the function below:

[code]
+ (CGImageRef)maskImageRef:(CGImageRef)image withMask:(CGImageRef)maskImage {
CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskImage), CGImageGetHeight(maskImage), CGImageGetBitsPerComponent(maskImage), CGImageGetBitsPerPixel(maskImage), CGImageGetBytesPerRow(maskImage), CGImageGetDataProvider(maskImage), NULL, false);
CGImageRef masked = CGImageCreateWithMask(image, mask); // the owner releases the image
CGImageRelease(mask);

return masked;
}
[/code]

It has drawbacks:

- it is a little slow

If would develop it again I would probably use a AtlasSprite.

You can take a look at this site: http://iphonedevelopertips.com/cocoa/how-to-mask-an-image.html

Well, thats all.

Hi,

Could you share the technique you used for dynamic texture generation for sprites? I would like to do something similar and there seem to be a few different options.

Previously, in a flash environment, I used masks and multiple copies of the image so that each sprite or 'movieclip' (in the flash world) allowed the correct part of the image to show through.

thanks!

Greetings,

Finally our first game is released on the App Store: iJig a jigsaw game made with Cocos 2d (v 0.71). Focused on gameplay (I tested nearly every jigsaw game available on the App Store and none is as fluid as iJig is :)).

Promotional video:
http://www.youtube.com/watch?v=CzgO6NXXpiY

Here are some images:

Link on the App Store: http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=327595264&mt=8

The game was kind of a learning experience (it could be better but I think it is pretty fun as it is now). And I learned some lessons about the App Store: competition is hard (the App Store is crowded is some genres (jigsaw included) but there is SO MUCH SPACE for creative and inovative games).

Cocos 2d helped a lot, without it I would not have finished the game.

On the tech side: the game can use images from the camera or photo album (I used cocos with UIKit integration). Each piece is a sprite (not atlassprite) with a texture generated dynamically.

And of course: Sapus Tongue source code saved the day.

More info at: http://myplaymobile.com/games/ijig

And here is one promo-code (more coming): 4KR73XWMRAJ4

Sheers.