Dealing with graphical assets for iPhone 5/5S/6/6 Plus

Question

Since the induction of 6 and 6 plus its the first time I'm starting to work on a new app. Now I'm a bit confused about the use of graphical assets for my app. See for 5/5S things were pretty simple. If I have to make an image view of lets say 180 x 30 points then my image would of 2x resolution that would be 360 x 60 and would fit pretty good inside my image view. Now since 6 and 6 plus have different screen sizes than 5/5S and different resolutions, what is the recommendation here. Should I keep the image view size same on all three devices that is 180 x 30 points. If so, what image resolutions should I be using for the 3 different devices. It would be 2x for 5/5S but what about 6 and 6 Plus and how will Xcode determine to load those automatically? Or should I use different image view size that is larger than 180 x 30 for 6 and 6 plus? Im confused here that how this all works. Help is highly appreciated. Thanks

Answer 1

So your image view size should always be the same amount of points on the phone. Your image will be in the assets and will be different based on the device.

So if on the non retina screen you had 180x30 and on the 5s retina you used 360x60, you would keep the same 2x(360x60) for the 6 and then 3x for the 6+(540x90)

Just add the images to your assets in the correct buckets and it should be taken care of for you.

Answer 2

You should keep your image view point sizes the same but you should add a new pixel resolution for all of your images (3x) which will be used for the 6+. Although the 6+ is slightly less than exactly 3x resolution, the OS does some scaling so that you can just give a 3x image and it will work correctly.

A couple of Xcode versions ago Apple added asset catalogs that make it incredibly easy to manage having multiple resolutions. Just simply drag the correct images into their correct resolution bucket and it will work automagically. Much simpler than having to append @2x and @3x to all of your images like in older versions.