WinUI日历应用中如何为指定日期添加列表？

核心实现逻辑 #

要给指定日期绑定列表控件，核心是替换原文本块的布局控件，并将日期对应的事项集合绑定到新控件上，适配日历的布局特性。

具体操作步骤 #

• 替换布局控件：找到日历中CalendarDayItem的模板（可通过提取默认样式修改），将原来的TextBlock替换为ListView（需选择功能时）或ItemsRepeater（纯展示场景，性能更优）。
  示例XAML片段：

  <!-- 原文本块 -->
  <TextBlock Text="{Binding DateNotes}" />
  
  <!-- 替换为ItemsRepeater（轻量展示） -->
  <ItemsRepeater ItemsSource="{Binding DateEvents}" MaxHeight="90">
      <ItemsRepeater.ItemTemplate>
          <DataTemplate>
              <TextBlock Text="{Binding EventName}" FontSize="11" Margin="1,0"/>
          </DataTemplate>
      </ItemsRepeater.ItemTemplate>
      <ItemsRepeater.Layout>
          <StackLayout Spacing="2"/>
      </ItemsRepeater.Layout>
  </ItemsRepeater>
  

• 绑定数据源：在你的日期数据模型中添加集合属性，比如ObservableCollection<EventModel> DateEvents，用来存储对应日期的所有事项，确保集合更新时UI能自动同步。
• 调整样式适配日历：设置列表控件的最大高度、去掉多余边框、缩小项间距，避免破坏日历的整体布局。
  示例样式：

  <Style TargetType="ItemsRepeater">
      <Setter Property="Padding" Value="2"/>
      <Setter Property="HorizontalAlignment" Value="Stretch"/>
  </Style>
  

• 处理空数据场景：给列表添加空状态模板，当DateEvents为空时显示提示文本，提升用户体验：

  <VisualStateManager.VisualStateGroups>
      <VisualStateGroup>
          <VisualState x:Name="EmptyState">
              <VisualState.StateTriggers>
                  <StateTrigger IsActive="{Binding DateEvents, Converter={StaticResource EmptyCollectionConverter}}"/>
              </VisualState.StateTriggers>
              <VisualState.Setters>
                  <Setter Target="EmptyText.Visibility" Value="Visible"/>
                  <Setter Target="EventRepeater.Visibility" Value="Collapsed"/>
              </VisualState.Setters>
          </VisualState>
      </VisualStateGroup>
  </VisualStateManager.VisualStateGroups>
  <TextBlock x:Name="EmptyText" Text="无事项" FontSize="11" Visibility="Collapsed"/>
  <ItemsRepeater x:Name="EventRepeater" ItemsSource="{Binding DateEvents}"/>
  

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