📦Label

SwiftUI ⟩ Controls ⟩

🔴 主題

• Label Styles

• Label ⟩ custom styles

💈範例

struct ContentView: View {
    
    // view body
    var body: some View {
        VStack {
            favLabel
            bondLabel
            weatherLabels
        }
    }
    
    // favorites label
    var favLabel: some View {
        Label {
            Text("Favorites")
                .bold()
                .foregroundColor(.green)    // ⭐️ title color
        } icon: {
            Image(systemName: "heart")
                .symbolVariant(.fill)
                .foregroundColor(.pink)     // ⭐️ icon color
        }
    }
    
    // james bond label
    var bondLabel: some View {
        Label {
            // ⭐️ multiple texts
            Text("James Bond")
                .font(.body)
                .foregroundColor(.primary)
            Text("Mr.")
                .font(.subheadline)
                .foregroundColor(.secondary)
        } icon: {
            // ⭐️ custom icon
            Circle()
                .fill(Color.orange)
                .frame(width: 44, height: 44, alignment: .center)
                .overlay(Text("JB"))
        }
    }
    
    var weatherLabels: some View {
        HStack {
            Label("Rain", systemImage: "cloud.rain")
                .foregroundColor(.cyan)
            Label("Snow", systemImage: "snow")
            Label("Sun", systemImage: "sun.max")
                .foregroundColor(.yellow)
        }
        .labelStyle(.iconOnly)    // ⭐️ icon only
    }
}

🔸 定義

struct Label<Title: View, Icon: View>

📗 參考

• Paul ⟩ How to show text and an icon side by side using Label

• Simple Swfit Guide ⟩ SwiftUI Label Tutorial

• Sarun ⟩

  • How to change the color of SF Symbols

  • SwiftUI Label: A standard way to label user interface items ⭐️

• FIVE STARS ⟩ SwiftUI's Label - with custom LabelStyle ⭐️

📘 手冊

• SwiftUI ⟩ Views and Controls ⟩ Label ⟩

  • LabelStyle (protocol)

  • .labelStyle(_:)

👥 相關

• Button

• Toggle

• uses SF Symbols.

• used by TabView as tab labels.

🗣 討論

• difference between accent, foreground and tint color?