Create images for iphone and ipad, 4 images?

Question

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. [email protected]
3. coinIpad.png
4. [email protected]

Can i create just the most-size image ([email protected]) and inside Xcode select Aspect Fit ?

[UIImage imageNamed:@"[email protected]"];

Which is the common way to do this?

Answer 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.

Answer 2

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.

Answer 3

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 [email protected] for retina image and coin~ipad.png for ipad images.

Xcode will call the appropriate image accordingly.

Answer 4

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.