ios – Prohibit Dynamic Kind to scale to the container’s dimension

0
104


I’ve a library of SwiftUI Elements that’s being developed to be built-in in different tasks throughout many different merchandise of the corporate. The UI element library serves because the design system.

I’m attempting to attain Dynamic Kind for the Textual content labels in SwiftUI. I’m utilizing a customized font and I would like to have the ability to limit the dynamic sort to its container’s dimensions (width and top).

I’ve already used the font modifier as following:

.font(dynamicScaling ? .customized(type.title, dimension: type.dimension, relativeTo: type.dynamicTypeMapping) : .customized(type.title, fixedSize: type.dimension))

I’ve created the next for styling the Textual content:

protocol TextModifier {
    associatedtype Physique: View
    func physique(textual content: Textual content) -> Physique
}

struct Model: TextModifier {
    var typography: StyleType
    var dynamicScaling: Bool = true
    var type: FontStyle {
        return FontStyleManager.type(type: typography)
    }
    
    func physique(textual content content material: Textual content) -> some View {
        return content material
            .font(dynamicScaling ? .customized(type.title, dimension: type.dimension, relativeTo: type.dynamicTypeMapping) : .customized(type.title, fixedSize: type.dimension)) // fixedSize is to disable the dynamic scaling fully
            .underline(type.underlineDecoration)
            .lineSpacing(((type.lineHeight / type.fontHeight) * type.fontHeight) - type.fontHeight)
     }

}

extension Textual content {
    func modifier<TM: TextModifier>(_ theModifier: TM) -> some View {
        return theModifier.physique(textual content: self)
    }
    
    public func type(type: StyleType, dynamicScaling: Bool = true) -> some View {
        modifier(Model(typography: type, dynamicScaling: dynamicScaling))
    }

One in every of my use case is glad, after I use .customized(type.title, fixedSize: type.dimension). This fully turns off the dynamic scaling when wanted.

When dynamic scaling is enabled and I improve the Accessibility -> Giant Textual content setting, the textual content overflows the container and will increase the container top/width.

The medium sized textual content appears to be like like this:
Medium sized text tab bar

After I improve the Giant Textual content setting, the font scales up:
Accessibility Extra Extra Large sized text tab bar

Ideally, I might wish to limit the font scaling to this scale even when the Giant Textual content setting is turned to max:
XL sized text tab bar

How can I obtain this?