ScaledValues

The library provides you with an alternative to the @ScaledMetric dynamic property.

It has several dynamic property wrappers:

• @ScaledValue
• @ScaledPointSize
• @ScaledFont
• @ScaledInsets

All dynamic properties scale values according to the current Dynamic Type size and provide you with the ability to define minimum and maximum values.

@ScaledValue

With @ScaledValue you can scale an arbitrary layout value. It is the same as the standard @ScaledMetric, but it provides you with the ability to define minimum and maximum values.

import SwiftUI
import ScaledValues

struct ContentView: View {
    @ScaledValue(min: 30, max: 60, relativeTo: .body)
    private var shapeSize = 32.0
    
    @ScaledValue(min: 8, max: 15, relativeTo: .body)
    private var shapeRadius = 10.0

    var body: some View {
        RoundedRectangle(
            cornerRadius: shapeRadius, 
            style: .continuous
        )
        .fill(.green)
        .frame(width: shapeSize, height: shapeSize)
    }
}

@ScaledPointSize

With @ScaledPointSize you can scale a custom font size in points.

import SwiftUI
import ScaledValues

struct ContentView: View {
    
    <...>

    @ScaledPointSize(min: 15, max: 30, relativeTo: .body)
    private var fontSize = 16

    var body: some View {
        RoundedRectangle(
            cornerRadius: shapeRadius, 
            style: .continuous
        )
        .fill(.green)
        .frame(width: shapeSize, height: shapeSize)
        .overlay {
            Image(systemName: "star.fill")
                .foregroundColor(.yellow)
                .font(.system(size: fontSize))
        }
    }
}

@ScaledFont

As an alternative to @ScaledPointSize, you can define the font itself using @ScaledFont. This makes your code neater, as you can identify an accessible font in one place.

import SwiftUI
import ScaledValues

struct ArticleRow: View {
    @ScaledFont(size: 18, leading: .tight, relativeTo: .headline)
    private var titleFont: Font

    @ScaledFont(size: 14, design: .serif, relativeTo: .caption)
    private var summaryFont: Font

    @ObservedObject var article: Article

    var body: some View {
        HStack {
            VStack(alignment: .leading) {
                Text(article.title)
                    .font(titleFont)

                Text(article.summary)
                    .font(summaryFont)
            }

            Spacer()
        }
    }
}

@ScaledInsets

With @ScaledInsets you can scale the inset distances.

import SwiftUI
import ScaledValues

struct ArticlesView: View {
    @ScaledInsets(max: maxRowInsets, relativeTo: .title)
    private var rowInsets = defaultRowInsets
    
    var articles: [Article]

    var body: some View {
        List(articles) {
            ArticleRow($0)
                .listRowInsets(rowInsets)
        }
    }

    private static var defaultRowInsets: EdgeInsets {
        .init(
            top: 5, 
            leading: 10, 
            bottom: 5, 
            trailing: 15)
    }

    private static var maxRowInsets: EdgeInsets {
        .init(
            top: 10, 
            leading: 20, 
            bottom: 10, 
            trailing: 20)
    }
}