Date Navigator

May 16, 2023
4 minutes to read

The DateNavigator control allows users to select a date or a range of dates.

The image below shows the elements of the DateNavigator.

Add the Date Navigator

The DateNavigator is a standalone control. To use it with the Scheduler, add a DateNavigator to your application and use the SchedulerDateNavigatorStyleSettings.Scheduler property to bind the DateNavigator to the SchedulerControl as follows:

XAML

xaml

xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"
    xmlns:dxsch="http://schemas.devexpress.com/winfx/2008/xaml/scheduling"
<!---->
 <Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
    <dxsch:SchedulerControl x:Name="scheduler" />
    <dxe:DateNavigator x:Name="datenavigator" 
        Grid.Column="1" 
        VerticalAlignment="Stretch">
        <dxe:DateNavigator.StyleSettings>
            <dxsch:SchedulerDateNavigatorStyleSettings Scheduler="{Binding ElementName=scheduler}" />
        </dxe:DateNavigator.StyleSettings>
    </dxe:DateNavigator>
</Grid>

Refer to the following topic for a step-by-step tutorial: How to: Create the Scheduler with the DateNavigator.

Date Types

The DateNavigator control includes the following date types:

Type	Property	Description
Disabled Date	DisabledDates	Gets or sets a collection of dates unavailable for selection.
Focused Date	FocusedDate	Gets or sets the focused date in a calendar.
Holiday	Holidays	Gets or sets a collection of custom holidays.
Selected Date	SelectedDates	Gets or sets a collection of dates selected in the DateNavigator control.
Special Date	SpecialDates	Gets or sets a collection of special dates.
Workday	Workdays	Gets or sets a collection of workdays in a week.

Handle the DateNavigator.RequestCellState event to conditionally mark cells as disabled, holiday, or special.

Tip

To specify cell appearance for each state, use the Appearance property.

Customize the Date Navigator

Display Settings

The table below lists all properties that affect DateNavigator appearance.

Characteristics

Properties

| | --- | --- | |

Today button visibility

DateNavigator.ShowTodayButton

| |

Number of rows and columns

DateNavigator.ColumnCount

DateNavigator.RowCount

| |

First day of the week

DateNavigator.FirstDayOfWeek

| |

Holidays

DateNavigator.Holidays

DateNavigator.HighlightHolidays

| |

Workdays

DateNavigator.Workdays

DateNavigator.ExactWorkdays

| |

Special dates

DateNavigator.SpecialDates

DateNavigator.HighlightSpecialDates

| |

Week numbers

DateNavigator.ShowWeekNumbers

Call the RefreshCellAppearances() method to raise the RequestCellAppearance event for each cell and clear cached appearance values. To display a specific date in the current DateNavigator view, use the ScrollToDate(DateTime) method.