WPF 数据网格根据属性值更改行颜色

Question

我有一个填充了 CollectionViewSource 的 WPF Datagrid，我想要的是根据绑定的属性值更改行背景颜色。

如果值为“KO”则为红色
如果值为“OK”则为绿色
如果值为“已创建”则为黄色

我在 SO 上阅读了不同的主题，例如 or ，但仍在努力完成这项工作。

我不知道我的代码有什么问题。这是我尝试过的：

Main.Xaml

<UserControl.DataContext>
        <Viewmodel:LoadServerViewModel/>
</UserControl.DataContext>

<Grid Margin="10,20,20,20" Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="6">
    <DataGrid AutoGenerateColumns="False" 
              ScrollViewer.CanContentScroll="True" 
              ScrollViewer.VerticalScrollBarVisibility="Visible" 
              ScrollViewer.HorizontalScrollBarVisibility="Visible" 
              VerticalAlignment="Stretch"
              IsReadOnly="False" 
              ItemsSource="{Binding Servers}">
        <DataGrid.RowStyle>
            <Style TargetType="DataGridRow">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding RowStatus}" Value="Created">
                        <Setter Property="Background" Value="Yellow" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding RowStatus}" Value="OK">
                        <Setter Property="Background" Value="Green" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding RowStatus}" Value="KO">
                        <Setter Property="Background" Value="Red" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </DataGrid.RowStyle>
        <DataGrid.Columns>
            <DataGridTextColumn Header="Name" Binding="{Binding Name}" />
            <DataGridTextColumn Header="Last Update" Binding="{Binding LastUp} />
            ....
        </DataGrid.Columns>
    </DataGrid>
</Grid>

<Button Style="{DynamicResource RoundedButtonStyle}" Grid.Row="1" Grid.Column="3"
                Content="Refresh"
                Margin="0,0,40,0"
                Height="25"
                Width="90"
                Foreground="#FFFFFF"
                Background="#2f3640"
                Command="{Binding ButtonRefresh}">
</Button>

LoadServerViewModel.cs

private string _rowStatus = "Created";
private readonly RelayCommand _buttonRefresh;

public string RowStatus
{
    get => _rowStatus;
    set
    {
        _rowStatus = value;
        OnPropertyChanged(nameof(RowStatus));
    }
}

public ICollectionView Servers
{
    get
    {
        if (_collectionViewSource.View != null)
        {
            _collectionViewSource.View.CurrentChanged += (sender, e) => ServerGridFormat = _collectionViewSource.View.CurrentItem as ServerGridFormat;
            return _collectionViewSource?.View;
        }
        return null;
    }
}

public ServerGridFormat ServerGridFormat 
{
    get => _servergridformat;
    set
    {
        servergridformat = value;
        OnPropertyChanged(nameof(ServerGridFormat));
    }
}

public LoadServerViewModel() {
    // Button to trigger the change of RowStatus from "Created" to "OK" therefore the color of all rows
    _buttonRefresh = new RelayCommand(o => RowStatus = "OK");
}

感谢您的帮助

Answer 1

您当前的绑定使用单个行的 DataContext 作为绑定源（这是存储在 ItemsSource 中的数据模型）。但是您的属性 RowStatus 是在 DataGrid（即 LoadServerViewModel）的 DataContext 对象上定义的。

要使其正常工作，您必须调整数据绑定以使用正确的来源（或者将 RowSatus 属性移动到数据模型）：

<Style TargetType="DataGridRow">
  <Style.Triggers>
    <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=DataGrid}, Path=DataContext.RowStatus}" 
                 Value="Created">
      <Setter Property="Background" Value="Yellow" />
    </DataTrigger>
  </Style.Triggers>
</Style>

WPF 数据网格根据属性值更改行颜色

WPF datagrid change row color based on a property value

c#

wpf

datagrid

WPF 数据网格根据 属性 值更改行颜色

WPF datagrid change row color based on a property value

c#

wpf

datagrid

WPF 数据网格根据属性值更改行颜色