syncfusion-wpf-datepicker

实现 Syncfusion WPF DatePicker（SfDatePicker）

SfDatePicker 控件让用户能够以便于触控的方式选择日期，并提供可自定义的下拉日期选择器。本技能涵盖从基本设置到高级自定义和样式设置的所有内容。

何时使用此技能

• 基本日期选择 – 在 WPF 应用程序中添加 DatePicker 控件
• 日期格式设置 – 以各种格式显示日期（短日期、长日期、仅月份等）
• 自定义日期选择器 – 修改下拉选择器的单元格模板、大小和间距
• 样式和外观 – 更改颜色、背景、主题和流向（支持 RTL）
• 管理日期值 – 设置、验证和限制日期范围；处理日期更改事件
• 高级交互 – 内联编辑、水印、基于焦点的更新、键盘输入
• 便捷的用户体验 – 实现空值、水印文本和屏幕键盘支持

导航指南

入门

📄 阅读： references/getting-started.md

• NuGet 安装和程序集引用
• 通过设计器、XAML 或 C# 代码添加控件
• 设置初始日期值
• 处理日期更改事件（ValueChanged）
• 基本设置和初始化

日期格式设置

📄 阅读： references/date-formatting.md

• 使用 FormatString 属性设置显示格式
• 使用 SelectorFormatString 设置选择器格式
• 常用格式说明符和示例
• 以各种格式显示日期

日期选择器自定义

📄 阅读： references/date-selector-customization.md

• 了解 SfDateSelector 结构
• 自定义单元格模板（日、月、年）
• 调整单元格大小和间距
• 基于样式进行自定义
• 视觉模板示例

外观和样式

📄 阅读： references/appearance-and-styling.md

• 更改前景色和背景色
• 强调色和所选项样式
• 从右向左（RTL）流向
• 内置主题（SfSkinManager、ThemeStudio）
• 水印文本和模板

值和日期管理

📄 阅读： references/value-and-date-management.md

• 以编程方式设置日期值
• 处理空值
• 水印和占位文本
• 内联编辑和键盘输入
• 最小/最大日期范围限制
• 基于焦点的值更新

功能和交互

📄 阅读： references/features-and-interaction.md

• 内联编辑模式
• 屏幕键盘输入范围
• 日期范围验证
• 本地化支持
• 常见工作流和最佳实践

快速入门

在 XAML 中创建基本 DatePicker

<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:syncfusion="http://schemas.syncfusion.com/wpf"
        Title="DatePicker Sample">
    <Grid>
        <syncfusion:SfDatePicker x:Name="sfDatePicker" 
                                 Width="200"
                                 Value="3/19/2026"/>
    </Grid>
</Window>

在 C# 中创建基本 DatePicker

using Syncfusion.Windows.Controls.Input;

SfDatePicker sfDatePicker = new SfDatePicker();
sfDatePicker.Value = new DateTime(2026, 3, 19);
sfDatePicker.Width = 200;
this.Content = sfDatePicker;

处理日期选择

sfDatePicker.ValueChanged += (d, e) => 
{
    DateTime oldDate = (DateTime)e.OldValue;
    DateTime newDate = (DateTime)e.NewValue;
    Console.WriteLine($"Date changed from {oldDate:d} to {newDate:d}");
};

常见模式

模式 1：设置日期格式

<syncfusion:SfDatePicker FormatString="M" x:Name="sfDatePicker"/>

模式 2：限制日期范围

sfDatePicker.MinDate = new DateTime(2026, 1, 1);
sfDatePicker.MaxDate = new DateTime(2026, 12, 31);

模式 3：允许空值并显示水印

<syncfusion:SfDatePicker AllowNull="True" 
                         Value="{x:Null}"
                         Watermark="Select a date"
                         x:Name="sfDatePicker"/>

模式 4：带验证的内联编辑

<syncfusion:SfDatePicker AllowInlineEditing="True" 
                         InputScope="Number"
                         x:Name="sfDatePicker"/>

模式 5：使用颜色自定义样式

<syncfusion:SfDatePicker Foreground="Blue"
                         Background="LightGray"
                         AccentBrush="Green"
                         x:Name="sfDatePicker"/>

关键属性参考

属性	类型	默认值	用途
值	DateTime?	当前日期	所选日期
FormatString	string	"d"	日期显示格式
SelectorFormatString	string	"M/d/yyyy"	下拉选择器格式
AllowNull	bool	false	允许空值
Watermark	string	null	占位文本
MinDate	DateTime	最小值	可选的最早日期
MaxDate	DateTime	最大值	可选的最晚日期
AllowInlineEditing	bool	false	启用日期内联编辑
ShowDropDownButton	bool	true	显示/隐藏下拉按钮
DropDownHeight	double	Auto	下拉弹出窗口的高度
Foreground	Brush	Black	文本颜色
Background	Brush	White	控件背景
AccentBrush	Brush	Blue	所选项的高亮颜色