1

When i create an image for an ImageView to iPhone, iPhone retina, iPad, iPad retina, should i create 4 images ?

For example for a coin image that i use ->

  1. coin.png
  2. coin@2x.png
  3. coinIpad.png
  4. coinIpad@2x.png

Can i create just the most-size image (imageIpad@2x.png) and inside Xcode select Aspect Fit ?

[UIImage imageNamed:@"imageIpad@2x.png"];

Which is the common way to do this?

rmaddy
  • 314,917
  • 42
  • 532
  • 579
Godfather
  • 4,040
  • 6
  • 43
  • 70

4 Answers4

1

Creating only one image and relying on the device to resize it is:

  1. Inefficient - you're going to be using a lot of resources at runtime that should be busy doing other things
  2. Not the intended way - you should create 2 images (retina and non-retina). If you wish to use another set of images for iPad, you should either check which device you're running on at runtime by using:

[[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPad

or by splitting your project into 2 separate targets and adding the 2 sets of images separately to their correct target.

Stavash
  • 14,244
  • 5
  • 52
  • 80
  • So, for the current example, for every image if i want to support iPhone and Retina displays i must create 4 versions of the same image with differents sizes. Isnt? – Godfather Jul 02 '13 at 15:52
  • iPhone & Retina? I think you're confused with the available screens and devices. iPhones can also be retina and also iPad can be retina – Stavash Jul 02 '13 at 15:56
1

To answer you question as you asked it: Yes you can just use the highest resolution image only and have it fitted to the size that each device currently needs. You can to that by just initializing the UIImage with the named resouce, as you suggest, and assign that to an UIImageView with an appropriate frame in each device type.

Would I advice doing so? No!

Why?

  1. The naming conventions (~ipad and @2x) make it easy for you as programmer to provide perfectly fitted artworks for each resolution.
  2. You or your designer respectively are in full control over how the artworks will be displayed
  3. It saves memory and cpu and therefore even a bit of battery power.
  4. When it comes to very detailed or small graphics that don't rezise well, then you can consider creating slightly different ones for the lower resolutions that suit better for their current resolution

So if you just want to downsize a high-res image then download something powerful but cheap like gimp and reszise it once yourself (instead of having thouthands of mobile phones do it again and again), save them with poper names and include them in the boundle.

Hermann Klecker
  • 14,039
  • 5
  • 48
  • 71
0

All you need to do is to put coin when you want to call it.

For example:

[UIImage imageNamed:@"coin"];

But when put the images in the resources folder, name it as coin@2x.png for retina image and coin~ipad.png for ipad images.

Xcode will call the appropriate image accordingly.

lakshmen
  • 28,346
  • 66
  • 178
  • 276
  • 2
    Actually, with [tag:UIImage] you don't even need the `.png` part either. – Sam Spencer Jul 02 '13 at 16:29
  • So, the names of the files will be: coin.png, coin@2x.png, coin~ipad.png and coin~ipad@2x.png? i'm not sure about the last one, maybe coin@2x~ipad? – Godfather Jul 02 '13 at 21:38
  • http://stackoverflow.com/questions/9611061/how-to-support-both-ipad-and-iphone-retina-graphics-in-universal-apps <- It is coin@2x~ipad.png – Godfather Jul 03 '13 at 07:41
0

If you just want to have resizable assets that you can create once and use in different situations - have a look at this UIImage+PDF category that helps you use a PDF, which as a vector format can be scaled to whatever size without loss of quality.

Cacheing has been recently added, which should be a help as well.

Abizern
  • 146,289
  • 39
  • 203
  • 257