Xcode tab bar and SVG icons

Question

I was hoping I could use SVG icons on a tab bar. I'm currently using Xcode 12 beta 3 and whilst it works with these images, the icons don't seem to rescale.

Is there a solution to this?

Answer 1

A few observations:

• See the Creating Custom Symbol Images for Your App for suggestions on how to build symbol SVG assets.

• Historically in Xcode, we couldn't easily use SVG assets. But we could convert them to PDFs, which we could then drag into our asset catalogs. When you use the asset in the app, it still ends up rasterizing it, which it saves you from having to create bitmaps of the three different sizes yourself. If you need to make it scalable (eg, notably, for accessibility), check the “preserve vector data” option in the asset catalog.

• In Xcode 12 (only beta right now), the importing of SVG assets has greatly improved. It still appears to rasterize the asset when you go to use it, though, just like the old PDF approach. You need to make sure your SVG/PDF has an artboard of the appropriate size for the eventually rasterized images.

If you consider these various vector graphic solutions, make sure to test this on your target minimum OS before you go too far. I had app with vector/PDF assets and got some unexpected edge-case behaviors on old OS versions.