Handling different iphone screen sizes/resolution for background images

Question

I would like to better understand the iphone resolutions etc.

I have an application that has a basic buttonView and logoView. I have output the height of the logoView which will auto fit in height depending on screen size.

For the iphone5 I have 318 to work with. For the iphone4(<) I have 230 to work with.

My question is, how should I handle the image used for the background of this view. Would I create one three separate images for the following? -iphone3 etc (230) -iphone4 retina (230 size, @2) -iphone5 retina (328 size, @2)

Or would I create only the 2x 230 images, and can I stretch the image to 318 when an iphone5 is used and more space is available?

Answer 1

It all depends on your image:

• If your Image can be stretched, UIImageView will do all the work.
• If only a part of you image should be stretched you should use this:
  • imageView.image = [imageView.image resizableImageWithCapInsets:UIEdgeInsetsMake(top, left, bottom, right)];
• If your image can't be stretched you should then do different images for the phones and change them in runtime.

UPDATE

For the last point you could do something like this in your viewDidLoad method:

BOOL isIPhone = [[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPhone;
BOOL isIPhone5 = isIPhone && ([[UIScreen mainScreen] bounds].size.height > 480.0);
if (isIPhone5) {
   imageView.image = [UIImage imageNamed:@"iphone4image.png"];
} else {
    imageView.image = [UIImage imageNamed:@"iphone5image.png"];
}