During the iOS 8/OS X 10 10 Keynote, someone mentioned that Xcode assets would now support PDF vector art. I was thrilled. I’ve been waiting for a long time for vector art to form part of the Cocoa touch development arsenal. Unfortunately, the reality is not nearly as interesting as the promise.
Yes, you can add PDF art to asset groups but the size of the art is fixed. When you create a UIImage with a PDF source it gets rasterized. The result stretches with the underlying bits, not vectors:
Compare that to the original art, which was 35×40 in size, scaled for preview on OS X:
So what do you do? The simplest answer is to create multiple PDF images and treat them the way you would PNG images, whether using a simple retina pair or building icons and launch assets. So your asset’s contents can end up looking like this:
{ "images" : [ { "size" : "29x29", "idiom" : "iphone", "filename" : "AppIcon29x29.pdf", "scale" : "1x" }, { "size" : "29x29", "idiom" : "iphone", "filename" : "AppIcon29x29@2x.pdf", "scale" : "2x" }, { "size" : "29x29", "idiom" : "ipad", "filename" : "AppIcon29x29@2x~ipad.pdf", "scale" : "2x" }, { "size" : "29x29", "idiom" : "ipad", "filename" : "AppIcon29x29~ipad.pdf", "scale" : "1x" }, { "size" : "40x40", "idiom" : "iphone", "filename" : "AppIcon40x40@2x.pdf", "scale" : "2x" }, { "size" : "40x40", "idiom" : "ipad", "filename" : "AppIcon40x40@2x~ipad.pdf", "scale" : "2x" }, { "size" : "40x40", "idiom" : "ipad", "filename" : "AppIcon40x40~ipad.pdf", "scale" : "1x" }, { "size" : "50x50", "idiom" : "ipad", "filename" : "AppIcon50x50@2x~ipad.pdf", "scale" : "2x" }, { "size" : "50x50", "idiom" : "ipad", "filename" : "AppIcon50x50~ipad.pdf", "scale" : "1x" }, { "size" : "57x57", "idiom" : "iphone", "filename" : "AppIcon57x57@2x.pdf", "scale" : "2x" }, { "size" : "57x57", "idiom" : "iphone", "filename" : "AppIcon57x57.pdf", "scale" : "1x" }, { "size" : "60x60", "idiom" : "iphone", "filename" : "AppIcon60x60@2x.pdf", "scale" : "2x" }, { "size" : "72x72", "idiom" : "ipad", "filename" : "AppIcon72x72@2x~ipad.pdf", "scale" : "2x" }, { "size" : "72x72", "idiom" : "ipad", "filename" : "AppIcon72x72~ipad.pdf", "scale" : "1x" }, { "size" : "76x76", "idiom" : "ipad", "filename" : "AppIcon76x76@2x~ipad.pdf", "scale" : "2x" }, { "size" : "76x76", "idiom" : "ipad", "filename" : "AppIcon76x76~ipad.pdf", "scale" : "1x" } ], "info" : { "version" : 1, "author" : "arthelper" } }}
That’s silly on several levels. For one thing, no matter how compact your vector art is, 17 copies of it can become substantially larger than 17 very tiny PNGs. (The 19 items in the following includes the app icon set folder and the JSON contents file.)
Thinking myself clever, I tried creating a version where all items in the icon set pointed to the same image resource. I figured, why not have each item load the same material since it’s vector based to begin with. The tl;dr version is this: it didn’t work. Xcode would not load assets formatted in that way.
The only bright side arrives in the default image side of things. With default images, art follows many geometries — or at least at this time, who knows what it will be at the end of this summer, or by the time I finish catching up with the WWDC videos. Because of this and their naturally large sizes, my PDF tests regularly improved over the PNGs they replaced for launch images. It’s still pretty redundant for retina and non-retina screens, but it was less bad than a full suite of launch PNGs in my tests.