How can I make DatePicker stay open when it's inside of form?

user_12906445 0
Viewed 90

How can I make the DatePicker stay opened in form?

I put the DatePicker inside of Form, so I have to tap form, to open the DatePicker. But instead, I want it to be always open, even when the user didn't tap then form. Would be there anyway to achieve this?

Here is my current code.

struct ContentView: View {
    @State private var selectedDate = Date()
    var body: some View {
        VStack{
            Form{
                DatePicker(selection: self.$selectedDate, in: Date()..., displayedComponents: .date, label: { Text("Select a date") })
                  }
            }
        }
    }

And here is what I have tried. Using this method

  struct ContentView: View {
    @State private var pickerReset = UUID()
    
    @State private var selectedDate = Date()
    var body: some View {
        VStack{
            Form{
                DatePicker(selection: self.$selectedDate, in: Date()..., displayedComponents: .date, label: { Text("Select a date") }).id(self.pickerReset)
                  }
        }.onAppear{
            //I tired to show datePicker with UUID(), but
            //this line of code ratherly hide the datepicker
            self.pickerReset = UUID()
        }
        }
}
swiftui
1 Answers

You may try setting datePickerStyle explicitly:

struct ContentView: View {
    @State private var selectedDate = Date()
    var body: some View {
        VStack {
            Form {
                DatePicker("", selection: $selectedDate, in: Date()..., displayedComponents: .date)
                    .datePickerStyle(WheelDatePickerStyle())
            }
        }
    }
}

If you want you can use a second disabled DatePicker to show the selected date as well - to behave more like a standard DatePicker in a Form:

struct ContentView: View {
    @State private var selectedDate = Date()
    var body: some View {
        VStack {
            Form {
                VStack {
                    DatePicker("Select a date", selection: $selectedDate, in: Date()..., displayedComponents: .date)
                        .disabled(true)
                    DatePicker("", selection: $selectedDate, in: Date()..., displayedComponents: .date)
                        .datePickerStyle(WheelDatePickerStyle())
                }
            }
        }
    }
}
user_86977930
Related