Preload Images in iPhone application?

Question

I have a sequence of images needed to display in a short time (PNG sequence). There are totally 31 PNGs in total, each with file size about 45KB. I have already loaded them with the following codes:

imgArray = [[NSMutableArray alloc] init];
for(int i = 0; i <= 30; i++) {
    NSString * filename = [NSString stringWithFormat:@"img_000%.2d.png", i];
    UIImage *temp = [UIImage imageNamed:filename];
    [imgArray addObject:temp];
    [temp release];
    temp = nil;
} 

I use the following codes for displaying the images:

CGImageRef image = [(UIImage *)[imgArray objectAtIndex:imgFrame] CGImage];
imgLayer.contents = (id)image;
if(imgFrame < 29) {
    imgFrame++;
} else {
    imgFrame = 0;
    imgLayer.hidden = TRUE;
    [imgTimer invalidate];
}

where imgLayer is a CALayer. (imgTimer is a repeating timer with interval 0.03s)

But I found that when I call the images out, it is very laggy at the first time. Except the 1st appearance, other appearance has no problem.

Is it related to preloading images? Or are my images too big in file size?

Answer 1

The reason for your lags are hard to tell without profiling data. But here is a trick that might help: Join all your images into one large file. Try to make it rectangular (maybe 6x6 in your case or 4*8). Then load this single file and crop each image out for display (i.e. create an image for display with the size of a tile and copy one tile from the big image after the other into the display image).

Answer 2

Images are loaded when they are used and displayed. If you use the time profiler in Instruments, you will the lag you're experiencing. If you then zoom to that lag and look at what is causing it, you will usually see that "copyImageBlockSetPNG" is the function taking time, right before "inflate".

What you must find a way to do is create your images and force load them before you need them. That's another story apparently.