The DatePicker and TimePicker controls provide a way for users to select dates and times using large blocks which are easy to manipulate on the phone device, while still having the dates and times displayed in a compact way.
In both cases, the control’s default appearance is as a normal text block displaying the selected date or time. When the user taps the text block, the control displays a new page on which the user can select a new value.
DatePicker
The DatePicker control supports the selection of a date. The SelectedDate property contains the selected date.
The date format can be specified using the DateFormat property. In display mode, this is the format in which the date is displayed. In selection mode, it determines which of the day, month and year are available for modification. For example, if the date format is MMMM yyyy, then the selection page shows only the month and year—the user cannot see or modify the day.
The day, month and year on the selection page are shown using LoopingListBox controls to create a user interface which is attractive, fluid and easy to manipulate.
CopyUsing a DatePicker<ms:DatePicker DateFormat="dd MMMM" SelectedDate="{Binding Birthday, Mode=TwoWay}" />
TimePicker
The TimePicker control supports selecting a time of day. The SelectedTime property contains the selected time.
The time format can be specified using the TimeDisplayMode property. Times are always displayed as hours and minutes (no seconds), but can be chosen to be displayed using the 12-hour clock plus an AM/PM indicator or the 24-hour clock. The same format is used for selecting a time—for example, in 12-hour format the selection page includes an AM/PM indicator, and the hour selector loops around from 12 to 1, but in 24-hour format the selection page includes only hour and minute selectors, and the hour selector loops around from 24 to 1.
As with the DatePicker, the selection page uses LoopingListBox controls for interaction with the user.
