How to minimize code when using different images for iPad and iPhone?

Question

I am almost finished with the iPhone version of my app when I realized that I'm going to have to (probably?) write conditionals for every UI element because they use different graphics. This will make my code very messy. I have 15 different custom UI controls and I can't imagine that setting up a conditional ("if ipad load image_ipad, if iphone load image_iphone") for every method is the best way to do this. Can anyone suggest a particular technique for dealing with this? Or is there a way to name images like you can between retina and regular?

Answer 1

You will need just to pass the basic image name .. lets say our image name is "Apple.png" ,, then you will write the get image name like this UIImage *image = [UIImage ImageNamed:@"Apple.png"] and the name for the image for the following cases will be :

1.iPad > put ~ipad , image name will be "Apple~ipad.png"

2.iPhone > put ~iphone , image name will be "Apple~iphone.png"

3.for retina display > put @2x , image name will be "[email protected]"

4.if you have diffrenet image for retina diplay for ipad and iphone it will be like this ,, for iPad "Apple@2x~ipad.png" ,, for iPhone "Apple@2x~iphone.png"

If you name it like this iOS will detect the best match image name and load it.

Answer 2

If you want to have versions for retina and non retina, you just have to save two versions of your asset in your bundle. If your asset is called button.png you save:

-button.png for the non retina version. [email protected] for the retina display version.

Your code:

UIImage * myImage = [UIImage imageNamed:@"button.png"];

The system will automatically check for the @2x.png if retina or it will pick the other for non retina

You can place myImage in your custom UI, and the OS does the rest for you ;-)