Erasing text from a drawn UIView

Question

I'm trying to draw a UIView and erase text from it to produce an effect similar to this:

So far, I've not been able to figure out a way to get the text to act as an eraser. This is where I'm at:

CGContextRef c = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(c, [UIColor whiteColor].CGColor);
CGContextFillRect(c, self.bounds);
CGContextSetBlendMode(c, kCGBlendModeClear);
CGContextSetTextDrawingMode(c, kCGTextFill);
CGContextSetFont(c, CGFontCreateWithFontName(CFStringCreateWithCString(NULL, "HelveticaNeue-Bold", kCFStringEncodingUTF8)));
CGContextSetFontSize(c, 18.0);
UIGraphicsPushContext(c);
[_text drawInRect:self.bounds
   withAttributes:nil];
UIGraphicsPopContext();

I was hoping that CGContextSetBlendMode(c, kCGBlendModeClear); would make the text act as an eraser, but so far, I've had no luck.

I also had the idea to use a UILabel as a maskView, but I don't know how to invert it so that the text is treated as negative space. The only questions I've been able to find on inverting masks are inverting CAShapeLayers or UIImages.

Possible duplicate of [Drawing a path with subtracted text using Core Graphics](https://stackoverflow.com/questions/18716751/drawing-a-path-with-subtracted-text-using-core-graphics) — Pavan, May 08 '18 at 08:41
How about making a screenshot of the label, inverting alpha, and using the resulting image as mask? — mag_zbc, May 08 '18 at 08:42

score 3 · Accepted Answer · answered May 08 '18 at 08:45

I noticed you're using the word eraser. In the design world this sort of effect would be known as a mask. The mask will hide portions of the layer revealing whatever is below.

You can do this using a label and a view like so:

let view = UIView(frame: CGRect(x: 0, y: 0, width: 300, height: 300))
let label = UILabel(frame: view.frame)
label.text = "$48.99"
label.font = UIFont.systemFont(ofSize: 70)
label.textAlignment = .center
label.textColor = UIColor.white

let underlyingView = UIView(frame: view.frame)
underlyingView.backgroundColor = UIColor.blue
underlyingView.mask = label

view.addSubview(underlyingView)

You're right. I wasn't sure what to call it because normally the mask would treat the alpha as pixels to show, and I wanted the opposite. Your answer works though. Thanks! — Liftoff, May 08 '18 at 08:51

Erasing text from a drawn UIView

1 Answers1