I have used Quartz2D to draw the line, Now to UNDO the drawn line?

Question

Well i'm using Quartz2D to draw the things, i have followed this tutorial and its working fine.But i need to implement the UNDO option in it.

I have a undo button when i press it , it must undo the drawn line .

I"M using below code to draw . Does any one know the solution for it.

Thaks in Advance.

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

mouseSwiped = NO;
UITouch *touch = [touches anyObject];
lastPoint = [touch locationInView:self.view];
}

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

mouseSwiped = YES;
UITouch *touch = [touches anyObject];
CGPoint currentPoint = [touch locationInView:self.view];

UIGraphicsBeginImageContext(self.view.frame.size);
[self.tempDrawImage.image drawInRect:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), currentPoint.x, currentPoint.y);
CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), brush );
CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), red, green, blue, 1.0);
CGContextSetBlendMode(UIGraphicsGetCurrentContext(),kCGBlendModeNormal);

CGContextStrokePath(UIGraphicsGetCurrentContext());
self.tempDrawImage.image = UIGraphicsGetImageFromCurrentImageContext();
[self.tempDrawImage setAlpha:opacity];
UIGraphicsEndImageContext();

lastPoint = currentPoint;
}

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

if(!mouseSwiped) {
    UIGraphicsBeginImageContext(self.view.frame.size);
    [self.tempDrawImage.image drawInRect:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
    CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
    CGContextSetLineWidth(UIGraphicsGetCurrentContext(), brush);
    CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), red, green, blue, opacity);
    CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
    CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
    CGContextStrokePath(UIGraphicsGetCurrentContext());
    CGContextFlush(UIGraphicsGetCurrentContext());
    self.tempDrawImage.image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
}

UIGraphicsBeginImageContext(self.mainImage.frame.size);
[self.mainImage.image drawInRect:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) blendMode:kCGBlendModeNormal alpha:1.0];
[self.tempDrawImage.image drawInRect:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) blendMode:kCGBlendModeNormal alpha:opacity];
self.mainImage.image = UIGraphicsGetImageFromCurrentImageContext();
self.tempDrawImage.image = nil;
UIGraphicsEndImageContext();
}

score 0 · Answer 1 · answered Nov 23 '13 at 07:52

you can not undo a specific drawing operation. You have to save all the touches and store it in an appropriate way (your "step" object). You store this "step" objects in a drawing-session (an array) and if you want to do an undo you delete the last object in this array and after this redraw the whole image with all the steps remaining in the (session)array.

score 0 · Answer 2 · answered Dec 16 '13 at 17:42

The simplest way to do undo is to capture the rectangle that is about to change and store the contents of that rectangle in memory or in a file. When you want to undo, simply draw the rectangle that was saved at the correct coordinates using kCGBlendModeCopy.

For multiple undo, you can store a stack of these rectangles and pop when they want to undo. Redo is also easy, instead of a pop, you just move back one position in an array. For a redo, you move forward one position.

If you are modifying your image in real time (i.e. they are drawing with their finger) then you can't pre-get the rectangle before-hand, and instead you'll need a second buffer that contains a copy of your image, and you can use that to get your undo rectangle after they finish the draw operation. Once they finish, you copy the image to the undo buffer.

Good luck!

I have used Quartz2D to draw the line, Now to UNDO the drawn line?

2 Answers2