NEW! Pre-order my latest book, Testing Swift! >>

How to use vector images in your asset catalog

Paul Hudson       @twostraws

Xcode lets you use vector images for all your artwork, which saves you having to worry about retina artwork, super retina artwork, and whatever Apple dreams up in the future. Even better, using this vector artwork has no performance cost – iOS and Xcode do all the work for you,

To try it out, drop a PDF file into your asset catalog, then change its Scales property to Single Scale – this has the effect of making Xcode convert it to @2x and @3x at build time.

The natural size of a vector image – its effective @1x resolution – is determined by the size of the vector, which might be confusing at first because vector images are resolution independent. But even then they still have a natural size, and Xcode will display that when you select your vector art.

Xcode has a couple of vector options that are worth exploring. The first is using Individual and Single Scales mode, which lets you override any specific size you want while using the vector for the others. The other is Preserve Vector Data, which copies the PDF into the final build so it can be re-rasterized at runtime to fit any size need – the only hiccup here is that iOS needs to be precisely sure what size the image is going to be, so if you try to rely on an intrinsic content size you’ll hit problems.

To try it out yourself, add an image view to a view controller and assign it a PDF asset from your asset catalog, then give it fixed width and height constraints that are much bigger than the natural size of your PDF. It might look blurry in IB but that’s OK – it will look great on the device.

Available from iOS 10.0

Did this solution work for you? Please pass it on!

Other people are reading…

About the Swift Knowledge Base

This is part of the Swift Knowledge Base, a free, searchable collection of solutions for common iOS questions.

Go from iOS to macOS the easy way!

If you like Hacking with Swift, you'll love Hacking with macOS – learn to build macOS apps today, using 18 real-world projects!

MASTER SWIFT NOW
Buy Testing Swift Buy Practical iOS 12 Buy Pro Swift Buy Swift Design Patterns Buy Swift Coding Challenges Buy Server-Side Swift (Vapor Edition) Buy Server-Side Swift (Kitura Edition) Buy Hacking with macOS Buy Advanced iOS Volume One Buy Advanced iOS Volume Two Buy Hacking with watchOS Buy Hacking with tvOS Buy Hacking with Swift Buy Dive Into SpriteKit Buy Swift in Sixty Seconds Buy Objective-C for Swift Developers Buy Beyond Code

Was this page useful? Let me know!

Click here to visit the Hacking with Swift store >>