How can I get two wheel picker in one row display correctly?I tried to use HStack
, but it did not work. see my code below:
import SwiftUI
@available(iOS 15.0, *)
struct ContentView: View {
@State var min:Int = 0
@State var sec:Int = 0
var body: some View {
Form{
Section{
HStack{
Picker("min", selection: $min){
Text("0")
.tag(0)
Text("1")
.tag(1)
Text("2")
.tag(2)
Text("3")
.tag(3)
}
.pickerStyle(.wheel)
Picker("sec", selection: $sec){
Text("0")
.tag(0)
Text("1")
.tag(1)
Text("2")
.tag(2)
Text("3")
.tag(3)
}
.pickerStyle(.wheel)
}
.frame(height:60)
}
}
}
}
@available(iOS 15.0, *)
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
You need to clip the Pickers and use GeometryReader:
struct ContentView: View {
@State var min:Int = 0
@State var sec:Int = 0
var body: some View {
Form {
Section{
GeometryReader { geometry in
HStack{
Picker("min", selection: $min){
Text("0")
.tag(0)
Text("1")
.tag(1)
Text("2")
.tag(2)
Text("3")
.tag(3)
}
.pickerStyle(.wheel)
.frame(width: geometry.size.width / 2, height: 80)
.clipped()
Picker("sec", selection: $sec){
Text("0")
.tag(0)
Text("1")
.tag(1)
Text("2")
.tag(2)
Text("3")
.tag(3)
}
.pickerStyle(.wheel)
.frame(width: geometry.size.width / 2, height: 80)
.clipped()
}
.frame(height:60)
}
}
}
}
}