设置ItemsControl的背景颜色

Question

在我的WPF应用程序中，我有Item控件，显示日期和一周的日期。现在，我需要更改今天日期的项目的背景颜色。这是XAML代码

  <ItemsControl Grid.Column="1"
                Focusable="False" 
               ItemsSource="{Binding WeekDays}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ItemsControl.ItemTemplate >
                    <DataTemplate>
                        <Border BorderBrush="{StaticResource GrayBrush7}"
                                BorderThickness="1,0,0,0"
                                SnapsToDevicePixels="True"
                                UseLayoutRounding="True">                                
                            <StackPanel Margin="2" 
                                      VerticalAlignment="Center">
                                <TextBlock HorizontalAlignment="Center"
                                           VerticalAlignment="Top"                                               
                                           Text="{Binding Day}"
                                           TextAlignment="Center"/>

                                <TextBlock HorizontalAlignment="Center"
                                           VerticalAlignment="Top"                                               
                                           Text="{Binding Date, 
                                                StringFormat='dd/MM/yyyy'}"
                                           TextAlignment="Center"/>
                            </StackPanel>
                        </Border>
                        </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>

提前致谢。

Answer 1

如果模型类中有IsToday属性，则可以在边框样式中使用DataTrigger。像这样

public class WeekDay
{
    public DateTime Date { get; }
    public string Day { get; }
    public bool IsToday { get; }

    public WeekDay(DateTime date)
    {
        this.Date = date;
        this.Day = date.DayOfWeek.ToString();
        this.IsToday = date.Date == DateTime.Today;
    }
}

<ItemsControl.ItemTemplate >
    <DataTemplate>
        <Border BorderBrush="{StaticResource GrayBrush7}"
                BorderThickness="1,0,0,0"
                SnapsToDevicePixels="True"
                UseLayoutRounding="True">
            <Border.Style>
                <Style TargetType="Border">
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding IsToday}" Value="True">
                            <Setter Property="Background" Value="Yellow" />
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Border.Style>
...

作为替代方法，您可以使用ValueConverter将Date转换为Background。

public class DateToItemBackgroundConverter : IValueConverter
{
    private static readonly Brush TodayBGBrush = new SolidColorBrush(Colors.Yellow);

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value == null || !(value is DateTime))
        {
            return value;
        }

        var isToday = ((DateTime)value).Date == DateTime.Today;

        return isToday ? TodayBGBrush : null;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

<ItemsControl Grid.Column="1"
              Focusable="False" 
              ItemsSource="{Binding WeekDays}">
    <ItemsControl.Resources>
        <local:DateToItemBackgroundConverter x:Key="bgConverter" />
    </ItemsControl.Resources>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate >
        <DataTemplate>
            <Border BorderBrush="{StaticResource GrayBrush7}"
                    Background="{Binding Date, Converter={StaticResource bgConverter}}"
                    BorderThickness="1,0,0,0"
                    SnapsToDevicePixels="True"
                    UseLayoutRounding="True">
...

请记住，如果您想在更新TODAY时刷新背景，则应重建模型数据或再次通知PropertyChanged。

Answer 2

你可以添加一个Border风格与DataTrigger到你的ItemTemplate。将Date属性的DateTime属性与静态DateTime.Today属性进行比较：

<ItemsControl.ItemTemplate>
    <DataTemplate>
        <Border BorderBrush="{StaticResource GrayBrush7}"
                BorderThickness="1,0,0,0"
                SnapsToDevicePixels="True"
                UseLayoutRounding="True">
            <Border.Style>
                <Style TargetType="Border" xmlns:system="clr-namespace:System;assembly=mscorlib">
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding Date.Date}" Value="{x:Static system:DateTime.Today}">
                            <Setter Property="Background" Value="Yellow" />
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Border.Style>
            <StackPanel Margin="2" 
                        VerticalAlignment="Center">
                <TextBlock HorizontalAlignment="Center"
                           VerticalAlignment="Top"                                               
                           Text="{Binding Day}"
                           TextAlignment="Center"/>

                <TextBlock HorizontalAlignment="Center"
                           VerticalAlignment="Top"                                               
                           Text="{Binding Date,  StringFormat='dd/MM/yyyy'}"
                           TextAlignment="Center"/>
            </StackPanel>
        </Border>
    </DataTemplate>
</ItemsControl.ItemTemplate>