Retina icons (@2x) aren't being used when images are specified in code

Question

I place a play.png image onto my view. When the view initially loads, the iPhone 4 grabs the corresponding [email protected] file and it looks great. However, when I tap the play button my code swaps it out for the pause.png file. Then, when I tap the pause.png to bring back the play.png it uses the original play.png file (not the @2x version like I thought it would automatically reference).

This is the code I tried to use:

[button setImage:[UIImage imageNamed:@"play.png"] forState:UIControlStateNormal];

So, if I swap files after the initial view load, do I have to manually specify the @2x version inside an IF statement? If so, is the UIScreen.scale the best attribute to use for this?

I'm currently using code like this:

if ([UIScreen mainScreen].scale > 1.0) 
{ 
    [button setImage:[UIImage imageNamed:@"[email protected]"] forState:UIControlStateNormal]; 
} 
else 
{ 
    [button setImage:[UIImage imageNamed:@"play.png"] forState:UIControlStateNormal]; 
}

It's working fine but having the IF statement in there is annoying and seems a little fragile.

Thanks in advance to all you smarties out there.

Answer 1

The conditional statement is unnecessary. The following line is sufficient:

[button setImage:[UIImage imageNamed:@"play.png"] forState:UIControlStateNormal];

In iOS 4.0, the imageNamed: method automatically looks for the "@2x" filename suffix if the device is an iPhone 4 and has the retina display. In previous versions of iPhone OS, the imageNamed: method only looks for what you write (i.e., the lower-resolution image). This works because the iPhone 4 can't have a lower OS version then 4.0, so your retina display users will always have the higher resolution artwork.