> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/ios/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/ios/swiftui/control/pickers/picker.md).

# Picker

[SwiftUI](/ios/swiftui.md) ⟩ [control](/ios/swiftui/control.md) ⟩ [pickers](/ios/swiftui/control/pickers.md) ⟩ Picker&#x20;

{% hint style="success" %}

{% endhint %}

{% hint style="danger" %}
⭐️ 注意： \
[`PickerStyle`](https://developer.apple.com/documentation/swiftui/pickerstyle)<mark style="color:blue;">`.automatic`</mark> 回傳的是 [DefaultPickerStyle](https://developer.apple.com/documentation/swiftui/defaultpickerstyle)，兩者名稱不一致，請小心❗️
{% endhint %}

{% tabs %}
{% tab title="💾 程式" %}
:point\_right: SwiftUI Tutorials ⟩ Working with UI Controls ⟩ Sec 3. [Define the Profile Editor](https://developer.apple.com/tutorials/swiftui/working-with-ui-controls#Define-the-Profile-Editor)

![Picker (segmented style)](/files/M90jIraPwJUj1IojVuxm)

```swift
VStack(alignment: .leading, spacing: 20) {
    Text("Seasonal Photo").bold()
    /// ⭐️ Picker
    Picker("Seasonal Photo", selection: $profile.seasonalPhoto) {
        ForEach(Profile.Season.allCases) { season in
            Text(season.rawValue).tag(season)
        }
    }
    .pickerStyle(.segmented)
}
```

:point\_right:[Implicit Alignment](/ios/swiftui/view/layout/alignment/implicit-alignment.md)

```swift

@State private var selection: String = "leading"

let keys = ["leading", "center", "trailing"]
let alignments: [String:HorizontalAlignment] = [
    "leading": .leading, "center": .center, "trailing": .trailing
]
    
/// segmented control
var picker: some View {
    Picker("Align", selection: $selection) {
        ForEach(0..<3){ Text(keys[$0]).tag(keys[$0]) }
    }
    .pickerStyle(.segmented).shadow(radius: 2)
    .padding()
    // ⭐️ animate the change when `selection` changes
    .onChange(of: selection) { newSelection in
        withAnimation(.easeOut(duration: 1)) {
            self.alignment = alignments[newSelection]!
        }
    }
}
```

{% endtab %}

{% tab title="📘 手冊" %}

* [SwiftUI](https://developer.apple.com/documentation/swiftui) ⟩&#x20;
  * [Picker](https://developer.apple.com/documentation/swiftui/picker) ⟩&#x20;
    * [picker styles](https://developer.apple.com/documentation/swiftui/picker#Styling-pickers)
  * [PickerStyle](https://developer.apple.com/documentation/swiftui/pickerstyle) (protocol)
  * [View](https://developer.apple.com/documentation/swiftui/view) ⟩&#x20;
    * [.pickerStyle(\_:)](https://developer.apple.com/documentation/swiftui/view/pickerstyle\(_:\))
      {% endtab %}

{% tab title="📗 參考" %}

* [ ] AppCoda ⟩ [構建一個輪盤選擇器 (Wheel Picker)](https://www.appcoda.com.tw/swiftui-wheel-picker/)
  {% endtab %}

{% tab title="👥 相關" %}

* [events](/ios/swiftui/view/events.md)
* [Implicit Alignment](/ios/swiftui/view/layout/alignment/implicit-alignment.md)
  {% endtab %}

{% tab title="🖥️ 影片" %}
{% embed url="<https://youtu.be/1cxXSQqbv2w>" %}
tundsdev ⟩ Picker And PickerStyle In SwiftUI
{% endembed %}
{% endtab %}
{% endtabs %}
