添加自定义字体作为字体类型 SwiftUI 的扩展

Adding custom fonts as an extension to the Font type SwiftUI

首先要明确一点,我不是在问如何将自定义字体添加到 SwiftUI,我是在问如何使用自定义字体扩展字体类型。

例如我使用的是自定义字体Manrope。我将 ttf 文件添加到我的项目并将其添加到我的信息 plist 中。目前我必须使用这样的字体:

.font(.custom("Manrope-SemiBold", size: 24))

我想知道我是否可以扩展 Font 以便我可以像这样使用 Manrope

.font(.manrope.semibold())

.font(.manrope("Semibold"))

您可以在字体上将自定义字体声明为静态计算 属性:

extension Font {
    
    static var myCustomFont: Font {
        Font.custom("Manrope-SemiBold", size: 24)
    }
    
}

或者像这样更好地支持动态类型:

extension Font {

    static var myCustomFont: Font {
        Font.custom("Manrope-SemiBold", size: 24, relativeTo: .title2)
    }
}

然后您可以像预定义系统字体一样使用它:

Text("Example")
    .font(.myCustomFont)

对多种字体类型使用枚举,对设置的自定义字体使用函数。

这是一个可能的解决方案

//MARK: Font Extension
extension Font {
    enum ManropeFont {
        case semibold
        case custom(String)
        
        var value: String {
            switch self {
            case .semibold:
                return "Semibold"
                
            case .custom(let name):
                return name
            }
        }
    }
    
    enum RobotoFont {
        case semibold
        case custom(String)
        
        var value: String {
            switch self {
            case .semibold:
                return "Semibold"
                
            case .custom(let name):
                return name
            }
        }
    }
    
    static func manrope(_ type: ManropeFont, size: CGFloat = 26) -> Font {
        return .custom(type.value, size: size)
    }
    
    static func roboto(_ type: RobotoFont, size: CGFloat = 26) -> Font {
        return .custom(type.value, size: size)
    }
}

用法

struct ContentViewFonts: View {
    var body: some View {
        VStack {
            Text("Text demo")
                .font(.manrope(.semibold))
            
            Text("Text demo")
                .font(.roboto(.semibold))
            
            Text("Text demo")
                .font(.roboto(.semibold, size: 10))
            
            Text("Text demo")
                .font(.roboto(.custom("Bold")))
        }
    }
}