Implementing Date Time Pickers
A comprehensive skill for implementing and customizing the Syncfusion .NET MAUI DateTimePicker (SfDateTimePicker) control. This component provides a flexible way to select dates, times, or both with extensive customization options.
When to Use This Skill
Use this skill when you need to:
- Add date and time selection to .NET MAUI apps
- Implement appointment or booking systems
- Create scheduling interfaces with time slots
- Build forms requiring datetime input
- Add calendar pickers with time selection
- Implement date range restrictions
- Customize picker appearance (headers, footers, themes)
- Handle selection events and data binding
- Support multiple date/time formats
- Localize picker labels and buttons
- Implement accessible datetime selection
Component Overview
The SfDateTimePicker is a versatile picker control that allows users to select:
- Dates only - Pick day, month, and year
- Times only - Pick hours, minutes, and seconds
- Date and Time - Combined selection
- Formatted display - 18 date formats and 9 time formats
- Multiple display modes - Inline, Dialog, or Relative Dialog
- Date restrictions - Min/max dates and blackout times
- Custom intervals - Skip days, months, hours, minutes
- Full customization - Headers, footers, columns, selection views
- Localization - Multi-language support
Documentation and Navigation Guide
Getting Started & Installation
📄 Read: references/getting-started.md
- Installing Syncfusion.Maui.Picker NuGet package
- Registering handler in MauiProgram.cs
- Basic DateTimePicker implementation (XAML & C#)
- Running your first application
- Minimal working examples
Date and Time Formatting
📄 Read: references/formatting.md
- 18 predefined date formats (dd_MM_yyyy, yyyy_MM_dd, MMM_dd_yyyy, etc.)
- 9 predefined time formats (h_mm_tt, HH_mm_ss, hh_mm_ss_tt, etc.)
- Setting DateFormat and TimeFormat properties
- Custom format configurations
- Format selection best practices
- Display format examples
Picker Modes and Display
📄 Read: references/picker-modes.md
- Default mode (inline display)
- Dialog mode (popup with overlay)
- RelativeDialog mode (positioned popup)
- IsOpen property for programmatic control
- 8 RelativePosition options (AlignTop, AlignBottom, AlignTopLeft, etc.)
- Mode selection guidance by use case
- Opening picker programmatically
Customization
📄 Read: references/customization.md
- Header customization (text, divider color, templates)
- HeaderTemplate and HeaderTemplateSelector
- Column header styling
- Footer customization (OK/Cancel buttons, text, visibility)
- Selection view appearance
- Background colors and text styles
- DataTemplate and DataTemplateSelector examples
- Advanced theming
Date Restrictions
📄 Read: references/date-restriction.md
- MinimumDate property (lower bound restrictions)
- MaximumDate property (upper bound restrictions)
- BlackoutDateTimes (blocking specific dates and times)
- Validation rules
- Use cases (holidays, unavailable periods, business hours)
- Restriction patterns and best practices
Intervals
📄 Read: references/intervals.md
- Date intervals (DayInterval, MonthInterval, YearInterval)
- Time intervals (HourInterval, MinuteInterval, SecondInterval, MilliSecondInterval)
- Combining multiple intervals
- Skip patterns for appointment booking
- Time slot configurations (15 min, 30 min intervals)
- Use cases and examples
Events
📄 Read: references/events.md
- SelectionChanged event (NewValue, OldValue)
- Immediate vs confirmed selection (IsSelectionImmediate)
- Dialog mode events (Opened, Closing, Closed)
- Canceling selection in Closing event
- Event handling patterns
- Data binding with events
- MVVM integration
Localization
📄 Read: references/localization.md
- Localizable strings (Day, Month, Year, Hour, Minute, Second, OK, Cancel)
- Setting CurrentUICulture
- Creating resource files (.resx)
- Adding translations for multiple languages
- Resource file structure and naming
- French, Spanish, and other language examples
- Best practices for multi-language apps
Accessibility
📄 Read: references/accessibility.md
- WCAG compliance features
- Keyboard navigation support
- Screen reader compatibility
- Semantic properties and AutomationId
- Focus management
- Accessible date/time selection
- Testing accessibility
1---
2name: syncfusion-maui-date-time-picker
3description: Implements Syncfusion .NET MAUI DateTimePicker (SfDateTimePicker) control. Use when implementing date and time selection, datetime pickers, or date-time input interfaces in .NET MAUI applications. Covers DateTimePicker setup, formatting dates/times, picker modes (dialog/relative), customization, date restrictions, intervals, events, localization, and accessibility.
4metadata:
5 author: "Syncfusion Inc"
6 version: "34.1.29"
7---
8
9# Implementing Date Time Pickers
10
11A comprehensive skill for implementing and customizing the Syncfusion .NET MAUI DateTimePicker (SfDateTimePicker) control. This component provides a flexible way to select dates, times, or both with extensive customization options.
12
13## When to Use This Skill
14
15Use this skill when you need to:
16- Add date and time selection to .NET MAUI apps
17- Implement appointment or booking systems
18- Create scheduling interfaces with time slots
19- Build forms requiring datetime input
20- Add calendar pickers with time selection
21- Implement date range restrictions
22- Customize picker appearance (headers, footers, themes)
23- Handle selection events and data binding
24- Support multiple date/time formats
25- Localize picker labels and buttons
26- Implement accessible datetime selection
27
28## Component Overview
29
30The **SfDateTimePicker** is a versatile picker control that allows users to select:
31- **Dates only** - Pick day, month, and year
32- **Times only** - Pick hours, minutes, and seconds
33- **Date and Time** - Combined selection
34- **Formatted display** - 18 date formats and 9 time formats
35- **Multiple display modes** - Inline, Dialog, or Relative Dialog
36- **Date restrictions** - Min/max dates and blackout times
37- **Custom intervals** - Skip days, months, hours, minutes
38- **Full customization** - Headers, footers, columns, selection views
39- **Localization** - Multi-language support
40
41## Documentation and Navigation Guide
42
43### Getting Started & Installation
44📄 **Read:** [references/getting-started.md](references/getting-started.md)
45- Installing Syncfusion.Maui.Picker NuGet package
46- Registering handler in MauiProgram.cs
47- Basic DateTimePicker implementation (XAML & C#)
48- Running your first application
49- Minimal working examples
50
51### Date and Time Formatting
52📄 **Read:** [references/formatting.md](references/formatting.md)
53- 18 predefined date formats (dd_MM_yyyy, yyyy_MM_dd, MMM_dd_yyyy, etc.)
54- 9 predefined time formats (h_mm_tt, HH_mm_ss, hh_mm_ss_tt, etc.)
55- Setting DateFormat and TimeFormat properties
56- Custom format configurations
57- Format selection best practices
58- Display format examples
59
60### Picker Modes and Display
61📄 **Read:** [references/picker-modes.md](references/picker-modes.md)
62- Default mode (inline display)
63- Dialog mode (popup with overlay)
64- RelativeDialog mode (positioned popup)
65- IsOpen property for programmatic control
66- 8 RelativePosition options (AlignTop, AlignBottom, AlignTopLeft, etc.)
67- Mode selection guidance by use case
68- Opening picker programmatically
69
70### Customization
71📄 **Read:** [references/customization.md](references/customization.md)
72- Header customization (text, divider color, templates)
73- HeaderTemplate and HeaderTemplateSelector
74- Column header styling
75- Footer customization (OK/Cancel buttons, text, visibility)
76- Selection view appearance
77- Background colors and text styles
78- DataTemplate and DataTemplateSelector examples
79- Advanced theming
80
81### Date Restrictions
82📄 **Read:** [references/date-restriction.md](references/date-restriction.md)
83- MinimumDate property (lower bound restrictions)
84- MaximumDate property (upper bound restrictions)
85- BlackoutDateTimes (blocking specific dates and times)
86- Validation rules
87- Use cases (holidays, unavailable periods, business hours)
88- Restriction patterns and best practices
89
90### Intervals
91📄 **Read:** [references/intervals.md](references/intervals.md)
92- Date intervals (DayInterval, MonthInterval, YearInterval)
93- Time intervals (HourInterval, MinuteInterval, SecondInterval, MilliSecondInterval)
94- Combining multiple intervals
95- Skip patterns for appointment booking
96- Time slot configurations (15 min, 30 min intervals)
97- Use cases and examples
98
99### Events
100📄 **Read:** [references/events.md](references/events.md)
101- SelectionChanged event (NewValue, OldValue)
102- Immediate vs confirmed selection (IsSelectionImmediate)
103- Dialog mode events (Opened, Closing, Closed)
104- Canceling selection in Closing event
105- Event handling patterns
106- Data binding with events
107- MVVM integration
108
109### Localization
110📄 **Read:** [references/localization.md](references/localization.md)
111- Localizable strings (Day, Month, Year, Hour, Minute, Second, OK, Cancel)
112- Setting CurrentUICulture
113- Creating resource files (.resx)
114- Adding translations for multiple languages
115- Resource file structure and naming
116- French, Spanish, and other language examples
117- Best practices for multi-language apps
118
119### Accessibility
120📄 **Read:** [references/accessibility.md](references/accessibility.md)
121- WCAG compliance features
122- Keyboard navigation support
123- Screen reader compatibility
124- Semantic properties and AutomationId
125- Focus management
126- Accessible date/time selection
127- Testing accessibility
128
gabrielmoreira