Large UIImage drawinrect extremely slow on selection

Question

I have a custom UITableView cell that sports an Image, and a headline. I used the fast scrolling example of ABTableViewCell from atebits.

It seems when I select the first row (which is my row with the largest image) it takes a considerable amoun of time to highlight the row, and then push the new view controller.

However when I select any of the other rows, with much smaller images, its almost instant.

Ive attempted to draw the picture using CGContextDrawImage and drawInRect but both yield the same results.

- (void)drawContentView:(CGRect)r highlighted:(BOOL)highlighted {
 if ([type isEqualToString:@"first"]) {
   CGContextRef context = UIGraphicsGetCurrentContext();
   UIColor *backgroundColor = [UIColor blackColor];
   UIColor *textColor = [UIColor whiteColor];
   UIColor *textBackgroundColor = [[UIColor alloc] initWithWhite:0 alpha:.5];
   UIColor *highlightColor;
   if (highlighted) {
     backgroundColor = [UIColor clearColor];
     textColor = [UIColor blueColor];
     highlightColor = [[UIColor alloc] initWithWhite:0 alpha:.3];
   } else {
     highlightColor = [UIColor clearColor];
   }

   [backgroundColor set];
   CGContextFillRect(context, r);
   [self.picture drawInRect:CGRectMake(0.0, 0.0, 320, 225)];
   [textBackgroundColor set];
   CGContextFillRect(context, CGRectMake(0, 170, 320, 55));  
   [textColor set];

   [self.title drawInRect:CGRectMake(5, 170, 320, 55) withFont:firstHeadlineFont lineBreakMode:UILineBreakModeWordWrap];
   [highlightColor set];
   CGContextFillRect(context, r);
 } else {
   CGContextRef context = UIGraphicsGetCurrentContext();
   UIColor *backgroundColor = [UIColor blackColor];
   UIColor *textColor = [UIColor blueColor];

   if (highlighted) {
     backgroundColor = [UIColor clearColor];
     textColor = [UIColor whiteColor];
   }
   [backgroundColor set];
   CGContextFillRect(context, r);

   CGPoint p;
   p.x = 0;
   p.y = 0;
   [self.picture drawInRect:CGRectMake(0.0, 0.0, 44, 44)];

   [textColor set];
   p.x += 44 + 6; // space between words
   [self.title drawAtPoint:p withFont:[UIFont systemFontOfSize:20]];
 }
}

EDIT: IS there anything I can do to speed this up? I am caching the image and reading it as well.

Answer 1

I realized I was using a very very large version of the image for my first row, I was able to scale it down before I pulled it from the webserver and this vastly improved performance. NOTE: double check your dimensions are not huge. IE: 2184x1456 hahah