Question

I’m trying to let a user draw lines on multiple UIView canvases that are placed side by side on a UIScrollView (with paging enabled).

The scrollview is there to let the user swap between the canvases, so they can maintain multiple drawings at once.

The problem is that no matter which of the canvases is being touched, the same canvas is always drawn to. If I have a white and a black canvas on the scrollview, touching the white one always draws lines on the black one.

I think this is something to do with the graphics context being used, I’ve double checked that the correct canvas is receiving the touch events.

The last canvas that I do something related to drawing on seems to receive all of the events. When I set the background of both canvases in the parent view controller, the one I set the background of last is the one that receives the lines.
So, setting the background of the black canvas last means the black canvas will be drawn on, and vice versa.

This is the code for the canvas object:

#import "Canvas.h"


@implementation Canvas

@synthesize canvasColour;

UIImageView* drawImage;
int mouseMoved;
BOOL mouseSwiped;
CGPoint lastPoint;

CGContextRef context;

- (void)viewDidLoad {
    [super viewDidLoad];
    drawImage = [[UIImageView alloc] initWithImage:nil];
    drawImage.frame = self.view.frame;
    [self.view addSubview:drawImage];
}

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

    NSLog([NSString stringWithFormat:@"Touches began on %@", self.canvasColour]);


    mouseSwiped = NO;
    UITouch *touch = [touches anyObject];

    if ([touch tapCount] == 2) {
        drawImage.image = nil;
        return;
    }

    lastPoint = [touch locationInView:self.view];
    lastPoint.y -= 20;

}


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

    mouseSwiped = YES;

    UITouch *touch = [touches anyObject];   
    CGPoint currentPoint = [touch locationInView:self.view];
    currentPoint.y -= 20;

    UIGraphicsBeginImageContext(self.view.frame.size);
    context = UIGraphicsGetCurrentContext();
    [drawImage.image drawInRect:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
    CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
    CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 5.0);
    CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), 1.0, 0.0, 0.0, 1.0);
    CGContextBeginPath(UIGraphicsGetCurrentContext());
    CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
    CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), currentPoint.x, currentPoint.y);
    CGContextStrokePath(UIGraphicsGetCurrentContext());
    drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    lastPoint = currentPoint;

    mouseMoved++;

    if (mouseMoved == 10) {
        mouseMoved = 0;
    }


}

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

    UITouch *touch = [touches anyObject];

    if ([touch tapCount] == 2) {
        drawImage.image = nil;
        return;
    }


    if(!mouseSwiped) {
        UIGraphicsBeginImageContext(self.view.frame.size);
        [drawImage.image drawInRect:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
        CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
        CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 5.0);
        CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), 1.0, 0.0, 0.0, 1.0);
        CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
        CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
        CGContextStrokePath(UIGraphicsGetCurrentContext());
        CGContextFlush(UIGraphicsGetCurrentContext());
        drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
    }

}

- (void)dealloc
{
    [super dealloc];
}

@end

Can someone help with this problem?

Answer 1

Your drawImage variable does not look properly declared. It should be an instance variable or property declared in the interface section of your header file, or in a private interface section within your .m file.

I’m not sure what happens if you just have a free floating variable declaration, it looks like the compiler is treating it as a static variable which would sort of explain your symptoms, but I’m not sure if that is what is happening here.