iosuiimageviewcgcontextcgcontextdrawimage

iOS : Drawing on a CGContext eventually blurs


I have a app that displays a document that has a UIImage over the top of it where you can draw lines etc to highlight stuff.

If I keep drawing lines (touch, draw, lift finger off, and repeat in a different area of the screen)

The lines slowly blur.

Here is my touch code, I am using kCGBlendModeCopy for blendmode but have used kCGBlendModeNormal. DrawingView is a UIImageView.

UPDATE It is lines I have already draw, the older they are the more they get blurred, it feels like each added line decays the older ones. Tested on a iPad 2 ios8 iPad Mini Retina ios7

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

    mouseSwiped = NO;

    if ( self.drawingEnabled )
    {
        UITouch *touch = [touches anyObject];
        lastPoint = [touch locationInView:self.drawingView];

        UIGraphicsBeginImageContext(self.drawingView.frame.size);
        [self.drawingView.image drawInRect:CGRectMake(0, 0, self.drawingView.frame.size.width, self.drawingView.frame.size.height) blendMode:kCGBlendModeCopy alpha:1.0];
    }
}

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

    if ( self.drawingEnabled )
    {
        mouseSwiped = YES;
        UITouch *touch = [touches anyObject];

        CGPoint currentPoint = [touch locationInView:self.drawingView];

        CGContextRef ctxt = UIGraphicsGetCurrentContext();
        CGContextMoveToPoint(ctxt, lastPoint.x, lastPoint.y);
        CGContextAddLineToPoint(ctxt, currentPoint.x, currentPoint.y);
        CGContextSetLineCap(ctxt, kCGLineCapRound);
        CGContextSetLineWidth(ctxt, self.brush );
        CGContextSetRGBStrokeColor(ctxt, self.redColour, self.greenColour, self.blueColour, OPACITY);

        if (self.eraserOn)
        {
            CGContextSetBlendMode(ctxt,kCGBlendModeClear);
        }
        else
        {
            CGContextSetBlendMode(ctxt,kCGBlendModeCopy);
        }

        CGContextStrokePath(ctxt);
        self.drawingView.image = UIGraphicsGetImageFromCurrentImageContext();

        lastPoint = currentPoint;
    }
}

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


    [super touchesCancelled:touches withEvent:event];

    UIGraphicsEndImageContext();

    if(!mouseSwiped)
    {
        //self.drawingView.image = nil;
    }
}

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


    if ( self.drawingEnabled )
    {

        if(!mouseSwiped) {
            UIGraphicsEndImageContext();

            UIGraphicsBeginImageContext(self.drawingView.frame.size);
            [self.drawingView.image drawInRect:CGRectMake(0, 0, self.drawingView.frame.size.width, self.drawingView.frame.size.height)];
            CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
            CGContextSetLineWidth(UIGraphicsGetCurrentContext(), self.brush);
            CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), self.redColour, self.greenColour, self.blueColour, OPACITY);
            CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
            CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
            CGContextStrokePath(UIGraphicsGetCurrentContext());
            CGContextFlush(UIGraphicsGetCurrentContext());
            self.drawingView.image = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();
        }

        if (self.delegate)
        {
            [self.delegate drawingUpated];
        }

        //NSLog(@"%@  ---  %@", NSStringFromCGRect(self.frame) , NSStringFromCGRect(self.drawingView.frame) );
    }
}

Solution

  • This turned out to be a issue with how I had setup the frame of the self. drawingView and the size of the image inside.

    The image was 1005 by 720 the drawingView was 1004.2 by 719.9 so there was a rounding issue. Each time I draw a new line, it would round down.