Overview
A date picker is a native control that lets a user select a date or time. Play’s date picker element uses Apple’s native iOS date picker. Date pickers can be customized according to the SwiftUI properties, and they automatically include all native functionality, like selecting dates or switching months.
Properties
Mode
Set if the date picker should display the date, the time, both the date & time, or a countdown timer:- Date: Allows the user to select a date (month, day, year).
- Time: Allows the user to select a time (hour, minute, AM or PM)
- Date & Time: Allows the user to select both a date and a time.
- Count Down Timer: Allows the user to select a time to count from (hour and minute). (Only available in Wheels style)
Style
Set if the date picker’s style should be compact, inline, or wheels:- Compact: Show the data in a compact view that, when tapped, will expand for user interaction.
- Inline: Show the full view (i.e. for date mode, it will show a full calendar).
- Wheels: Show the date or time in a wheel interface which functions the same as a native picker.
Tint Color
Select the date picker’s accent color. (Not available for Wheels style)In Expression Editor
In Expression Editor
colorCan get or set the tint color or an individual color property.
Expression Editor Properties
In addition to the properties below, date pickers also have access to general object properties in the Expression Editor.
Value
Value Properties
Value Properties
Add DayReturns a date updated by adding the provided amount of days.Add MonthReturns a date updated by adding the provided amount of months.FormatReturns the formatted date using the provided format string. Set formatting below.StyleReturns a locale-aware string for date formatted using style/time.
Format Date
Format Date
| Symbol | Meaning | Example |
|---|---|---|
| yyyy | Year (4 digits) | 2025 |
| yy | Year (2 digits) | 25 |
| M | Month in year | 7, 12 |
| MM | Month in year (2 digits) | 07, 12 |
| MMM | Month in year (text) | May, Oct |
| d | Day in month | 1, 31 |
| dd | Day in month (2 digits) | 01, 31 |
| E | Day of the week (text) | Sunday |
7-1-2025.Format Time
Format Time
| Symbol | Meaning | Example |
|---|---|---|
| H | Hour in day (0-23) | 0, 23 |
| HH | Hour in day (00-23) | 00, 23 |
| h | Hour in am/pm (1-12) | 1, 12 |
| hh | Hour in am/pm (01-12) | 01, 12 |
| m | Minute in hour | 0, 59 |
| mm | Minute in hour (2 digit) | 00, 59 |
| s | Second in minute | 0, 59 |
| ss | Second in minute (2 digits) | 00, 59 |
| S | Millisecond | 0, 999 |
| a | am/pm market | AM, PM |
| z | Time zone | PST |
| Z | RFC 822 time zone | -0800 |
1:00 PM.Day
numberValues:
1 - 31Can get or set the value.
Month
numberValues:
1 - 12Can get or set the value.
Year
numberValues: ex.
1998Can get or set the value.
Hour
numberValues:
1 - 24Can get or set the value.
Minute
numberValues:
1 - 60Can get or set the value.
Second
numberValues:
1 - 60Can get or set the value.