How to Use Calendar Control: WPF

To select a date in our client application, enter the date into a textbox and then convert it to the particular class i.e. DateTime. What, if there is an in-built control to select a date, month and a year also. Calendar control is used to do these task and look like the following:

Display Modes of Calendar Control in WPF

The image shows three display modes of this calendar control i.e. month, year and decade respectively. By default it is Month view (the first view). User can switch the view to click on month and then year and so on. It have some commonly used properties which are:

DisplayDate: To specify the displayed date in the calendar control. Assign the date in the system date format.

SelectedDate: change the currently selected date. Used as the display date. If the control shows the old date we can change it to current using following code:
<Calendar SelectedDate="{x:Static sys:DateTime.Now}"/>

SelectionMode: it provides multiple modes for selection like “MultipleRange”. We can select a range of dates by using this property.

BlackoutDates: this control provides a feature of black out some dates means user cannot select some of the date blocked by system.
<CalendarDateRange Start="08.04.2013" End="08.04.2013"/>
<CalendarDateRange Start="08.16.2013" End="08.24.2013"/>
It will cross all the dates specified in the above range as shown in the following image:

Blackout Dates in Calendar Control: WPF

DisplayMode: to change the display modes i.e. year, month and decade as in our first diagram.

Like other controls it also have many events like selectedDatesChanged, displayDateChanged, displayModeChanged and etc. We can specify the actions to be performed at the particular event. Calendar control can be customizable as per the requirement of the user like background and foreground.

See also: Button Control

1 comment: