在 SwiftUI 中使用 Picker：2025 最新語法與最佳實踐

SwiftUI 是 Apple 在 WWDC 2019 推出的新框架，它讓開發者能夠輕鬆建立動態且直覺的使用者介面。本文將介紹如何在 SwiftUI 中使用 Picker，並提供最新的語法與最佳實踐，幫助你提升開發效率。

如何在 SwiftUI 中使用 Picker

在 SwiftUI 中，使用 Picker 可以快速建立一個讓使用者選擇的介面。以下是使用 Picker 的基本語法：

struct ContentView: View {
    @State private var selection: Int = 1

    var body: some View {
        Picker("選擇一個選項", selection: $selection) {
            Text("選項 1").tag(1)
            Text("選項 2").tag(2)
            Text("選項 3").tag(3)
        }
        .pickerStyle(SegmentedPickerStyle()) // 使用分段選擇樣式
        .padding()
    }
}

上述程式碼中，`selection` 是一個 `@State` 屬性，能夠追蹤目前選擇的選項。`label`則是用來顯示給使用者的提示，讓他們知道正在選擇的內容。

如何在 SwiftUI 中使用 Picker 來建立動態介面

在許多情況下，你可能需要根據資料動態生成 Picker 的選項。以下是如何結合 `ForEach` 來實現動態 Picker 的範例：

struct ContentView: View {
    @State private var selection: String = "選項 1"
    let options = ["選項 1", "選項 2", "選項 3"]

    var body: some View {
        Picker("選擇一個選項", selection: $selection) {
            ForEach(options, id: \.self) { option in
                Text(option).tag(option)
            }
        }
        .pickerStyle(MenuPickerStyle()) // 使用下拉選單樣式
        .padding()
    }
}

在這段程式碼中，`options` 陣列提供了選項，而 `ForEach` 會根據這些選項動態生成 Picker 的內容。

錯誤排除

– **無法選擇選項**：請檢查 `selection` 是否正確綁定。確保它是 `@State` 或 `@Binding` 屬性。
– **不顯示選項**：確認 `ForEach` 中的資料源是否正確，並且每個選項都有唯一的 `tag`。

延伸應用

你可以將 Picker 與其他 SwiftUI 元件結合使用，比如與 TextField、Button 等，來創建更複雜的介面。例如，可以使用 Picker 來選擇顏色，然後根據選擇改變背景顏色。

結論

在 SwiftUI 中，使用 Picker 可以輕鬆創建用戶選擇介面。無論是靜態還是動態選項，Picker 都提供了簡單易用的 API。記得使用最新的 SwiftUI 語法與最佳實踐，能夠讓你的應用程式更具吸引力與功能性。

Q&A（常見問題解答）

Q1: Picker 可以自訂樣式嗎？

A: 是的，Picker 支援多種樣式，如 `.segmented`, `.wheel`, 和 `.menu`，你可以根據需求選擇適合的樣式。

Q2: 如何在 Picker 中處理選項變更？

A: 你可以使用 `onChange(of:perform:)` 來監聽選項變更，並執行相應的操作。

Q3: Picker 支援多選嗎？

A: Picker 本身僅支援單選，如果需要多選功能，可以考慮使用 List 搭配 Toggle 或 CheckBox 來實現。

—