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

Question

First to be clear, I am not asking how can I add custom fonts to SwiftUI, I'm asking how can I extend the Font type with custom fonts.

For example I am using the custom font Manrope . I added the ttf files to my project and added it to my Information plist. Current I have to use the font like this:

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

I was wondering if I could extend Font so that I could use Manrope like this

.font(.manrope.semibold())

or

.font(.manrope("Semibold"))

Answer 1

Use enums for multiple font types and functions for the set custom font.

Here is a possible solution

//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)
    }
}

Usage

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")))
        }
    }
}

Answer 2

You could declare your custom font as a static computed property on Font:

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

or even better like this to support dynamic type:

extension Font {

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

Then you can use it the same way you would predefined system fonts:

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