Scaled Vector Images
Example of using the new Preserve Vector Data asset catalog feature, introduced with Xcode 9, to create smooth scaling images. This also makes it easy to support two new accessibility features in iOS 11:
- Adjusing Image Sizes For Accessibility
- Large Content Size Images For Bar Items
Xcode 9 added the support to treat the image as a vector at runtime. This means that images can be smoothly scaled to arbitrary sizes. The only change you need to make is to tick Preserve Vector Data for the PDF image in the asset catalog:
In iOS 11, Apple added the UIAccessibilityContentSizeCategoryImageAdjusting protocol. Both UIButton and UIImageView adopts the protocol which adds a single boolean property adjustsImageSizeForAccessibilityContentSizeCategory. If you set this to true the image size increases when you use any of the larger accessibility text sizes (the normal content text sizes have no effect).
To add support:
1. Add a PDF image to the asset catalog and be sure to tick Preserve Vector Data as before:
2. When adding the image view or button to the Storyboard make sure to tick Adjusts Image Size in Attributes Inspector:
3. If adding the image view in code:
imageView.adjustsImageSizeForAccessibilityContentSizeCategory = true
Why are the icons only available in black? Xcode 6 also allows you to set the tint colour applied to the vector image. To enable this, ensure Render As: Template Image is set in the asset attribute inspector.
You can apply a tint colour using interface builder or manually in code:
// Obj-C
[imageView setTintColor:[UIColor whiteColor]];
// Swift
imageView.tintColor = UIColor.whiteColor()