[SwiftUI]「Picker」を下から表示する方法[Xcode]

方法
おすすめの記事

方法

struct ContentView: View {
    @State var onPicker = false
    @State var selected = 0
    var body: some View {
        VStack {
            Spacer()
            
            Toggle(isOn: $onPicker, label: {
                Text("ピッカー表示")
            })
            //ピッカーを下に寄せておく
            Spacer()
            
            if onPicker {
                Picker(selection: $selected, label: Text("動的")) {
                    ForEach(0..<5) { index in
                        Text("\(index)")
                            .tag(index)
                    }
                }
                //トランジションとアニメーション
                .transition(.move(edge: .bottom))
                .animation(.linear(duration: 3))
            }
        }
        
    }
}

Pickerを下から表示するには、Pickerを下に寄せて、トランジションとアニメーションを使います。

transitionの.move(edge: .bottom)で下から表示され、下に向かって消えるようにします。

これだけでも下から表示されるのですが、速すぎて下から表示されているのかわかりません。

なので、animationモディファイアの.linearでわかりやすくしています。

表示が遅いと感じる人はdurationの値を大きくしてください。