Background Image not Rendering Correctly on iPhone4

Question

I have a background image created by my designer in Photoshop. I convert it to png-24, and have two files, one for retina display at 640 x 920, and one for normal display at 320 x 460 (and which I name correctly with @2x).

When I implement it on the iPhone 4, it doesn't render correctly (the color is much darker), however, when I put it on the iPhone5 it works fine. The size of the file is 608 KB. Anyone know what could be going wrong and how I can fix this?

Answer 1

I wouldn't say that the size is a problem. Beeing a background image means it doesn't change over the life time of the app. Regarding the file size - you could play with the "Save for Web" option in Photoshop and watch for artifacts while you change the format/quality. PNG is great for images with transparency and according to Apple it is the optimal image format for the iPhone.

The color inconsistency between devices might be due to differences in display quality. You could try to fix it programmatically, but make sure to test it on a few devices. As for a easy workaround, in interface builder add a new view over you background image and set the transparency and color to your liking. Then set the view to hidden. Then, depending on the device (iPhone5, iPhone4) set your color view to visible [view setHidden:NO];

However I can't imagine that iPhone displays differ that much, so be careful if you really want to fix it programmatically.

Answer 2

I've really tried a lot to solve this problem and have used a DTS ticket on it. In the end, the reason for this is the iPhone5 displays colors better and there was nothing I could do to fix it.