#363 – Calendar Control Basics

The Calendar control displays an image of a calendar and allows a user to select a date.  By default, the calendar shows a single month that includes the current date.

    <StackPanel HorizontalAlignment="Center" Margin="15">
        <Calendar Name="cal"/>
        <Label Content="{Binding ElementName=cal, Path=SelectedDate, StringFormat=d}"/>
    </StackPanel>

When the user selects a date on the calendar, the SelectedDate property indicates the day that was selected.

You can use the left and right arrow icons at the top of the control to navigate to the previous/next month.

The Calendar control can also display a single year, or a single decade.  To switch to the Year mode, click on the name of the month at the top of the control.

You can now navigate to the previous/next year using the arrows, or click on a specific month.

You can switch to Decade mode by clicking on the year at the top of the control.