New in SwiftUI 4: MultiDatePicker

Photo by Towfiqu barbhuiya on Unsplash

SwiftUI 4 came with another cool new addition, MultiDatePicker. This new control allows us to pick multiple dates.

Let’s get started with an example. Creating MultiDatePicker is easy, all we need is a State variable to store selected dates and MultiDatePicker view itself.

State variable os passed as selection binding value into the MutiDatePicker as shown below:

struct ContentView: View {
    
    @State private var selectedDates: Set<DateComponents> = []
    
    var body: some View {
        VStack {
            Text("DevTechie!")
                .font(.largeTitle)
                .foregroundColor(.primary)
            MultiDatePicker("Travel Dates", selection: $selectedDates)
                .frame(height: 300)
        }
        .padding()
    }
}

Display Selected Dates

We can display selected dates in a Text view as well. Let’s update our code to display selected dates.

struct ContentView: View {
    
    @State private var selectedDates: Set<DateComponents> = []
    @State private var formattedDates: String = ""
    
    let formatter = DateFormatter()
    
    var body…