C# WPF 根据数据更改 DataGrid 行（背景）颜色

Posted 2023-03-30

【中文标题】C# WPF 根据数据更改 DataGrid 行（背景）颜色

【英文标题】：C# WPF change DataGrid row (background) color based on the data

【发布时间】：2021-12-03 20:43:29

【问题描述】：

我有 Datagrid 视图，如下所示： 选择的是“状态”，它有 3 种值（付费、未付费和其他）。 我想根据状态制作每行的背景，如果是未付费，则颜色为红色，如果已付费，则颜色为绿色，在其他选项中为白色或无颜色。 我从 mysql 数据库中接收数据。 我的数据网格 XML 代码：

<DataGrid HorizontalAlignment="Right" Height="178" FontWeight="Bold" Margin="0,193,63,0" VerticalAlignment="Top" Width="1087"  x:Name="FactorGrid" ItemsSource="Binding LoadDataBinding" CanUserResizeRows="False"  AutoGenerateColumns="False" CanUserAddRows="False" ContextMenuOpening="FactorGrid_ContextMenuOpening">
        <DataGrid.Columns>
            <DataGridTextColumn Binding="Binding id" Header="شماره صورتحساب" Width="110" IsReadOnly="True" />
            <DataGridTextColumn Binding="Binding factorgroup" Header="گروه" Width="100" IsReadOnly="True" />
            <DataGridTextColumn Binding="Binding factortype" Header="نوع" Width="100" IsReadOnly="True" />
            <DataGridTextColumn Binding="Binding amount" Header="مبلغ" Width="80" IsReadOnly="True" />
            <DataGridTextColumn Binding="Binding discount" Header="تخفیف" Width="80" IsReadOnly="True" />
            <DataGridTextColumn Binding="Binding extra" Header="جریمه" Width="80" IsReadOnly="True" />
            <DataGridTextColumn Binding="Binding created_at, ConverterCulture=fa-IR, StringFormat=yyyy/MM/dd" Header="تاریخ ایجاد" Width="150" IsReadOnly="True" />
            <DataGridTextColumn Binding="Binding parent_id" Header="شماره صورتحساب اصلی" Width="150" IsReadOnly="True" />
            <DataGridTextColumn Binding="Binding status"  Header="وضعیت" Width="150" IsReadOnly="True" />

        </DataGrid.Columns>
        <DataGrid.ContextMenu>
            <ContextMenu>
                <MenuItem Header="پرداخت شده" Click="BtnSetPaid">
                    <MenuItem.Icon>
                        <Image Width="12" Height="12" Source="img/yes.png"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="پرداخت صورتحساب" Click="BtnAddNewpay_Click">
                    <MenuItem.Icon>
                        <Image Width="12" Height="12" Source="img/9999.png"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="حذف" Click="BtnFactorDell">
                    <MenuItem.Icon>
                        <Image Width="12" Height="12" Source="img/delete.png"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="قسط بندی" Click="BtnFactorSplit">
                    <MenuItem.Icon>
                        <Image Width="12" Height="12" Source="img/ab-report.png"/>
                    </MenuItem.Icon>
                </MenuItem>
                <MenuItem Header="ویرایش" Click="BtnFactorEdit">
                    <MenuItem.Icon>
                        <Image Width="12" Height="12" Source="img/Edit.png"/>
                    </MenuItem.Icon>
                </MenuItem>
            </ContextMenu>
        </DataGrid.ContextMenu>
    </DataGrid>

还有我的cs代码：

MySqlCommand cmd3 = new MySqlCommand("SELECT query ", conn);
                        MySqlDataAdapter adp2 = new MySqlDataAdapter(cmd3);
                        DataSet ds2 = new DataSet();
                        adp2.Fill(ds2, "LoadDataBinding");
                        FactorGrid.DataContext = ds2;

有什么方法可以做我想做的事吗？对不起我的英语不好。

【参考方案1】：

查看 DataTriggers。它们可以帮助你绑定一个值，并根据不同的值做不同的事情。您通常会在 和 之间添加它。更改颜色 RGB 以适合。

<DataGrid.RowStyle>
<Style TargetType="DataGridRow">
        <Style.Triggers>
                <DataTrigger Binding="Binding Status" Value="Paid">
                        <Setter Property="Background" Value="#447cff8b"></Setter>
                    </DataTrigger>
                    <DataTrigger Binding="Binding Status" Value="Unpaid">
                        <Setter Property="Background" Value="#444eafff"></Setter>
                    </DataTrigger>
             </Style.Triggers>
</Style>
</DataGrid.RowStyle>

【讨论】：

一个问题，是否可以为其他值选择颜色？我的意思是付费 = 绿色 未付费 = 黄色，如果文字是其他红色

是的，将 Value="#447cff8b" 更改为您想要的每种颜色。这些是 ARGB 值，所以前 2 位是 alpha（颜色透明度），接下来的 2 位是红色值，接下来是绿色，最后两位是蓝色。就像这个AA RR GG BB。如果您想要红色，则将 RR 设置为 FF，将 GG BB 设置为 00000，然后更改前 2 (AA) 以适应您想要的透明度，例如红色 = 80FF0000。绿色使用 8000FF00，蓝色 800000FF。将透明度更改为 80。较低的数字更透明，较高的数字不太透明。

如果您想要更多变体，请根据您想要的变体添加更多数据触发器。每个数据触发器的第一行都有一个值字段（例如 Value="Paid" 或 Value="Unpaid"）。如果您想要另一个不同的值，请为该值添加另一个数据触发器并根据需要指定背景值。

我了解它的工作方式，但我想制作像 Value = "paid" green 、 value = "unpaid" red 和其他值黄色的东西，不管它是什么，类似的东西。

【参考方案2】：

如果没有满足其他条件，在您进一步询问（在 cmets 中）关于 default 值的问题后，您只需再添加一行：

<Setter Property="Background" Value="#4400ffff"></Setter>

这超出了这样的样式触发器（第 3 行）：

<DataGrid.RowStyle>
<Style TargetType="DataGridRow">
    <Setter Property="Background" Value="#4400ffff"></Setter>
        <Style.Triggers>
                <DataTrigger Binding="Binding Status" Value="Paid">
                        <Setter Property="Background" Value="#447cff8b"></Setter>
                    </DataTrigger>
                    <DataTrigger Binding="Binding Status" Value="Unpaid">
                        <Setter Property="Background" Value="#444eafff"></Setter>
                    </DataTrigger>
        </Style.Triggers>
</Style>
</DataGrid.RowStyle> 

这样，如果其中一个触发器被击中，它将从触发器中获取颜色，否则将使用默认值（上面的第 3 行）。

【讨论】：

这对你有用吗？