How to show date picker in SwiftUI?

Uplift iOS Interview

The Guide is for YOU if
  • You are preparing for an iOS interview and want to improve your skills and knowledge and looking to level up your interview game and land your dream job.
  • You want to gain confidence and ease during iOS interviews by learning expert tips and curated strategies.
  • You want access to a comprehensive list of iOS interview QA to practice and prepare.

SwiftUI date picker is a very handy built-in modifier(DatePicker) for selecting a specific date, time, or both. A date picker has four modes: date, time, date and time, count down timer. You can display date picker in contact, wheels and inline style. You can present the date picker in the following way:

struct ContentView: View {
    @State private var date = Date()

    var body: some View {
        VStack {
            // Full date time
            DatePicker("Date:", selection: $date)

            // Time
            DatePicker("Time:", selection: $date, displayedComponents: .hourAndMinute)

            // With style
            DatePicker("Time:", selection: $date, displayedComponents: .hourAndMinute)

If you want to show the whole calendar to pick the date you can use .datePickerStyle(GraphicalDatePickerStyle())

 DatePicker("Date:", selection: $date)

You can also play with different types of range while using the date picker. The most commonly used range is …Date() where you can select any date until the present date or Date()… to select the date from the present date.

DatePicker("Date range", selection: $date, in: …Date())

✍️ Written by Ishtiak Ahmed

👉 Follow me on XLinkedIn

Get Ready to Shine: Mastering the iOS Interview

Enjoying the articles? Get the inside scoop by subscribing to my newsletter.

Get access to exclusive iOS development tips, tricks, and insights when you subscribe to my newsletter. You'll also receive links to new articles, app development ideas, and an interview preparation mini book.

If you know someone who would benefit from reading this article, please share it with them.