So Ive raised a topic on this before because its something that has created a lot of confusion for me, and I'm sure it has for a lot of other users. Currently I have my Xcode project and my assets manager as comes supplied with every project created. by default an AppIcon already exists in here which looks a little like so...
You can see that this (the default) AppIcon has 3 types of icon that have to be loaded in. Currently I have 3 images:
a 87x87#3x
a 120x120#3x
and a 180x180#3x.
I have no idea what the extension means (the #3x bit) so it would be nice if someone wouldn't mind explaining that to me aswell. But back to the main problem I'm having...
I find that when I go to create a new AppIcon, although its not necessary as I could just replace the images in the old AppIcon that is created by default, it does have a different interface which looks as follows:
Now you should be able to see that the the "slots" in the new AppIcon are empty because I have absolutely no idea about what dimension images I am supposed to be supplying and to where they are supposed to go to within here. I also have no idea what extensions my images are supposed to be using and how many I am supposed to have. The whole process seems quite overwhelming and ridiculously complicated. I'm utterly confused as to why apple have made this so inefficient and just plain confusing :/
I have been looking at an icon generator which seems rather useful (as recommended in my last thread):
https://itunes.apple.com/us/app/asset-catalog-creator-app/id809625456?mt=12
and I have also had a look at this although it doesn't seem particularly helpful:
http://martiancraft.com/blog/2014/09/vector-images-xcode6/
I have mainly been looking at this however it doesn't seem to offer much help if I'm honest:
https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/IconMatrix.html#//apple_ref/doc/uid/TP40006556-CH27-SW2
So to sum things up...
What resolution images do I need for app icons?
Which AppIcon template am I using, the default or a newly created?
What extensions do my images need? ("#2x", "#3x" etc.)
What do the extensions mean/do?
Thanks anyways!
-Ryan
UPDATE 1!
I have kindly been provided a great link for a app icon generator which works online, it seems very quick and very reliable and anyone having the same issues, I would recommend you give this a try :)
IconMaker
Older question, but I use the following shell script to convert a PNG to the different icon sizes. Just make sure your input file is big enough. I use something like 2048x2048 so it can generate everything.
For the convert commandline tool, first install Homebrew: https://brew.sh/
Then install ImageMagick via:
$ brew install imagemagick
Adapt the orig and new_prefix variables if you wish, then run the script.
#!/bin/sh
orig="appicon.png"
new_prefix="appicon_"
iphone_settings="58 87"
iphone_spotlight="80 120"
iphone_app="120 180"
ipad_settings="29 58"
ipad_spotlight="40 80"
ipad_app="76 152"
ipad_pro_app="167"
iphone_ipad_notification="20 40 60"
app_store_icons="512 1024"
launch_icons="640x1136 640x960 320x480 1536x2008 768x1004"
for i in $iphone_settings $iphone_spotlight $iphone_app $ipad_settings $ipad_spotlight $ipad_app $ipad_pro_app $app_store_icons $iphone_ipad_notification; do
echo "Resizing to $i x $i"
convert -resize $i $orig ${new_prefix}${i}.png
done
#3x if for the new resolution on iPhone 6 Plus and iPhone 6s Plus.
#2x is for the normal retina resolution.
Its related to the resolution of the image. an image 40x40 needs 3 files:
image.png 40x40
image#2x.png 80x80
image#3x.png 120x120
this applies for all the images used in the app, not only the icon.
Have you tried this one? MakeAppIcon
Its excellent to generate the icons.
Related
I've read numerous other answers for this, but I thought it was worth posting the same question with an addendum..
I actually solved this exact same problem once before by adding the correct images in my images.xcassets window, however I don't recall how I figured out which boxes to put the image in? How do I link the errors to the correct box?
Are you using Cordova? I see you tagged it but have no mention of it?
If you are just to save you some time and effort theres a really good npm plugin that generates all this for you & my xcode picked up all the different sizes automatically. cordova-icon.
It's really simple, just have an icon.png in your root and run cordova-icon in your console. It generates icons for android iOS and windows.
I originally saw the new asset catalog feature in XCode5 and was pretty pleased - no more messing about with dozens of different versions of the files, I thought.
But it doesn't seem to actually make anything any easier. It still doesn't simply tell me "you need an image of 114x114 pixels here". And it seemingly will let me specify any image of any size for each icon variant. Does it magically resize my images, or will things just break, if I supply a 50x50 icon when it expects a 72x72 one?
All I want is a list of "these are the exact files you need to supply" and "these are the ones you didn't supply yet". Perhaps I am misunderstanding how this is to be used, because a utility which won't complain about being given bad data seems worse to me than no utility at all!
If what you want is, as you said: a list of "these are the exact files you need to supply" and "these are the ones you didn't supply yet", maybe you can try the the "Don't use asset catalogues" option of the drop-down menu of App Icons or Launch Images.
Here it is what it will look like then:
Does anyone know why Xcode (4.6.3) would start TiffUtil in the Copy Resources Phase instead of just copying PNG files to the bundle using CpResource . I'm now ending up with some normal PNG icons and splash screens and a few tiffs. I've checked the images, there doesn't seem to be anything wrong with them.
Thanks,
Daniel Dekkers
I ran into this last week!
The problem was in the build settings.
Combine High Resolution Artwork COMBINE_HIDPI_IMAGES
Combines image files at different resolutions into one multi-page TIFF
file that is HiDPI compliant for Mac OS X 10.7 and later. Only image
files in the same directory and with the same base name and extension
are combined. The file names must conform to the naming convention
used in HiDPI. [COMBINE_HIDPI_IMAGES]
It wants to take your x.png and x#2x.png and turn it into a multi-page TIFF. But since this option isn't valid for iOS, none of your images will work correctly.
So, in the build settings, try and find "Combine High Resolution Artwork" and turn it off. If its not in there, you can also search for the COMBINE_HIDPI_IMAGES flag and turn it off.
I'm trying to clean up my project in iOS XCode. I know you can do this in other tools but I'm unsure with Xcode. I have googled but I'm getting the impression this can't be done. Is there a way to search your project for unused items i.e. images and then remove them if not required?
Have you heard about Slender :
is one of tools that tells you which asset files aren't being used. Along the way, you can also see which assets are missing their #1x counterparts, or if your #2x images have incorrect pixel
Slender Link
Hope it helps.
There is also one question that helps you too How to find unused images in an XCode project?
I am in the process of updating Hungry Helga (iPhone and iPad versions) for iOS 6, and all of the PNG files in my new app bundle archives are between 20 and 40 percent larger than they were in my past releases. Of course, this is putting me over the 3G download limit of 50 MB so I'd really like to figure out what's going on.
I am currently using version 4.5 of Xcode on OSX 10.7.5. If I recall correctly the previous version was built with Xcode 4.2. I tried turning on and off PNG compression in the build settings but that had no effect on the image sizes in the bundle.
To give a concrete example, my largest PNG image is 1.9 MB as a source asset. It is 2.1 MB in the old app bundle, and 2.5 MB in the new app bundle.
Did Apple change the way the PNG compressor works or is there maybe a setting that I'm missing or something?
I do not work for Apple nor do I have any inside information - however, I did poke around and have some theories. If you use terminal you can cd into the Xcode.app and find pngcrush there:
$ find . -name pngcrush
./Contents/Developer/Platforms/iPhoneOS.platform/Developer/usr/bin/pngcrush
If you then run:
./pngcrush -?
you find some interesting tidbits:
| It was compiled with LLVM 4.2.1 Compatible Apple Clang 4.0
(tags/Apple/clang-420.0.12) and modified by Apple as indicated in the
sources.
and
-iphone (optimize for iPhone OS)
Since I too saw that some large pngs where also much larger in the bundle than the original (which I had previously crushed myself!), I wanted to see how Xcode uses pngcrush. I used an old UNIX trick:
move pngcrush to xpngcrush
create a new executable shell file that calls pngcrush with the same argument list
log the arguments into a text file in /tmp
What I found was that Apple calls pngcrush as:
pngcrush -q -iphone oldFile newFile
One can infer from this that this Apple specific feature of pngrush was designed specifically to tailor the image for iOS. I say tailor, not crush.
Does Apple really care if your png is the smallest possible file, to save the greatest amount of space? I'd argue, not really - the devices have fairly large file storage space. Do they really care if your app downloads really fast? Again, I'd argue not really, since the user is going to assume the time is related to the size of the app, and that that is under the control of the developers.
However, what the user is going to hold Apple accountable for is the launch speed. From the first tap to when the app starts doing something - people will believe that is all the speed of the device (which we developers know is not strictly true). With the new iPad3, some of the launch images are now really big, so what can be done to make loading them as fast as possible?
I don't know the answer to that question, but I can imagine that Apple decompresses the original image, then re-compresses it with settings that make loading it in the device as fast as possible.
PS:
1) I just disabled the crush option, and observed Xcode 4.5 copying my png files without modification.
2) To get your app size down, have you tried using JPEGs with a high quality setting - even 1? Such images will look very good and be much much smaller. Virtually all images in my app are JPEGs. You can experiment with Preview to do the conversions.
EDIT: it occurred to me there may be an elegant solution to this. That is, for really important images - ones that you want to appear as fast as possible - then use pngcrush with the '-iphone' flag. For others, use more standard pngcrush options.
One way to do this is to create a new image directory, and write a shell file that pre-processes every png with a real crusher or tje '-iphone' flag, putting the output in the original image folder (where Xcode can get them). Then turn off the automatic 'Crush PNG Files' option.
EDIT2: I entered a bug at bugreporter.apple.com and posted on the Xcode listserv - if you have an interest in this bookmark the question and come back when its updated.
EDIT3: someone gave me a link that explains in more detail the how and why of Apple's '-iphone' option ImageOptim
EDIT4: Apple responded to my bug report, confirming that they modify the images for easier processing by iOS, which may make them larger, by intent.
Xcode 5 now got changes in image compressions. the best and compressed way is to use asset catalogs.
If even using Xcode 5 and asset catalogs doesn't result well for your app, check the other relative post PNG optimization issue using pngcrush tool for more answers could be helpful
Using David H's script, I found that Xcode is also passing the command line parameter "-f 0" to pngcrush. The man page indicates that the "-f 0" will disable any IDAT filtering before compression which can result in a larger PNG file. Testing on my 1.9 MB example file from above confirms:
pngcrush -iphone in.png out.png gives the 2.1 MB result that I am looking for
pngcrush -iphone -f 0 in.png out.png yields the undesired 2.5 MB result
Now the questions are: Why did Apple change this? Will it break image loading in some way if I work around it? If not, is there a setting for this in Xcode or will I always have to use a script to filter out the "-f 0" argument?