如何在 DatePicker 中将颜色设置为多天？

Question

我想知道是否可以将特定颜色设置为 DatePicker 的特定日期，假设我想告诉用户这些天：5, 10, 11, 20, 30 有一些数据可供使用看。我需要指定一种特定的颜色，例如蓝色，这可能吗？

文档中没有任何依据。

谢谢。

Answer 1

DatePicker 和 Calendar 都对不适用日期提供开箱即用的支持。您可以利用此功能来确定哪些日期是可选的。然后就是重新设计日历日按钮的样式，使其看起来像您想要的样子。默认情况下，不适用日期有一个 'X'，但应用彩色阴影可能更好。

首先，给定一些 'selectable' 日期范围，计算倒数范围。这些是不可可选择的日期，即停电日期。

public void SetSelectableDates(IEnumerable<DateTime> times)
{
    var selectableDates = times.Select(d => d.Date).Distinct().OrderBy(o => o).ToList();
    var blackoutRanges = new List<CalendarDateRange>();

    _datePicker.BlackoutDates.Clear();

    if (selectableDates.Count == 0)
    {
        _datePicker.BlackoutDates.Add(
            new CalendarDateRange(DateTime.MinValue, DateTime.MaxValue));
        return;
    }

    var start = DateTime.MinValue;

    foreach (var date in selectableDates)
    {
        var end = date.AddDays(-1);

        if (date != start)
            blackoutRanges.Add(new CalendarDateRange(start, end));

        start = date.AddDays(1);
    }

    blackoutRanges.Add(new CalendarDateRange(start, DateTime.MaxValue));

    foreach (var range in blackoutRanges)
        _datePicker.BlackoutDates.Add(range);
}

接下来，设置应用自定义 CalendarDayButtonStyle 的 CalendarStyle 以覆盖可选择和不可选择日期在弹出窗口中的显示方式：

<DatePicker.CalendarStyle>
  <Style TargetType="Calendar">
    <Setter Property="CalendarDayButtonStyle">
      <Setter.Value>
        <Style TargetType="CalendarDayButton">
          <Setter Property="MinWidth"
                  Value="5" />
          <Setter Property="MinHeight"
                  Value="5" />
          <Setter Property="FontSize"
                  Value="10" />
          <Setter Property="Padding"
                  Value="5,1,5,1" />
          <Setter Property="HorizontalContentAlignment"
                  Value="Center" />
          <Setter Property="VerticalContentAlignment"
                  Value="Center" />
          <Setter Property="Template">
            <Setter.Value>
              <ControlTemplate TargetType="CalendarDayButton">
                <Border x:Name="border"
                        BorderBrush="Transparent"
                        BorderThickness="1"
                        Padding="{TemplateBinding Padding}"
                        Background="{TemplateBinding Background}">
                  <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                </Border>
                <ControlTemplate.Triggers>
                  <!--Trigger Property="IsToday" Value="True">
                    <Setter TargetName="border" Property="Background" Value="#FFAAAAAA" />
                  </Trigger-->
                  <Trigger Property="IsSelected" Value="True">
                    <Setter TargetName="border" Property="Background" Value="#FFBADDE9" />
                  </Trigger>
                  <Trigger Property="IsBlackedOut" Value="True">
                    <Setter TargetName="border" Property="TextBlock.Foreground" Value="#FFCCCCCC" />
                  </Trigger>
                  <Trigger Property="IsFocused" Value="True">
                    <Setter TargetName="border" Property="BorderBrush" Value="#FF45D6FA" />
                  </Trigger>
                </ControlTemplate.Triggers>
              </ControlTemplate>
            </Setter.Value>
          </Setter>
        </Style>
      </Setter.Value>
    </Setter>
  </Style>
</DatePicker.CalendarStyle>

通常的样式规则适用：您需要使用适合您的应用程序主题（或系统主题）的画笔。

结果：

如何在 DatePicker 中将颜色设置为多天？

How to set color to multiple days in DatePicker?

wpf

xaml

mahapps.metro