WPF Calendar日历控件的详细使用

最新推荐文章于 2024-12-18 14:43:35 发布

生命不息-学无止境

最新推荐文章于 2024-12-18 14:43:35 发布

阅读量1.4k

点赞数 26

分类专栏： WPF 文章标签： wpf

本文链接：https://blog.csdn.net/weixin_39604653/article/details/142267183

版权

WPF 专栏收录该内容

91 篇文章

订阅专栏

WPF 的 Calendar 控件是一种允许用户在图形界面上选择日期或一组日期的控件。它功能强大，支持单选、多选，以及自定义显示日期范围等功能。下面是关于 Calendar 控件的详细使用教程。

1. 基本介绍

Calendar 控件用于显示一个月的日历，可以让用户选择单个或多个日期。它的显示可以根据需要进行自定义，包括设置显示的月份、年份，禁用某些日期等。

基本语法：

<Calendar />

2. 基本使用

2.1 显示一个简单的日历

最简单的方式是在 XAML 中直接使用 Calendar 控件。

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Calendar Example" Height="200" Width="400">
    <Grid>
        <Calendar />
    </Grid>
</Window>

在这里插入图片描述

效果：这会显示一个基本的日历，用户可以选择一个日期，月份和年份可以通过控件的导航按钮进行切换。

2.2 获取选中的日期

Calendar 的核心功能是选择日期。可以通过其 SelectedDate 属性获取用户选择的日期。结合代码后端来捕捉用户选择的变化。

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Calendar Example" Height="200" Width="400">
    <StackPanel>
        <Calendar x:Name="MyCalendar" SelectedDatesChanged="MyCalendar_SelectedDateChanged"/>
        <TextBlock x:Name="SelectedDateText" FontSize="16" Margin="10"/>
    </StackPanel>
</Window>

后台代码：

private void MyCalendar_SelectedDateChanged(object sender, SelectionChangedEventArgs e)
{
    if (MyCalendar.SelectedDate.HasValue)
    {
        SelectedDateText.Text = $"Selected Date: {MyCalendar.SelectedDate.Value.ToShortDateString()}";
    }
}

解释：

SelectedDatesChanged 事件可以捕捉到用户改变日期的操作。
SelectedDate 属性用于获取当前选择的日期。

2.3 设置默认选中日期

可以通过 SelectedDate 属性来设置默认选中的日期。

<Calendar SelectedDate="2023-12-25"/>

这会让日历在显示时默认选中 2023 年 12 月 25 日。

3. 日期选择模式

Calendar 控件有三种选择模式，通过 SelectionMode 属性来指定：

SingleDate（默认）：用户只能选择一个日期。
SingleRange：用户可以选择一个连续的日期范围。
MultipleRange：用户可以选择多个不连续的日期范围。

3.1 单选模式（SingleDate）

这是默认模式，只允许用户选择单个日期。

<Calendar SelectionMode="SingleDate"/>

3.2 单范围选择（SingleRange）

用户可以选择一个日期范围，开始和结束日期之间的所有日期都会被选中。

<Calendar SelectionMode="SingleRange"/>

3.3 多范围选择（MultipleRange）

用户可以通过按住 Ctrl 键选择多个不连续的日期范围。

<Calendar SelectionMode="MultipleRange"/>

4. 日期显示与禁用

4.1 限制可选日期范围

可以通过 DisplayDateStart 和 DisplayDateEnd 属性来限制日历中可选的日期范围。

<Calendar DisplayDateStart="2023-01-01" DisplayDateEnd="2023-12-31"/>

这将让用户只能选择 2023 年内的日期，其他日期将被禁用。

4.2 禁用特定日期

通过 BlackoutDates 属性可以禁用某些特定日期，用户无法选择这些日期。

<Calendar>
    <Calendar.BlackoutDates>
        <CalendarDateRange Start="2023-12-25" End="2023-12-31"/>
    </Calendar.BlackoutDates>
</Calendar>

这里的代码会禁用 2023 年 12 月 25 日至 12 月 31 日的日期，用户无法选择这段时间内的日期。

5. 自定义显示

5.1 显示的初始月份

可以通过 DisplayDate 属性来设置日历显示的初始月份。

<Calendar DisplayDate="2023-10-01"/>

在这里插入图片描述

这会让日历默认显示 2023 年 10 月的月份视图。

5.2 日期格式化

可以通过设置 SelectedDateFormat 属性来控制日期的显示格式。可选值有 Short 和 Long：

Short：以短日期格式显示（如 MM/dd/yyyy）。
Long：以长日期格式显示（如 Monday, January 1, 2023）。

<Calendar SelectedDateFormat="Long"/>

6. 事件处理

6.1 `SelectedDateChanged` 事件

这是最常用的事件，用于捕捉用户选中日期的变化。

private void MyCalendar_SelectedDateChanged(object sender, SelectionChangedEventArgs e)
{
    if (MyCalendar.SelectedDate.HasValue)
    {
        MessageBox.Show($"You selected: {MyCalendar.SelectedDate.Value.ToShortDateString()}");
    }
}

6.2 `DisplayDateChanged` 事件

当用户通过导航按钮改变显示月份时触发该事件。

private void MyCalendar_DisplayDateChanged(object sender, CalendarDateChangedEventArgs e)
{
    MessageBox.Show($"Displayed month changed to: {MyCalendar.DisplayDate.ToShortDateString()}");
}

7. 样式与模板

通过自定义 Calendar 控件的样式，你可以改变日历的外观。以下是一个简单的样式例子，将 Calendar 的背景颜色改为浅灰色。

<Calendar>
    <Calendar.Style>
        <Style TargetType="Calendar">
            <Setter Property="Background" Value="LightGray"/>
        </Style>
    </Calendar.Style>
</Calendar>