6
votes

I have a question about updating my app's graphics for the retina display of the iPhone 4.

I am keeping each view's resolution to 480 x 320 Points.

So I was wondering: suppose I have a 100 x 50 UIImageView. It's better for my actual image I am going to load to be 200 x 100 pixels @ 163 ppi or 100 x 50 pixels @ 326 ppi? Is it the same thing in terms of 'lightness'? which is the preferred way?

Thanks, you're awesome

Lorenzo

3
Use two images, one for retina and one for old screens?user142019

3 Answers

16
votes

1) Define your UIImageView to be 100 x 50 pixels as you describe it above.

2) Have one image file that is 100x50 pixels "MyImage", and a second image file that is 200x100 pixels, and name it "MyImage@2x".

3) In your code, refer to the image file "MyImage".

iOS will automatically select the correct image. On older devices without the retina display (i.e., iPhone 3GS), the "MyImage" file will be used. On newer devices that have the retina display, the "@2x" version will be used.

0
votes

Hummm good question.

As I don't know how Apple is checking images, maybe you should load the 200x100 ones (by naming the file with @2x like [email protected] instead of image.png).

But if you try the other option and do some benchmarks, don't hesitate to tell us the results !

Good Luck

0
votes

Please correct me if i'm wrong, i'm not a graphics expert, but this is my understanding of the subject:

PPI - Pixels (or points) Per Inch - it is not a property of the image data, it's a property of the screen (hardware), and you in theory don't really have control over it. In other words, a png file does not describe how many points are to be displayed per inch, it will only describe the color of each pixel.

There is no such thing as an image file's PPI. You should keep the PPI of the target device in mind when deciding the image's resolution, in order for it to appear with the right size on the screen without having to stretch it out in your software and losing sharpness. A 100x100 image displayed on a 1 inch screen with have 100ppi, the same image on a 2 inch screen will be displayed with 50ppi.

So in short: Images don't have PPI's, they have resolutions, and this is what will decide the file's size.