Question

I have a little code module that should refer as signature panel so that the user can sign on this panel with his finger. The whole thing runs on the iPad.
Now, I managed to do the usual touchesBegan(), touchesMoved(), touchesEnded() carousel to make him sign on that panel. While signing, I draw his signature on the main view. However, due to whatever reason, the image appears twice: once correctly and once upside down above the main signature (see image). Since I don’t see any translating being done in my code, I suspect that the whole code might be incorrect, but I don’t know why. Does anyone know what I’m doing wrong here?

#import "RMSignatureView.h"
#import <QuartzCore/QuartzCore.h>

@interface RMSignatureView() {
  CGPoint origin;
}
-(void) setupLayer;
@property (nonatomic, retain) UIImage* image;
@end

@implementation RMSignatureView

@synthesize image;

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

- (id)initWithFrame:(CGRect)frame {
  self = [super initWithFrame:frame];
  if (self) {
    [self setupLayer];
  }
  return self;
}

-(id) initWithCoder:(NSCoder *)aDecoder {
  if ([super initWithCoder:aDecoder] == self) {
    [self setupLayer];
  }
  return self;
}

-(void) setupLayer {
  self.layer.cornerRadius = 10;
  self.layer.borderColor = [UIColor colorWithRed:109.0/256.0 green:149.0/256.0 blue:224.0/256.0 alpha:1.0].CGColor;
  self.layer.borderWidth = 0.5f;
}

- (void)drawRect:(CGRect)rect {
  CGContextRef context = UIGraphicsGetCurrentContext();
  CGContextSaveGState(context);
  CGContextSetStrokeColorWithColor(context, [UIColor grayColor].CGColor);
  CGFloat sizes[2];
  sizes[0] = 1;
  sizes[1] = 1;
  CGContextSetLineDash(context, 0, sizes, 2);
  CGContextMoveToPoint(context, rect.origin.x + 50, rect.origin.y + rect.size.height - 30);
  CGContextAddLineToPoint(context, rect.origin.x + rect.size.width - 50, rect.origin.y + rect.size.height - 30);
  CGContextStrokePath(context);
  CGContextSetLineDash(context, 0, NULL, 0);

  if (image)
    CGContextDrawImage(context, rect, image.CGImage);

  CGContextRestoreGState(context);
}

-(void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
  UITouch* touch = [touches anyObject];
  origin = [touch locationInView:self];
}

-(void) touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event {
  origin.x = -1;
  origin.y = -1;
}

-(void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
  origin.x = -1;
  origin.y = -1;
}

-(void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
  UITouch* touch = [touches anyObject];
  if (origin.x != -1 && origin.y != -1) {
    UIGraphicsBeginImageContext(self.frame.size);
    @try {
      CGContextRef context = UIGraphicsGetCurrentContext();
      CGContextSaveGState(context);      
      if (image)
        CGContextDrawImage(context, CGRectMake(0, 0, self.frame.size.width, self.frame.size.height), image.CGImage);

      CGContextMoveToPoint(context, origin.x, origin.y);
      origin = [touch locationInView:self];
      CGContextAddLineToPoint(context, origin.x, origin.y);
      CGContextStrokePath(context);
      self.image = UIGraphicsGetImageFromCurrentImageContext();  
      CGContextRestoreGState(context);
    }
    @finally {
      UIGraphicsEndImageContext();
    }
  }
  [self setNeedsDisplay];
}

@end

Answer 1

Found it.. Quartz has (0, 0) in the lower left instead of upper left.