Xcode 6 device-specific asset catalog

Asked 21/9, 2014 at 0:49 Answered 19/8, 2015 at 11:27

I'm trying to update my app for the new 6 and 6+ devices.

I've added launch images for the new iPhone sizes (6 and 6+). There are entries in the asset catalog for both the 6 and 6+. No problem there.

I also have some full-screen view overlay images that I need to add as well. I already have images for these in @2x (iPhone 4s) and R4 (iPhone 5 5s 5c). I've created images at the new resolution sizes, but I'm not sure how to add them into an image set.

When I go into the asset catalog, I can choose device-specific in the image set, and I see entries for iPhone, retina-4, and iPad. There are drag/drop wells for 1x, 2x, Retina 4 2x, and 3x.

My question - where should I put the image for the iPhone 6? Obviously the 3x is for the 6 plus. I don't see how the retina-4 well can be used for both the iPhone 5 and iPhone 6 because the screen sizes are different.

What am I missing?

Thralldom answered 21/9, 2014 at 0:49 Comment(1)

maybe extend the topic for the question for Xcode 6 and above ? (see my answer to find out why I suggest it) – Craver 19/8, 2015 at 11:28

I'm fairly certain that this is a bug in Xcode 6. When you load an image from an asset catalog image set, you will always get the 3x entry for an iPhone 6+ whether you are zoomed or standard display mode. For an iPhone 6, you will always get the 2x entry in both modes. For an iPhone 4s, you will also get the 2x entry.

All these devices have different scaling and aspect ratios, so this is not acceptable for pixel-accurate images. My images are all full-screen and meant to be overlays, so I was seeing incorrect placement when in zoomed mode.

I worked around this problem by creating two image sets:
1) iPhone 6/6plus in standard mode
1242x2208 image in the 3x entry
750x1334 in the 2x entry

2) iPhone 6/6Plus in zoomed mode or iPhone 5
1125x2001 for the 3x entry
640x1136 for the 2x entry
640x1136 for the R4-2x entry

To make this work, I then need to determine if the device is one of the new ones and if they are in zoomed mode. Based on this information, I load the image from the correct image set.

This is the code I use to determine if the device is one of the new ones in zoomed/standard mode:

UIScreen *screen = [UIScreen mainScreen];
if (screen.scale == 3 && screen.currentMode.size.width == 1242 ||
    screen.scale == 2 && screen.currentMode.size.width == 750) {
    self.overlay = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"StdImageSet"]];
} else {
    self.overlay = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"ZoomedImageSet"]];
}

This is ugly, and I hate having to do this, since image sets are supposed to eliminate this kind of code. I haven't seen a better way around this, and I've filed a radar (radar 18463463) bug.

Thralldom answered 4/10, 2014 at 4:37 Comment(2)

Thank you for this. I was pulling my hair out trying to understand why the 6+ is loading full sized images in zoom mode. – Fellatio 14/1, 2015 at 20:31

Thank you for this. It's very frustrating. What worries me is that Xcode has now been updated for the the iWatch but there's no sign of this bug being fixed. It has to be a bug, right…? I'm reporting it as one any. Hopefully they will fix this. – Franchot 13/5, 2015 at 22:40

I found this helpful: http://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions

Seems the iPhone 6 will use a resampled @2x (iPhone 5) image. Also, the image set's properties (utilities pane) lets you switch between 'Universal' (x1, x2, x3) and 'Device-specific' image wells.

Ranna answered 22/9, 2014 at 12:16 Comment(8)

Yes, that is a useful explanation of how the 6+ scales. However, I believe that doesn't answer my question. After experimentation, I found that in Xcode 6.0.1, iPhone 6 images should go into the \@2x well. I think that this is a bug, because there is now no place to put \@2x images intended for the iPhone 4s (which is still supported in iOS8) Also, there is no place in the image set to put images for the display zoom modes of the iPhone 6 and 6+. – Thralldom 26/9, 2014 at 0:43

I'm building a Universal app, and my iPhone 5/5s and iPhone 6 images are both taken from the Retina 4 2x well (320x568 points), as per the explanation in the link. This is separate from the 2x well used for the iPhone 4s. The iPhone 6 images are upsampled to 750x1334 pixels before being rendered. – Ranna 26/9, 2014 at 7:20

@KurtSchwartz, I stand corrected. I double-checked after posting my comment, and the iPhone 6 is indeed using the 2x image intended for the iPhone 4s - not the one from the retina 4 2x well. The PaintCode link appears to be wrong, and it does look like a minor bug. However, it doesn't make much difference - either way the image is shared between the iPhone 6 (upscaled) and another model. – Ranna 26/9, 2014 at 7:43

I've filed a radar on this. In addition to the missing drop-well for 640x960 2x images, I think that to get pixel-accurate images on a iPhone 6+ in zoom display mode, Xcode image sets need one additional drop-well for 1125x2001 3x images. For zoom mode images on a 6, I think the retina-4 2x images should be loaded automatically when the device is in this mode. I suspect that the 2x images are loaded instead. but I don't have a 6 and so I can't test this. – Thralldom 26/9, 2014 at 7:58

I think the PaintCode link is correct, but the UIImage loading mechanism is broken on iPhone 6. I just tried this and iPhone 6 really ignores Retina 4 asset version. – Audreaaudres 26/9, 2014 at 9:40

Looks like UIImage also can't figure out the difference between an iPad in Portrait & Landscape mode: see #26026605 – Ranna 26/9, 2014 at 9:56

Oh wow, good spot. It's crazy that it uses the 4/4S image size; that has to be a bug. – Sherr 3/10, 2014 at 20:41

Is there any additional feedback regarding this issue? The only problem that I currently have with the asset catalog is for iPhone 6 - it loads the @2x image and not the supposed -568h@2x one. – Whey 4/11, 2014 at 11:16

This is really annoying. For device-specific setting, we would all expect a menu like in LaunchImage Set, different placeholders for different screen sizes.

Trifle answered 16/3, 2015 at 7:51 Comment(0)

I place here some of my observations which I did for iPhone devices (maybe someone will find it helpful):

iPhone 4S - 2x Any/Any tile
iPhone 5 - 2x 1GB/Any tile
iPhone 5S - 2x 1GB/Any tile
iPhone 6 - 2x 1GB/Any tile
iPhone 6 Plus - 3x 1GB/Any tile

To achieve this I checked Devices - iPhone, Memory 1GB. As you can see there is no distinction for graphics between iPhone 5/5S/6. Maybe playing with settings for Metal 1v2/2v2 could be distinguish but this looks to me like going too crazy. Knowledge reference starts at 10:50

What I got from WWDC right now we should think not resolution/device/device orientation specifics but focus on a size classes (which are the same for iPhones except 6 Plus) but if anyone would still, for some reasons, need that device specific graphics and wants to use asset catalogs (which are great) then here you get what I found available at the moment (Xcode 7).

Craver answered 19/8, 2015 at 11:27 Comment(1)

Agree with you, it is totally weird that there is no possibility to distinguish iPhone 5/5S/6 – Staples 16/10, 2015 at 16:8

Just found a new solution for this issue. Use the retina 4 image for 2x and set the full screen image view's content model to scale aspect fill will get it working on both iPhone 4s and iPhone 6.

Retinitis answered 22/1, 2015 at 17:11 Comment(1)

That's not a good solution because it will kinda crop the image. – Diphtheria 31/3, 2015 at 16:18

Recommended topics

Hot tags