Question

I’m blending two images in my iPhone app, using the HardLight blend mode of the top image. It looks something like this:

UIGraphicsBeginImageContext(size);
[sourceImage drawInRect:rectangle blendMode:kCGBlendModeNormal alpha:1.0];
[effectOverlay drawInRect:rectangle blendMode:kCGBlendModeHardLight alpha:0.75];
mainImage.image =  UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

It works fine. However, the blown-out highlights in the image appear with a weird color artifact. Note the purple artifact in the bottom-right corner of this photo:

http://dl.dropbox.com/u/626891/artifact.jpg http://dl.dropbox.com/u/626891/artifact.jpg

This only occurs using Hard Light; other blend modes are fine. Anyone know what to do about this?

Answer 1

This issue is quite annoying. Did somebody file a bug report to Apple?

Nevertheless, here is another workaround which seems better suited to solve the problem more reliably than the adhoc approaches I see here (which did not work for me). It is useful to know that the blend mode HardLight is the same as Overlay, only with the two arguments switched. And the things is that the iOS implementation of Overlay is not buggy. So you need to move around your drawing (and maybe take an intermediate snap shot with UIGraphicsGetImageFromCurrentImageContext or the like) such that you draw your two images in a switched order. This way you can use Overlay instead of HardLight.

So, for your example change the code to:

    UIGraphicsBeginImageContext(size);
    [effectOverlay drawInRect:rectangle blendMode:kCGBlendModeNormal alpha:0.75];
    [sourceImage drawInRect:rectangle blendMode:kCGBlendModeOverlay alpha:1.0];
    mainImage.image =  UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

Hope this helps.