SwiftUI의 AttributedString사용해보기 (feat. hacking with swift)

https://www.hackingwithswift.com/quick-start/swiftui/how-to-add-advanced-text-styling-using-attributedstring

위 글을 참고하여 구현한 전체 코드 및 미리보기

 

미리보기

 

 

샘플 코드

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack(spacing: 10) {
            Case1()
            Case2()
            Case3()
            Case4()
            Case5()
            Case6()
            Case7()
            Case8()
            Case9()
        }
    }
}

#Preview {
    ContentView()
}

struct Case1: View {
    var message: AttributedString {
        var result = AttributedString("Hello, world!")
        result.font = .largeTitle
        result.foregroundColor = .white
        result.backgroundColor = .red
        return result
    }
    
    var body: some View {
        Text(message)
    }
}

struct Case2: View {
    var message1: AttributedString {
        var result = AttributedString("Hello")
        result.font = .largeTitle
        result.foregroundColor = .white
        result.backgroundColor = .red
        return result
    }
    
    var message2: AttributedString {
        var result = AttributedString("World!")
        result.font = .largeTitle
        result.foregroundColor = .white
        result.backgroundColor = .blue
        return result
    }
    
    var body: some View {
        Text(message1 + message2)
    }
}

struct Case3: View {
    var message: AttributedString {
        var result = AttributedString("Testing 1 2 3!")
        result.font = .largeTitle
        result.foregroundColor = .white
        result.backgroundColor = .blue
        result.underlineStyle = Text.LineStyle(pattern: .solid, color: .white)
        return result
    }
    
    var body: some View {
        Text(message)
    }
}

struct Case4: View {
    var message: AttributedString {
        let string = "The letters go up and down"
        var result = AttributedString()
        
        for (index, letter) in string.enumerated() {
            var letterString = AttributedString(String(letter))
            letterString.baselineOffset = sin(Double(index)) * 5
            result += letterString
        }
        
        result.font = .largeTitle
        return result
    }
    
    var body: some View {
        Text(message)
    }
}

struct Case5: View {
    var message: AttributedString {
        var result = AttributedString("Learn Swift here")
        result.font = .largeTitle
        result.link = URL(string: "https://www.hackingwithswift.com")
        return result
    }
    
    var body: some View {
        Text(message)
    }
}

struct Case6: View {
    var message: AttributedString {
        var password = AttributedString("abCayer-muQai")
        password.accessibilitySpeechSpellsOutCharacters = true
        return "Your password is: " + password
    }
    
    var body: some View {
        Text(message)
    }
}

struct Case7: View {
    var message: AttributedString {
        var result = Date.now.formatted(.dateTime.weekday(.wide).day().month(.wide).hour().minute().second().attributed)
        result.foregroundColor = .secondary
        
        let weekday = AttributeContainer.dateField(.weekday)
        let weekdayStyling = AttributeContainer.foregroundColor(.primary)
        result.replaceAttributes(weekday, with: weekdayStyling)
        
        let day = AttributeContainer.dateField(.day)
        let dayStyling = AttributeContainer.foregroundColor(.primary)
        result.replaceAttributes(day, with: dayStyling)
        
        return result
    }
    
    var body: some View {
        Text(message)
    }
}

struct Case8: View {
    var message: AttributedString {
        var components = PersonNameComponents()
        components.givenName = "Taylor"
        components.familyName = "Swift"
        
        var result = components.formatted(.name(style: .long).attributed)
        
        let familyNameStyling = AttributeContainer.font(.headline)
        let familyName = AttributeContainer.personNameComponent(.familyName)
        result.replaceAttributes(familyName, with: familyNameStyling)
        
        return result
    }
    
    var body: some View {
        Text(message)
    }
}

struct Case9: View {
    var message: AttributedString {
        let amount = Measurement(value: 200, unit: UnitLength.kilometers)
        var result = amount.formatted(.measurement(width: .wide).attributed)
        
        let distance = AttributeContainer.measurement(.value)
        let distanceStyling = AttributeContainer.font(.title)
        result.replaceAttributes(distance, with: distanceStyling)
        
        return result
    }
    
    var body: some View {
        Text(message)
    }
}