iPad Retina Display Suffix

Question

I'm looking to put iPad retina (crazy!) quality images into my app for the 'New iPad's launch on the 16th Martch. However I can't find the correct suffix for my file names anywhere in the documents!

I use @2x suffix for iPhone and iPod retina display. If anyone else knows what it is/will be for the iPad and, even more, can show me a link to the official documents on this I'd really appreciate it.

Thanks! :-D

EXTRA:

Thought I'd just leave a bit of code I've started using to use my iPhone @2x images for the iPad non-retina ones (as most of my @2x~iphone and ~ipad images were the same and duplicates are just a waste of space).

+ (UIImage*)imageNamedSmart:(NSString*)name
{
    UIImage *returnImage = [UIImage imageNamed:[NSString stringWithFormat:@"%@", name]];

    if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
    {
        if ([[UIScreen mainScreen] respondsToSelector:@selector(scale)] && [[UIScreen mainScreen] scale] == 2)
        {
            // iPad Scale 2  i.e. 3rd Gen iPad
        }
        else
        {
            // iPad Scale 1  i.e. 1st and 2nd Gen iPad
            return [UIImage imageNamed:[NSString stringWithFormat:@"%@@2x", name]];
        }
    }
    return returnImage;
 }

This means instead of calling:
[UIImage imageNamed:@"imageName"]

You call:
[self imageNamedSmart:@"imageName"]

Hope this help people a bit more. :-D

(I found this idea by goggling but I can't find the original site to link, so thank you whoever you were.)

Hint: `imageNamed:` does all the work for you already. It knows about all 4 resolutions and prefixes. ;-) — Constantino Tsarouhas, Jun 15 '12 at 16:55
Yeah but you'd still have to put double the image files in, each with there own name. This way it means you can use a name@2x.png for the name~ipad.png with only one image and the code works out what to use. And as I found out when you have a universal app with iPhone and iPad retina, it gets big, fast. :-D — Baza207, Jun 16 '12 at 19:39
Indeed, this is probably the biggest downside of universal apps: bigger size. — Constantino Tsarouhas, Jun 18 '12 at 19:28

score 38 · Accepted Answer · answered Mar 10 '12 at 22:10

38

You will have to append @2x~ipad to the name of your image in order to support retina graphics.

answered Mar 10 '12 at 22:10

thvanarkel

1,601
1
12
19

Cheers @thvanarkel I did find that from the Icon images, but do you know where it says it in the docs? – Baza207 Mar 10 '12 at 22:12
Just found this in the docs. Cheers again thvanarkel. :-D https://developer.apple.com/library/ios/#documentation/Cocoa/Conceptual/LoadingResources/ImageSoundResources/ImageSoundResources.html – Baza207 Mar 10 '12 at 23:22
@2x~ipad would make it target iPads only though, if you wanna support iPhone and iPad e.g. for icons, you can just go for @2x anyway. – alex Mar 10 '12 at 23:37
No, you do not want to do that as usually the retina image for iPad is different than the retina image for iPhone (iPad images are mostly larger than their iPhone counterparts). You use @2x for iPhone retina artwork and @2x~ipad for iPad retina artwork. – thvanarkel Mar 11 '12 at 05:47
@thvanarkel actually not all of us have our projects set up the same way. 95% of my iPhone Retina bitmaps can be used for my iPad Retina bitmaps. I often use the same bitmap, however I re-layout the GUI specifically for each device. If you properly use stretchable images and layout dynamically, you can mostly get by using the same bitmaps for both Retina displays. There are certainly a few exceptions, and ideally you could draw those using Core Graphics when needed. – Jeshua Lacock Mar 16 '12 at 20:22
1

Came here wondering whether it's `@2x~ipad` or `~ipad@2x`. Thanks for the clarification! (In other news, it's the middle of August already, and Apple's documentation still doesn't clarify this anywhere. Wow.) – Greg Aug 20 '12 at 06:19
1

Apple does clarify it : The order of the modifiers is critical. If you incorrectly put the @2x after the device modifier, iOS will not find the image (https://developer.apple.com/library/ios/documentation/2DDrawing/Conceptual/DrawingPrintingiOS/SupportingHiResScreensInViews/SupportingHiResScreensInViews.html) – Ronny Webers Mar 15 '14 at 20:11

score 0 · Answer 2 · answered Mar 21 '12 at 23:44

0

If both the iPhone and iPad retina images are the same size, then use only one image with the @2x suffix. In this case, even the iPad retina uses this image.

If the iPhone and iPad retina images are not the same size, then use an image with the @2x suffix for the iPhone and another image with the @2x~ipad suffix for the iPad. For example, the launch images have different sizes, so you might need Default@2x.png and Default@2x~ipad.png.

answered Mar 21 '12 at 23:44

Jarir

327
3
10

Are you 100% sure? I'm asking because i have an iPad only 'retina ready' app on App Store (retina images with '@2x' suffix) and today i saw that some images are loaded correctly and some not (on retina iPad). And yes, all the images are present/copied with installation. I'll try renaming them to '@2x-ipad' to see if this was the case. – Rok Jarc Mar 23 '12 at 10:51
There might be other answer to what i wrote above - app was compiled with XCode 4.2.1 - which "doesn't know" about retina iPad. :) – Rok Jarc Mar 23 '12 at 11:16

iPad Retina Display Suffix

2 Answers2