iOS 7 App Icons, Launch images And Naming Convention While Keeping iOS 6 Icons

Question

I just finished an app on iOS 6 and bought a developer account a week ago so haven't had much time playing with the iOS 7 SDK. Just downloaded the Golden Master version and trying to upgrade my app to be compatible with iOS 7.

I realised that iOS 7 requires a little work with app icons. I have checked many related question and i am confused what to do. I already have an iOS 6 app with app icons and when i installed the golden master version i saw the following:

iOS 7 App Icons

and for launch images:

iOS 7 Launch Images

I can create new flat icons for iOS 7 while i want iOS users to keep seeing the old ones.

What should i do? Use the "Use Asset Catalog" or add the icons manually and if i am adding the icons manually then what should i name these images? Thanks!

Tarek Hallak · Accepted Answer · 2013-09-13T11:31:38.173

78

Absolutely Asset Catalog is you answer, it removes the need to follow naming conventions when you are adding or updating your app icons.

Below are the steps to Migrating an App Icon Set or Launch Image Set From Apple:

1- In the project navigator, select your target.

2- Select the General pane, and scroll to the App Icons section.

enter image description here

3- Specify an image in the App Icon table by clicking the folder icon on the right side of the image row and selecting the image file in the dialog that appears.

enter image description here

4-Migrate the images in the App Icon table to an asset catalog by clicking the Use Asset Catalog button, selecting an asset catalog from the popup menu, and clicking the Migrate button.

enter image description here

Alternatively, you can create an empty app icon set by choosing Editor > New App Icon, and add images to the set by dragging them from the Finder or by choosing Editor > Import.

edited Sep 13 '13 at 11:31

answered Sep 13 '13 at 11:16

Tarek Hallak

18,422
7
59
68

In short, first of all i have to browse and set images according to the dimensions given in the table and then may be migrate them to Asset Catalog for both iOS 6 and iOS 7. Right? – AJ112 Sep 13 '13 at 11:51
2

Yes, your old images will be migrated immediately, but new images need to be redesigned for sure, but at least you can know exactly what icons or image you need to relayout through the Asset Catalog. – Tarek Hallak Sep 13 '13 at 12:07
1

Since doing this I seem to lose my AppIcon in Organizer and for TestFlight; it all seems to work on the device tho—is there something else I need to do for those to work too, I've tried ALSO having CFBundleIcons, any idea? – PaulJ Sep 25 '13 at 09:53
I've found with multiple target projects it is best to take the alternative route and create new asset files for each target. Sometimes the migration option gets confused. Each asset is then assigned a single target membership. – RobCroll Sep 25 '13 at 23:53
Thank you! I was trying to find a way to edit those rows. If you have XCode windowed (rather than full screen) the folder buttons can be hidden behind the right hand toolbar. – HaemEternal Oct 15 '13 at 15:25
Same problem as PaulJ. Organiser and AdHoc builds built via Archive are not showing an icon. – Danoli3 Nov 04 '13 at 07:36
For the TestFlight and Organizer bug, see my solution below – Danoli3 Nov 18 '13 at 04:31
Asset Catalogs do not work properly for iPhone launch images that target versions of iOS older than 7 and will not display them if used. – ccjuju Mar 21 '14 at 07:06

score 24 · Answer 2 · answered Mar 12 '14 at 14:03

24

You should use Asset Catalog:

I have investigated, how we can use Asset Catalog; Now it seems to be easy for me. I want to show you steps to add icons and splash in asset catalog.

Note: No need to make any entry in info.plist file :) And no any other configuration.

In below image, at right side, you will see highlighted area, where you can mention which icons you need. In case of mine, i have selected first four checkboxes; As its for my app requirements. You can select choices according to your requirements.

enter image description here

Now, see below image. As you will select any App icon then you will see its detail at right side selected area. It will help you to upload correct resolution icon. enter image description here

If Correct resolution image will not be added then following warning will come. Just upload the image with correct resolution. enter image description here

After uploading all required dimensions, you shouldn't get any warning. enter image description here

answered Mar 12 '14 at 14:03

msmq

1,298
16
28

Hi: I've got this issue, I have all the setup like u did. When I run app, which simulator will show icon, but no matter if I do all the cleaning and rebuild, but when I deploy to a real iPhone 5s, it never shows. – phil88530 Jul 30 '14 at 11:09
@phil88530 please make sure, you have selected iOS 7.0 and Later Sizes as well (like in above screenshots). secondly, also make sure, you are using latest XCode version like v 5.1.1 or higher. – msmq Jul 30 '14 at 12:31
If you want to save yourself some time with resizing all the icons, you can use this app, it generates the app icon asset catalog for you: https://itunes.apple.com/app/id1052532083 (disclaimer: this is my app) – Erik Nov 24 '15 at 17:34

score 14 · Answer 3 · answered Nov 08 '13 at 02:49

14

In case you do not want to use Asset Catalog, you can add an iOS 7 icon for an old app by creating a 120x120 .png image. Name it Icon-120.png and drag in to the project.

Under TARGET > Your App > Info > Icon files, add one more entry in the Target Properties:

enter image description here

I tested on Xcode 5 and an app was submitted without the missing retina icon warning.

answered Nov 08 '13 at 02:49

ohho

50,879
75
256
383

2

You may also want to add Icon-76.png and Icon-152.png. Also make sure that the icons are listed in "Build Phases" > "Copy Bundle Resources" (see http://stackoverflow.com/a/12225627/376066) – Mikhail Nov 23 '13 at 11:20
+1 for your description of WHERE to add the icon info. Thanks! – TJ Asher May 08 '14 at 21:01
this is really word thanks dear i spend two hour for setting APPICON for drag & drop this is not work for me but using.plist file is work...thnks a lottttt. – Yagnesh Jun 24 '14 at 05:29

Danoli3 · Answer 4 · 2013-11-04T13:11:12.627

Okay adding to @null's awesome post about using the Asset Catalog.

You may need to do the following to get the App's Icon linked and working for Ad-Hoc distributions / production to be seen in Organiser, Test flight and possibly unknown AppStore locations.

After creating the Asset Catalog, take note of the name of the Launch Images and App Icon names listed in the .xassets in Xcode.

By Default this should be

AppIcon
LaunchImage

[To see this click on your .xassets folder/icon in Xcode.] (this can be changed, so just take note of this variable for later)

What is created now each build is the following data structures in your .app:

For App Icons:

iPhone

AppIcon57x57.png (iPhone non retina) [Notice the Icon name prefix]
AppIcon57x57@2x.png (iPhone retina)

And the same format for each of the other icon resolutions.

iPad

AppIcon72x72~ipad.png (iPad non retina)
AppIcon72x72@2x~ipad.png (iPad retina)

(For iPad it is slightly different postfix)

Main Problem

Now I noticed that in my Info.plist in Xcode 5.0.1 it automatically attempted and failed to create a key for "Icon files (iOS 5)" after completing the creation of the Asset Catalog.

If it did create a reference successfully / this may have been patched by Apple or just worked, then all you have to do is review the image names to validate the format listed above.

Final Solution:

Add the following key to you main .plist

I suggest you open your main .plist with a external text editor such as TextWrangler rather than in Xcode to copy and paste the following key in.

<key>CFBundleIcons</key>
<dict>
    <key>CFBundlePrimaryIcon</key>
    <dict>
        <key>CFBundleIconFiles</key>
        <array>
            <string>AppIcon57x57.png</string>
            <string>AppIcon57x57@2x.png</string>
            <string>AppIcon72x72~ipad.png</string>
            <string>AppIcon72x72@2x~ipad.png</string>
        </array>
    </dict>
</dict>

Please Note I have only included my example resolutions, you will need to add them all.

If you want to add this Key in Xcode without an external editor, Use the following:

Icon files (iOS 5) - Dictionary
Primary Icon - Dictionary
Icon files - Array
Item 0 - String = AppIcon57x57.png And for each other item / app icon.

Now when you finally archive your project the final .xcarchive payload .plist will now include the above stated icon locations to build and use.

Do not add the following to any .plist: Just an example of what Xcode will now generate for your final payload

<key>IconPaths</key>
<array>
    <string>Applications/Example.app/AppIcon57x57.png</string>
    <string>Applications/Example.app/AppIcon57x57@2x.png</string>
    <string>Applications/Example.app/AppIcon72x72~ipad.png</string>
    <string>Applications/Example.app/AppIcon72x72@2x~ipad.png</string>
</array>

iOS 7 App Icons, Launch images And Naming Convention While Keeping iOS 6 Icons

4 Answers4

Do not add the following to any .plist: Just an example of what Xcode will now generate for your final payload

Linked