CGImageCreateWithMask with an image as a mask

Question

Hi

I am trying to use an image (270 degrees of a circle, similar to a pacman logo, painted as Core Graphics) to create a mask. What I am doing is this

1. creating a Core Graphics path

    CGContextSaveGState(context);
    CGContextBeginPath(context);
    CGContextMoveToPoint(context,circleCenter.x,circleCenter.y);
    //CGContextSetAllowsAntialiasing(myBitmapContext, YES);
    CGContextAddArc(context,circleCenter.x, circleCenter.y,circleRadius,startingAngle, endingAngle, 0); // 0 is counterclockwise
    CGContextClosePath(context);
    CGContextSetRGBStrokeColor(context,1.0,0.0,0.0,1.0);
    CGContextSetRGBFillColor(context,1.0,0.0,0.0,0.2);
    CGContextDrawPath(context, kCGPathFillStroke);

2. then I'm creating an image of the path that has the path just painted

    CGImageRef pacmanImage              = CGBitmapContextCreateImage (context); 

3. restoring the context

CGContextRestoreGState(context);
CGContextSaveGState(context);

4. creating a 1 bit mask (which will provide the black-white mask)

bitsPerComponent                    = 1;
bitsPerPixel                        = bitsPerComponent * 1 ;
bytesPerRow                         = (CGImageGetWidth(imgToMaskRef) * bitsPerPixel);
mask                                = CGImageCreate(CGImageGetWidth(imgToMaskRef), 
                                                CGImageGetHeight(imgToMaskRef), 
                                                bitsPerComponent,
                                                bitsPerPixel, 
                                                bytesPerRow, 
                                                greyColorSpace,
                                                kCGImageAlphaNone, 
                                                CGImageGetDataProvider(pacmanImage), 
                                                NULL, //decode
                                                YES, //shouldInterpolate
                                                kCGRenderingIntentDefault);

5. masking the imgToMaskRef (which is a CGImageRef imgToMaskRef =imgToMask.CGImage;) with the mask just created

    imageMaskedWithImage                = CGImageCreateWithMask(imgToMaskRef, mask);
CGContextDrawImage(context,imgRectBox, imageMaskedWithImage);
CGImageRef maskedImageFinal         = CGBitmapContextCreateImage (context);

6. returning the maskedImageFinal to the caller of this method (as wheelChoiceMadeState, which is a CGImageRef) who then updates the CALayer contents property with the image

 theLayer.contents                  = (id) wheelChoiceMadeState;

the problem I am seeing is that the mask does not work properly and looks very strange indeed. I get strange patterns across the path painted by the Core Graphics. My hunch is there is something with CGImageGetDataProvider() but I am not sure.

Any help would be appreciated

thank you

Answer 1

CGImageGetDataProvider does not change the data at all. If the data of pacmanImage does not exactly match the parameters passed to CGImageCreate (bitsPer,bytesPer,colorSpace,...) the result is undefined. If it does exactly match, there would be no point in creating mask.

You need to create a grayscale CGBitmapContext to draw the mask into, and a CGImage that uses the same pixels and parameters as the bitmap. You can then use the CGImage to mask another image.

Only use CGBitmapContextCreateImage if you want a snapshot of a CGBitmapContext that you will continue to modify. For a single use bitmap, pass the same buffer to the bitmap and the matching CGImage you create.

Edit:

finalRect is the size the final image should be. It is either large enough to hold the original image, and the pacman is positioned inside it, or it is large enough to hold the pacman, and the original image is cropped to fit. In this example, the original image is cropped. Otherwise the pacman path would have to be positioned relative to the original image.

maskContext = CGBitmapContextCreate( ... , finalRect.size.width , finalRect.size.height , ... );
// add the pacman path and set the stroke and fill colors
CGContextDrawPath( maskContext , kCGPathFillStroke );
maskImage = CGBitmapContextCreateImage( maskContext );
imageToMask = CGImageCreateWithImageInRect( originalImage , finalRect );
finalImage = CGImageCreateWithMask( imageToMask , maskImage );