NEW: Subscribe to Hacking with Swift+ and accelerate your learning! >>

How to use vector images in your asset catalog

Swift version: 5.2

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.

Hacking with Swift is sponsored by Instabug

SPONSORED Are you tired of wasting time debugging your Swift app? Instabug’s SDK is here to help you minimize debugging time by providing you with complete device details, network logs, and reproduction steps with every bug report. All data is attached automatically, and it only takes a line of code to setup. Start your free trial now and get 3 months off exclusively for the Hacking with Swift Community.

Start your free trial!

Sponsor Hacking with Swift and reach the world's largest Swift community!

Subscribe to Hacking with Swift+

Available from iOS 10.0

Similar solutions…

About the Swift Knowledge Base

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

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

Was this page useful? Let us know!

Average rating: 4.3/5