ダイナミックタイプを利用した場合の標準フォントのスケール

DynamicTypeSize.swift

import SwiftUI

#Preview {
    @Previewable @State var value: Double = 3.0
    VStack {
        SampleView()
            .environment(\.dynamicTypeSize, .allCases[Int(value)])
            .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .trailing)
            .contentTransition(.numericText())
        Text("\(DynamicTypeSize.allCases[Int(value)])")

        Slider(value: $value.animation(), in: 0...11)
    }
    .font(.system(size: 30).monospacedDigit().bold())
    .padding()
}

private struct SampleView: View {
    @ScaledMetric(relativeTo: .largeTitle) var m1 = 100.0
    @ScaledMetric(relativeTo: .title) var m2 = 100.0
    @ScaledMetric(relativeTo: .title2) var m3 = 100.0
    @ScaledMetric(relativeTo: .title3) var m4 = 100.0
    @ScaledMetric(relativeTo: .headline) var m5 = 100.0
    @ScaledMetric(relativeTo: .subheadline) var m6 = 100.0
    @ScaledMetric(relativeTo: .body) var m7 = 100.0
    @ScaledMetric(relativeTo: .callout) var m8 = 100.0
    @ScaledMetric(relativeTo: .footnote) var m9 = 100.0
    @ScaledMetric(relativeTo: .caption) var m10 = 100.0
    @ScaledMetric(relativeTo: .caption2) var m11 = 100.0

    var body: some View {
        VStack(alignment: .trailing) {
            SampleRow(m1, name: "largeTitle")
            SampleRow(m2, name: "title")
            SampleRow(m3, name: "title2")
            SampleRow(m4, name: "title3")
            SampleRow(m5, name: "headline")
            SampleRow(m6, name: "subheadline")
            SampleRow(m7, name: "body")
            SampleRow(m8, name: "callout")
            SampleRow(m9, name: "footnote")
            SampleRow(m10, name: "caption")
            SampleRow(m11, name: "caption2")
        }
    }
}

private struct SampleRow: View {
    let name: String
    let value: Double

    init(_ value: Double, name: String) {
        self.name = name
        self.value = value
    }

    var body: some View {
        HStack {
            Text("\(name)")
                .frame(maxWidth: .infinity, alignment: .leading)
            Text("\(value)")
                .fixedSize()
        }
    }
}