Images for iphone 5 retina display

Question

iPhone 5 released, with new screen size and resolution.

When we used images for iPhone 4 (retina), we just added "@2x" to image name. Can anybody tell me, is it possible to add different images (backgrounds, buttons, etc), for new iPhone screen?

And the second question: can I have in my app separate XIB files: for iPhone old, iPhone new (like for iPhone and iPad)?

Thank you!

Answer 1

Here's an except from my blog about this subject:

[UIImage imageNamed:] automatically loads @2x versions of images when running on a retina device. Unfortunately, imageNamed: will NOT automatically load -568h@2x versions of images when running on an iPhone 5.

Sometimes this doesn't matter, for example icons and non-full screen graphics are probably the same on iPhone 4 & 5. However, if you have full-screen background images, or full-width / height background images for toolbars etc you will have problems. Your 480-high images will most likely get stretched (and will probably look horrid as a result).

You can manually check the screen size and load the right image like this:

UIImage* myImage;
CGFloat screenHeight = [UIScreen mainScreen].bounds.size.height;
if ([UIScreen mainScreen].scale == 2.f && screenHeight == 568.0f) {
   myImage = [UIImage imageNamed:@"myImage-568h.png"];
} else {
   myImage = [UIImage imageNamed:@"myImage.png"];
}

There's a way of altering UIImage imageNamed so it does automatically load the right image. See link below for details.

More at: http://pervasivecode.blogspot.co.uk/2012/09/making-apps-work-on-iphone-5-screen-size.html

EDIT: @Sound Blaster & @GrizzlyNetch are right, in code you should use imageNamed:@"myImage-568h.png"] but the actual file name should be [email protected]. If you don't do this, then the scale is incorrect, just like they said.