How to erase piece of UIImageView with png-brush and UIBezierPath

Question

I have two UIImageView, first above second. I want to erase piece of the first image with brush (brush is a png picture with soft edge) to make piece of the second image visible.

I did that by this way:

1) touchesMoved and [self setNeedsDisplayInRect:[self brushRectForPoint:touch_location]];

2) at (void)drawRect:(CGRect)rect I call [_brush drawAtPoint:touch_location blendMode:kCGBlendModeDestinationOut alpha:1];

It works ok, but frequency of touchesMoved not enough, if user moves finger too fast then I get a lot of short lines (or even points) instead of one long line.

I found information of UIBezierPath and example but author just draws lines by path:

CGContextRef context = UIGraphicsGetCurrentContext();

CGContextAddPath(context, path);

CGContextSetLineCap(context, kCGLineCapRound);
CGContextSetLineWidth(context, self.lineWidth);
CGContextSetStrokeColorWithColor(context, self.lineColor.CGColor);

CGContextStrokePath(context);

How I can draw my png brush with UIBezierPath?

I need something like this

enter image description here

Thanks a lot!

How about a moving average of the touch location? This will introduce some lag (which may or may not be desirable) but smooth out "jumps". The longer the MA period, the smoother, but the more lag too. — verec
Ok, I understand, but of course lag is not good. Anyway thanks for your idea. May be I will try to do something with this. — Max Sokolov

Amar Amar · Accepted Answer · 2013-07-16T13:00:29

There is an open source project which will be useful for you .. iOS-Scratch-n-See. Class ImageMaskView will be interesting to study.

Hope that helps!

How to erase piece of UIImageView with png-brush and UIBezierPath

1 Answers