Question

I’ve set up a drawing tool using an approach similar to what’s shown in this SO question … I have a subclass of UIView that tracks touches, creates UIBezierPath objects, adds the paths to an array, then draws them onto the view in drawRect. The view is transparent ([UIColor clearColor], opaque=NO) and is placed over a UIWebView that displays documents in PDF and Word formats.

I want to use this tool to highlight text, so I’m using a yellow stroke color with .5 alpha. This works fairly well, but the color makes the text look faded where it overlaps. I was reading the description for the kCGBlendModeMultiply blend mode and thinking that would be perfect — it should allow the text to “punch through” the highlight color for better contrast.

However, I can’t see any difference between kCGBlendModeNormal, kCGBlendModeMultiply or any random blend mode I’ve tried. Do these really work, or do they only work in some situations?

Here’s my drawRect code:

- (void)drawRect:(CGRect)rect {
    for (UIBezierPath *path in self.paths) {
        [[UIColor colorWithRed:1 green:1 blue:0 alpha:0.5] setStroke]; // yellow
        //[path stroke]; // uses default blend mode
        [path strokeWithBlendMode:kCGBlendModeMultiply alpha:1.0]; // looks the same as above
    }
}

I tried setting the alpha of the color to 1.0 and the alpha argument of the strokeWithBlendMode method to 0.5, but it doesn’t make any difference. Am I missing something?

Answer 1

Your text is in a whole different world as far as your code is concerned. When you enter drawRect:, what you have available to you is a CGContextRef that was created specifically for your view and your view alone. It has no idea what is in other views, and so all of your blending is taking place against a bunch of clear pixels.

I’d say just lower the alpha a bit more, it will look ok. Or, you can draw the strokes behind the text to make the text stand out a bit more (this will take a bit of trickery though).