During WWDC we saw many improvements to SwiftUI. One that stood out at as particularly useful for making accessible apps was @ScaledMetric. This allows you to easily scale numeric values depending on the user’s dynamic type settings. This is fantastic for accessibility, however will only be available with iOS 14. Why wait?
I’ve implemented a version of ScaledMetric, called @ScaledMetricCustom which has all of the same functionality but works on iOS13 (and 14 too) 🎉 It is included in the gist linked below:
https://gist.github.com/apptekstudios/e5f282a67beaa85dc725d1d98ec74191
Also included is a new property wrapper called @ScaledFont that allows you to define a custom font that scales with dynamic type, also working on iOS 13.
Here’s an example of how you could use these (apologies for the Times New Roman – this is why we respect the user’s system font wherever possible 😂)
struct AccessibleView: View {
@ScaledMetricCustom(relativeTo: .title) var someSize: CGFloat = 100
@ScaledFont(customFontName: "TimesNewRomanPS-BoldMT", size: 18, relativeTo: .body) var bodyFont
var body: some View {
VStack {
Rectangle()
.frame(width: someSize, height: someSize)
Text("Hello world I am dynamically scaled!")
.fixedSize(horizontal: false, vertical: true)
.font(bodyFont)
Spacer()
}
}
}
struct AccessibleView_Previews: PreviewProvider {
static var previews: some View {
NavigationView {
ScrollView {
VStack {
AccessibleView()
AccessibleView()
.environment(\.sizeCategory, .extraExtraLarge)
AccessibleView()
.environment(\.sizeCategory, .accessibilityExtraLarge)
AccessibleView()
.environment(\.sizeCategory, .accessibilityExtraExtraExtraLarge)
}
}
.navigationBarTitle("Demo")
}
}
}
@ScaledMetricCustom and @ScaledFont in use