Javatpoint Logo
Javatpoint Logo


DatePicker is a control used in iOS applications to get the date and time values from the user. We can allow the user to either enter the time in point or time interval.

Use the following steps to add the DatePicker to the interface.

  1. Set the UIView, i.e. (label, text field, button, etc.) to which you want to get the date and time from the user.
  2. Search for DatePicker in the object library and drag the result to the storyboard.
  3. Set the date picker mode
  4. Supply additional configuration options such as minimum and maximum dates if required.
  5. Create an action outlet for the date picker.
  6. Set up auto-layout rules for datepicker to set the position on different devices.

The datepicker is only used for the selection of date and time from the list.


In this example, we will create a text field in which we will allow a user to enter a date by selecting any date from the date picker.

To add the datepicker to the storyboard, we will search for the datepicker in the object library and drag the result into the storyboard.

Interface Builder

The following image shows the interface builder; we created in the example. We have created the outlet for the text field and datepicker in the ViewController.swift file.

iOS DatePicker


In ViewController.swift, we have just assigned the inputView property of the input text field to the datepicker, and the action connection of the datepicker is triggered each time when the value of datepicker is changed, which sets the text field text to the datepicker date. In this example, we have set the datepicker mode to date; however, we can set it to dateAndTime, or time to get the appropriate datetime or time values.


iOS DatePicker

Interface Builder Attributes

Core attributes

SN Attribute Description
1 Mode It represents the DatePicker Mode. It is used to determine whether the datepicker is going to display the date, time, date and time, or a countdown interval. This can be accessed at runtime using datePickerMode property.
2 Locale This represents the locale associated with the datepicker. This property overrides the system default locale. This can be accessed at runtime using the local property.
3 interval It represents the granularity of the minute's spinner. The default value is 1, and the maximum value is 30. This value must be a divisor of 60. It can be accessed at runtime using minuteInterval property.

Date Attributes

SN Attribute Description
1 Date It represents the date that the date picker is going to display initially. We can set this property at runtime.
2 Constraints It represents the range of the dates that can be selected. We can configure the minimumDate and maximumDate property to configure the range.
3 Timer It is the initial value of the datepicker when it is shown in countdown timer mode.

Next TopicSlider

Youtube For Videos Join Our Youtube Channel: Join Now


Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Trending Technologies

B.Tech / MCA