Question

I have a very simple UIView containing a few black and white UIImageViews. If I take a screenshot via the physical buttons on the device, the resulting image looks exactly like what I see (as expected) – if I examine the image at the pixel level it is only black and white.

However, if I use the following snippet of code to perform the same action programmatically, the resulting image has what appears to be anti-aliasing applied – all the black pixels are surrounded by faint grey halos. There is no grey in my original scene – it’s pure black and white and the dimensions of the “screenshot” image is the same as the one I am generating programmatically, but I can not seem to figure out where the grey haloing is coming from.

UIView *printView = fullView;

UIGraphicsBeginImageContextWithOptions(printView.bounds.size, NO, 0.0);

CGContextRef ctx = UIGraphicsGetCurrentContext();
[printView.layer renderInContext:ctx];
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIImageWriteToSavedPhotosAlbum(image, nil, nil, nil);
UIGraphicsEndImageContext();

I’ve tried adding the following before the call to renderInContext in an attempt to prevent the antialiasing, but it has no noticeable effect:

CGContextSetShouldAntialias(ctx, NO);
CGContextSetAllowsAntialiasing(ctx, NO);
CGContextSetInterpolationQuality(ctx, kCGInterpolationHigh);

Here is a sample of the two different outputs – the left side is what my code produces and the right side is a normal iOS screenshot:

Since I am trying to send the output of my renderInContext to a monochrome printer, having grey pixels causes some ugly artifacting due to the printer’s dithering algorithm.

So, how can I get renderInContext to produce the same pixel-level output of my views as a real device screenshot – i.e. just black and white as is what is in my original scene?

Answer 1

It turns out the problem was related to the resolution of the underlying UIImage being used by the UIImageView. The UIImage was a CGImage created using a data provider. The CGImage dimensions were specified in the same units as the parent UIImageView however I am using an iOS device with a retina display.

Because the CGImage dimensions were specified in non-retina size, renderInContext was upscaling the CGImage and apparently this upscaling behaves differently than what is done by the actual screen rendering. (For some reason the real screen rendering upscaled without adding any grey pixels.)

To fix this, I created my CGImage with double the dimension of the UIImageView, then my call to renderInContext produces a much better black and white image. There are still a few grey pixels in some of the white area, but it is a vast improvement over the original problem.

I finally figured this out by changing the call to UIGraphicsBeginImageContextWithOptions() to force it to do a scaling of 1.0 and noticed the UIImageView black pixel rendering had no grey halo anymore. When I forced UIGraphicsBeginImageContextWithOptions() to a scale factor of 2.0 (which is what it was defaulting to because of the retina display), then the grey haloing appeared.