[SwiftUI] Text

Text의 속성들을 알아보자

import SwiftUI

struct TestTextView: View {
    static let dateFormatter: DateFormatter = {
       let dateFormatter = DateFormatter()
        dateFormatter.dateFormat = "YYYY년 MM월 dd일"
        return dateFormatter
    }()
    
    var today = Date()
    
    var body: some View {
        // 속성을 주는 순서도 중요함
        VStack {
            Text("A text view draws a string in your app’s user interface using a body font that’s appropriate for the current platform. You can choose a different standard font, like title or caption, using the font(_:) view modifier.")
            // 글자 간격
                .tracking(1)
            
            // Font
                .font(.system(.body, design: .rounded))
                .fontWeight(.medium)
            
            // 여러 줄 일 때 텍스트 정렬
                .multilineTextAlignment(.leading)
            
            // Multi line
            // nil로 주면 UIKit에서 0 준 것과 같음
                .lineLimit(nil)
            
            // 줄 간격
                .lineSpacing(20)
            
            // 글자 말줄임표 설정
                .truncationMode(.middle)
            
            // 글자 그림자
                .shadow(color: .red, radius: 1.5, x: 10, y: 5)
            
            // Padding
            // .top .trailing .leading .bottom .all
                .padding(20)
            
            // Background color
                .background(Color.orange)
            
            // Radius
                .cornerRadius(20)
            
            // Padding 중첩 가능
                .padding()
                .background(Color.green)
                .cornerRadius(20)
            
            Text("Hello!")
                .foregroundColor(.white)
                .fontWeight(.bold)
                .font(.system(size: 30))
        }
        .frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)
        .background(Color.black)
        .edgesIgnoringSafeArea(.all)
    }
}

🤔

UIKit과 다른점을 몇가지 정리해보자

Label의 라인 수를 지정하는 것은 .lineLimit()으로 UIKit과 다르다.

shadow 주는법도 굉장히 심플하고..

padding이 중첩이 되는것과 padding을 먼저하고 배경색 변경하는 것과 모서리를 깎는다거나 등 순서에 따라 다르게 보이는 것도 좀 신기했다.