添加链接
link之家
链接快照平台
  • 输入网页链接,自动生成快照
  • 标签化管理网页链接
【​1.35 DataGrid指定单元格设置文本颜色】WPF案例代码解析

【​1.35 DataGrid指定单元格设置文本颜色】WPF案例代码解析

项目需求

显示如下表格内容,当有 NG 项时判定结果和原因显示为红色

解决思路

我使用了 HandyControl 这个库,在它提供的 DataGrid 样式基础上做了修改

表头那个样式我直接隐藏原表头,然后用 Grid + TextBlock 堆砌,比较方便;

单元格边框我没有修改样式代码,直接再贴了一层 Border

<Grid Grid.RowSpan="2" Margin="6,0">
	<Grid.ColumnDefinitions>
		<ColumnDefinition Width="*"/>
		<ColumnDefinition Width="2*"/>
		<ColumnDefinition Width="*"/>
		<ColumnDefinition Width="2*"/>
		<ColumnDefinition Width="*"/>
		<ColumnDefinition Width="2*"/>
		<ColumnDefinition Width="*"/>
		<ColumnDefinition Width="2*"/>
		<ColumnDefinition Width="*"/>
		<ColumnDefinition Width="2*"/>
		<ColumnDefinition Width="*"/>
		<ColumnDefinition Width="2*"/>
		<ColumnDefinition Width="*"/>
		<ColumnDefinition Width="*"/>
	</Grid.ColumnDefinitions>
	<Border BorderBrush="LightGray" BorderThickness="0,0,1,0"/>
	<Border Grid.Column="1" BorderBrush="LightGray" BorderThickness="0,0,1,0"/>
	<Border Grid.Column="2" BorderBrush="LightGray" BorderThickness="0,0,1,0" Margin="0,23,0,0"/>
	<Border Grid.Column="3" BorderBrush="LightGray" BorderThickness="0,0,1,0"/>
	<Border Grid.Column="4" BorderBrush="LightGray" BorderThickness="0,0,1,0" Margin="0,23,0,0"/>
	<Border Grid.Column="5" BorderBrush="LightGray" BorderThickness="0,0,1,0"/>
	<Border Grid.Column="6" BorderBrush="LightGray" BorderThickness="0,0,1,0" Margin="0,23,0,0"/>
	<Border Grid.Column="7" BorderBrush="LightGray" BorderThickness="0,0,1,0"/>
	<Border Grid.Column="8" BorderBrush="LightGray" BorderThickness="0,0,1,0" Margin="0,23,0,0"/>
	<Border Grid.Column="9" BorderBrush="LightGray" BorderThickness="0,0,1,0"/>
	<Border Grid.Column="10" BorderBrush="LightGray" BorderThickness="0,0,1,0" Margin="0,23,0,0"/>
	<Border Grid.Column="11" BorderBrush="LightGray" BorderThickness="0,0,1,0"/>
	<Border Grid.Column="12" BorderBrush="LightGray" BorderThickness="0,0,1,0"/>
</Grid>

由于单元格内容设置了绑定,对其中的几列单独设置单元格样式以便于针对 NG 值设置文本颜色

<!-- 转接片检查 -->
<DataGridTextColumn Width="*" IsReadOnly="True" Binding="{Binding PanDing_pian}" Header="判定" CellStyle="{DynamicResource MyDataGridCellSytleNG_PanDing_pian}"/>
<DataGridTextColumn Width="2*" IsReadOnly="True" Binding="{Binding Ng_pian}" Header="不良原因" CellStyle="{DynamicResource MyDataGridCellSytleNG}"/>

资源样式

根据内容修改文本颜色,如此设计了 5 种样式,对应 5 种判定 NG 结果;

<Style x:Key="MyDataGridCellSytleNG_PanDing_pian" BasedOn="{StaticResource MyDataGridCellSytle}" TargetType="DataGridCell">
    <Style.Triggers>
        <DataTrigger Binding="{Binding PanDing_pian}" Value="NG">
            <Setter Property="Foreground" Value="{DynamicResource DangerBrush}"/>
        </DataTrigger>
    </Style.Triggers>
</Style>

不良原因则统一设计为一种,并新建一个转换器,将包含文本内容转换为 NG 即可

转换器内容

using System;
using System.Globalization;
using System.Windows.Data;
namespace Wpf_GRP_HJ.GRP_HJ.Converter
    /// ----------------------------------------------------------------
    /// Author      : CoderMan/CoderdMan1012
    /// Created Time: 2022/11/26 18:06:59
    /// Description :
    /// ----------------------------------------------------------------
    /// Version      Modified Time              Modified By                               Modified Content
    /// V1.0.0.0     2022/11/26 18:06:59    CoderMan/CoderdMan1012         首次编写         
    public class StringToNgConverter : IValueConverter
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
            return value == null ? "" : value.ToString() != "" ? "NG" : "";
        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
            return value;

资源样式

<ct:StringToNgConverter x:Key="StringToNg"/>
<Style x:Key="MyDataGridCellSytleNG" BasedOn="{StaticResource MyDataGridCellSytle}" TargetType="DataGridCell">
    <Style.Triggers>
        <DataTrigger Binding="{Binding Ng_pian, Converter={StaticResource StringToNg}}" Value="NG">
            <Setter Property="Foreground" Value="{DynamicResource DangerBrush}"/>
        </DataTrigger>
        <DataTrigger Binding="{Binding Ng_tj, Converter={StaticResource StringToNg}}" Value="NG">
            <Setter Property="Foreground" Value="{DynamicResource DangerBrush}"/>
        </DataTrigger>
        <DataTrigger Binding="{Binding Ng_wg, Converter={StaticResource StringToNg}}" Value="NG">
            <Setter Property="Foreground" Value="{DynamicResource DangerBrush}"/>
        </DataTrigger>
        <DataTrigger Binding="{Binding Ng_jc, Converter={StaticResource StringToNg}}" Value="NG">
            <Setter Property="Foreground" Value="{DynamicResource DangerBrush}"/>