Not including non-retina display images in an iPhone project-Collection of common programming errors

If you are assigning the images in Interface Builder, and you set the image property on a UIImageView to [email protected], for example, iOS will not know that it’s a high resolution “2x” image. In fact, on a retina display, iOS will look for an image named image@[email protected]. Since it won’t find it, it will set the scale factor of the image to 1.0.

The contentMode property (just “mode” in XCode) will decide if any scaling of the image occurs to fit the constraints of the UIImageView. You may wish to set the mode to “Aspect Fit” to get the high resolution image to scale as needed for both retina and non-retina displays. In general, the image will display as seen in Interface Builder.

If you are using UIImage’s imageNamed or similar function to load the image, and just specify image (where “image.png” doesn’t exist, but “[email protected]” does), then iOS will actually find the image on a non-retina display, though the scale factor will be 1.0. As previously, you’ll need to scale it to fit your view. The image will work normally on a retina device, and the scale factor will be set to 2.0, since iOS looks for a “2x” image first, and it doesn’t matter if the other file exists or not.

This is from Apple’s documentation on imageNamed:

On a device running iOS 4 or later, the behavior is identical if the device’s screen has a scale of 1.0. If the screen has a scale of 2.0, this method first searches for an image file with the same filename with an @2x suffix appended to it. For example, if the file’s name is button, it first searches for button@2x. If it finds a 2x, it loads that image and sets the scale property of the returned UIImage object to 2.0. Otherwise, it loads the unmodified filename and sets the scale property to 1.0. See iOS App Programming Guide for more information on supporting images with different scale factors.

If at all possible, you really should include both retina and non-retina images. Using higher-resolution images than necessary negatively affects memory and performance.