Use CalendarDatePicker to pick a single date from a CalendarView.

<CalendarDatePicker x:Name="CalendarDatePicker1"
                    HorizontalAlignment="Center"
                    PlaceholderText="Select a date" />

// CalendarDatePicker1.Date is of type DateTimeOffset?
if (CalendarDatePicker1.Date != null)
{
    DateTime date = CalendarDatePicker1.Date.Value.Date;
    // ...
 
    CalendarDatePicker1.Date = null;
}

Use CalendarView to allow users to select multiple dates. The CalendarView has three views: the month view, year view, and decade view. You can specify a startup view by setting the DisplayMode property.

Example:

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <CalendarView />
</Grid>

Quirk: You need to set the Grid's background to a ThemeResource to make the CalendarView work properly. Otherwise, your app will throw an AccessViolationException (more info here).

<DatePicker Header="When were you born?" />

Example: Format the day field to show the day of the month and the abbreviated day of the week. The year field is hidden by setting the YearVisible property to False:

<DatePicker DayFormat="{}{day.integer} ({dayofweek.abbreviated})" YearVisible="False"/>

Example: Set a date programmatically:

// Set the default date to 3 months from the current date.
DatePicker1.Date = DateTimeOffset.Now.AddMonths(3);
 
// Set the default date to a specific date.
DatePicker1.Date = new DateTimeOffset(new DateTime(2014, 3, 28));
 
// Set the minimum year to the current year.
DatePicker1.MinYear = DateTimeOffset.Now;
 
// Set the minimum year and the maximum year.
// Note that we set the month to 2 to avoid time zone issues with January 1. 
DatePicker1.MinYear = new DateTimeOffset(new DateTime(2010, 2, 1));
DatePicker1.MaxYear = new DateTimeOffset(new DateTime(2030, 2, 1));

Example: Format a date programmatically:

// Example #1
DatePicker1.DayFormat = "{day.integer} ({dayofweek.full})";
 
// Example #2
DatePicker1.MonthFormat = "{month.integer}";

Example: Handle the DateChanged event. Also, format the selected date using DateTimeFormatter.The DateTimeFormatter class formats dates and times with the user's default settings.

<DatePicker x:Name="DatePicker1" Header="Select a date:" DateChanged="DatePicker1_DateChanged" />

using Windows.Globalization.DateTimeFormatting;
...
private void DatePicker1_DateChanged(object sender, DatePickerValueChangedEventArgs args)
{
    // Method #1
    DateTimeFormatter dateFormatter = new DateTimeFormatter("shortdate");
    Debug.WriteLine(dateFormatter.Format(args.NewDate)); // 10/19/2014
 
    // Method #2
    Debug.WriteLine(DateTimeFormatter.ShortDate.Format(args.NewDate)); // 10/19/2014
}

Example: Combine the values of the a TimePicker and a DatePicker into a single DateTimeOffset:

using Windows.Globalization.DateTimeFormatting;
...
DateTimeFormatter dateFormatter = new DateTimeFormatter("shortdate");
DateTimeFormatter timeFormatter = new DateTimeFormatter("shorttime");
 
// Use a calendar to determine Daylight Savings Time transition days.
Calendar calendar = new Calendar();
calendar.ChangeClock("24HourClock");
 
// The value of the selected time in a TimePicker is stored as a TimeSpan, 
// so it is possible to add it directly to the value of the selected date.
DateTimeOffset selectedDate = DatePicker1.Date;
DateTimeOffset combinedValue = new DateTimeOffset(
    new DateTime(selectedDate.Year, selectedDate.Month, selectedDate.Day) + TimePicker1.Time);
 
calendar.SetDateTime(combinedValue);
 
// If the day does not have 24 hours, then the user has selected a day in which 
// a Daylight Savings Time transition occurs.
// Validate the combination of the date and time values.
if (calendar.NumberOfHoursInThisPeriod != 24)
{
    Debug.WriteLine("A DST transition day selected");
}
else
{
    Debug.WriteLine("Combined value: " + 
        dateFormatter.Format(combinedValue) + " " + 
        timeFormatter.Format(combinedValue));
}

• The TimePicker can use a 12-hour or 24-hour clock.
• The pop-up portion of the TimePicker control uses TimePickerFlyout.

Example:

<TimePicker x:Name="TimePicker1" 
            Header="Select time" />

TimeSpan time = TimePicker1.Time;

Example:

<TimePicker ClockIdentifier="24HourClock" 
            Header="Worked hours" 
            MinuteIncrement="15" 
            Time="{Binding Path=WorkedHours, Mode=TwoWay" />

Example: Set the TimePicker's time programmatically:

// Set the time to 8 A.M.
TimePicker1.Time = new TimeSpan(8, 0, 0);

Example: Handle the TimeChanged event:

<TimePicker x:Name="TimePicker1" 
            Header="Select a time:" 
            Time="12:00:00" 
            TimeChanged="TimePicker1_TimeChanged" />

private void TimePicker1_TimeChanged(object sender, TimePickerValueChangedEventArgs args)
{
    Debug.WriteLine(args.NewTime.ToString());
}