Erasing on UIImageView

Question

How can I erase content on front UIImage by swiping finger on it and display UIImage that is back side of UIView.

I had used following code in - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event to erase front image:

-(void)eraseDrawingContents
{
    UIGraphicsBeginImageContext(frontImage.frame.size);
    [frontImage.image drawInRect:CGRectMake(0, 0, frontImage.frame.size.width, frontImage.frame.size.height)];

    CGContextSaveGState(UIGraphicsGetCurrentContext());
    CGContextSetShouldAntialias(UIGraphicsGetCurrentContext(), YES);
    CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
    CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 25.0);
    CGContextSetShadowWithColor(UIGraphicsGetCurrentContext(), CGSizeMake(0, 0), 50, [[UIColor whiteColor]CGColor]);

    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path, nil, lastPoint.x, lastPoint.y);
    CGPathAddLineToPoint(path, nil, currentPoint.x, currentPoint.y);
    CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeClear);
    CGContextAddPath(UIGraphicsGetCurrentContext(), path);
    CGContextStrokePath(UIGraphicsGetCurrentContext());

    frontImage.image = UIGraphicsGetImageFromCurrentImageContext();
    CGContextRestoreGState(UIGraphicsGetCurrentContext());
    UIGraphicsEndImageContext();

    lastPoint = currentPoint;
}

I achieved following output.

But I need output like this.

How can we achieve this functionality?

Please help me.

Answer 1

Try this

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{


    UITouch *touch = [touches anyObject];
    CGPoint location = [touch locationInView:self.view];


   self.imgView.image = [self.imgView.image eraseImageAtPoint:location inImageView:self.imgView  fromEraser:eraserImg];



}



- (UIImage *)eraseImageAtPoint: (CGPoint)point inImageView: (UIImageView *)imgView fromEraser: (UIImage *)eraser
{
    UIGraphicsBeginImageContext(imgView.frame.size);

    [self drawInRect:CGRectMake(0, 0, imgView.frame.size.width, imgView.frame.size.height)];

    [eraser drawAtPoint:point blendMode:kCGBlendModeDestinationOut alpha:1.0];

    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return image;

}

And use the below image as eraser this will perfectly work for you.

This code is working at my end give me the following result:

Answer 2

You can Achive this via blending two images

Many ways are there simple way is below, you can use GPUImage also..

just you need to blend two images with your desired output.

Blend two images on each other..

Blend more you can try

**kCGBlendModeOverlay,kCGBlendModeSoftLight,kCGBlendModeColorDodge,etc**

in CGBlendMode parameter in below function.. there are still many option are there to overly two images and merged..(even with live camera also you can do this)

-(UIImage *)blenimagwithimage:(NSString *)imagename mode:(CGBlendMode)kmode with:(float)opeticy
    {
        processedimage=nil;
        UIImage *inputImage;
        inputImage = [UIImage imageNamed:imagename];
        UIGraphicsBeginImageContext(originalImage.size);
        [originalImage drawInRect:CGRectMake(0.0, 0.0, originalImage.size.width, originalImage.size.height)];
        [inputImage drawInRect:CGRectMake(0.0, 0.0, originalImage.size.width, originalImage.size.height) blendMode:kmode alpha:opeticy];
        UIImage *layeredImage = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
        return layeredImage;
    }

Answer 3

check this sample code

it provide this functionality like this