UWP开发如何实现XAML CalendarView控件的指定日期高亮

UWP 原生CalendarView控件没有提供直接绑定高亮日期集合的属性，所有自定义日期单元格样式都需要通过CalendarViewDayItemChanging渲染事件实现，按以下步骤修改即可：

• 首先将存储还书日期的集合从方法局部变量升级为页面类的私有字段，方便多个事件方法共享访问
• 给日历控件绑定日期项渲染事件，在每个日期单元格加载/重绘时判断是否需要应用高亮样式
• 处理日期选中事件，判断选中项为还书日时弹出对应图书信息
• 注意处理日历滚动时的单元格复用问题，避免样式错乱

具体代码实现 #

1. 后台CS代码修改 #

首先在页面类内定义全局的高亮日期集合：

// 存储所有需要高亮的还书日期
private List<DateTimeOffset> highlightedDates = new List<DateTimeOffset>();

修改你已有的PopulateCalendar方法，收集完日期后触发日历重绘：

private void PopulateCalendar()
{
    User user = PageController.loggedIn;
    highlightedDates.Clear();
    foreach (Loan loan in user.Loans)
    {
        // 统一取日期部分丢弃时分秒，避免后续匹配失败
        highlightedDates.Add(loan.ReturnDate.Date);
    }
    // 刷新日历视图，触发所有日期项重绘
    calendarView.UpdateLayout();
}

添加日历日期项渲染事件处理方法，实现高亮逻辑：

private void calendarView_CalendarViewDayItemChanging(CalendarView sender, CalendarViewDayItemChangingEventArgs args)
{
    DateTimeOffset currentRenderDate = args.Item.Date.Date;
    if (highlightedDates.Contains(currentRenderDate))
    {
        // 匹配到还书日期，设置高亮样式，颜色可自行调整
        args.Item.Background = new SolidColorBrush(Colors.OrangeRed);
        args.Item.Foreground = new SolidColorBrush(Colors.White);
        args.Item.Tag = "DueDate";
    }
    else
    {
        // 非还书日恢复默认样式，解决滚动时单元格复用导致的样式错乱问题
        args.Item.ClearValue(CalendarViewDayItem.BackgroundProperty);
        args.Item.ClearValue(CalendarViewDayItem.ForegroundProperty);
        args.Item.Tag = null;
    }
}

在已有的日期选中事件方法中添加弹窗逻辑：

private void CalendarViewSelectedDatesChanged(CalendarView sender, CalendarViewSelectedDatesChangedEventArgs args)
{
    if (args.AddedDates.Count == 0) return;
    DateTimeOffset selectedDate = args.AddedDates[0].Date;
    if (highlightedDates.Contains(selectedDate))
    {
        // 查询选中日期对应的所有待还图书
        var dueBooks = PageController.loggedIn.Loans
            .Where(l => l.ReturnDate.Date == selectedDate)
            .ToList();
        // 拼接展示内容，可根据自己的Book类属性调整展示字段
        StringBuilder contentBuilder = new StringBuilder();
        contentBuilder.AppendLine("当日需归还以下图书：");
        foreach (var loan in dueBooks)
        {
            contentBuilder.AppendLine($"《{loan.Book.Title}》 作者：{loan.Book.Author}");
        }
        // 弹出信息弹窗
        ContentDialog bookDialog = new ContentDialog
        {
            Title = "还书提醒",
            Content = contentBuilder.ToString(),
            CloseButtonText = "确定"
        };
        _ = bookDialog.ShowAsync();
    }
}

若编译提示找不到SolidColorBrush、Colors、ContentDialog、StringBuilder类，在CS文件头部补充以下命名空间引用即可：

using Windows.UI;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Controls;
using System.Text;
using System.Linq;

2. XAML代码修改 #

给原有的CalendarView控件添加CalendarViewDayItemChanging事件绑定，修改后控件代码如下：

<CalendarView  x:Name="calendarView" Margin="800,80,0,0" VerticalAlignment="Top" Height="400" Width="400" 
               SelectedDatesChanged="CalendarViewSelectedDatesChanged"
               CalendarViewDayItemChanging="calendarView_CalendarViewDayItemChanging"/>

内容的提问来源于stack exchange，提问作者Aliator