2

I have images titled like so in my app:

image~iPhone.png image@2x~iPhone.png

In interface builder I am loading image.png into my UIImageView. I also programatically load some images into a different view using imageWithContentsOfFile. The images all load fine when I run in the simulator but I get no images when I run on the device. If I use the full name of the image in interface builder it works but I want iOS to distinguish between high res and lower res. I have tried a lot of different things but can't figure this out. I see this error in the debugger as well:

Could not load the "image.png" image referenced from a nib in the bundle with identifier "com.mycompany.myproject"

Xcode 4 Deployment Target 4.1 Base SDK 4.3

Thanks for any help.

gcamp
  • 14,622
  • 4
  • 54
  • 85
clintsmith
  • 695
  • 6
  • 16

3 Answers3

1

Ok...so after much experimenting I got it working.

I had two images named:

  1. image@2x~iPhone.png
  2. image~iPhone.png

and I was trying to load them using IB or imageWithContentsOfFile using

  • image.png

This worked fine in the simulator but not on my device. I just got a blank white screen where the image should be.

I finally renamed the high resolution image to:

  1. image~iPhone@2x.png

Moving the '@2x' modifier after the device modifier(~iPhone) when referencing my images allowed it to work the way I understood that it should from reading Apple's docs. I was under the impression that you didn't need to include the device modifier when referencing images but I had to.

To sum up, I am now using - image~iPhone.png to reference my images in IB and programatically for some images. I now get iOS recognizing that I am on a retina screen and loading the @2x images accordingly. So the @2x modifier had to go at the end and the ~iPhone modifier had to be included in the name of the '.png'.

That is what worked for me. Hope it helps someone else. Note that I am only building my app for iOS4.1 and above so there might be some issues with this if you are supporting previous version.

clintsmith
  • 695
  • 6
  • 16
0

iOS file system is case sensitive and device modifiers should be lowercase, it should be

image~iphone.png
image@2x~iphone.png

The @2x comes before the device modifier.

See the resource programming guide

bandejapaisa
  • 26,576
  • 13
  • 94
  • 112
0

iOS does not automatically pick the right image for the device like that. You are going to have to write code to check which device it is, and set the image by full name.

e.g. if ([[UIScreen mainScreen] scale] == 2) // set hi res image

Or, you can just use the same image in both, and set the content mode to scale to fill. It will look the same.

EDIT: Try writing either ~iphone (lowercase), or just don't write ~iPhone at all on the file name. If your app is not universal, then writing the ~iphone suffix is completely pointless.

Greg
  • 9,068
  • 6
  • 49
  • 91
  • Thanks for your answer but it seems to contradict what the Resource Programming Guide says: "The bundle- and image-loading routines automatically look for image files with the @2x string when the underlying device has a high-resolution screen." and "The system automatically determines which version of the image is most appropriate and loads it. Similarly, when using or drawing that image, you do not have to know whether it is the original resolution or high-resolution version. The image-drawing routines automatically adjust based on the image that was loaded." – clintsmith Jul 08 '11 at 17:08
  • I figured out why it's not working. See my updated answer. I know it contradicts what the docs say, but from my experience it's still safer to either check manually or just always use the hi res image and let the system scale it down. – Greg Jul 08 '11 at 22:53