Syncfusion SfDataGrid 根据值更改单元格的前景

Question

我正在尝试使用转换器根据 ItemsSource 中对象的 DateTime 值更改单元格的前景。

我遇到的问题是，运行应用程序时出现“GridCell”TargetType 与元素“GridCell”类型不匹配的异常。

该异常似乎没有任何意义，因为 GridCell TargetType 与 GridCell 元素完全相同。如果有人能指出我做错了什么，我将不胜感激。代码如下。

用于生成 ItemsSource 的模型（后面的代码创建一个列表。这一切都很好）

public class RelationalTable 
{
    public int ClaimNumber { get; set; }
    public DateTime PlanPosted { get; set; }
    public DateTime PlanDue { get; set; }
    public int PlanVersion { get; set; }
    public string Department { get; set; }
}

SfDataGrid 标记：

<UserControl.Resources>
<!-- converter is defined in the UserControl header xmlns:converter=<assembly holding the converter code> -->
    <converter:StyleConverterByDate x:Key="ConverterResult" />
</UserControl.Resources>

        <sf:SfDataGrid x:Name="SfGrid" ItemsSource="{Binding ClaimList}" AutoGenerateColumns="False"
                       IsReadOnly="True" AllowSorting="True" AllowFiltering="True"
                       FontFamily="{StaticResource AppFont}"
                       AllowEditing="False" AllowTriStateSorting="True" ColumnSizer="AutoWithLastColumnFill"
                       RowHeight="32">

            <i:Interaction.Behaviors>
                <loc:SfDataGridBehavior />
            </i:Interaction.Behaviors>
            <sf:SfDataGrid.Columns>
                <sf:GridTextColumn HeaderText="Claim Number"
                                   HorizontalHeaderContentAlignment="Left"
                                   MappingName="ClaimNumber">
                </sf:GridTextColumn>
                <sf:GridDateTimeColumn CustomPattern="MM/dd/yyyy"
                                       HorizontalHeaderContentAlignment="Left"
                                       HeaderText="Date Posted"
                                       MappingName="PlanPosted"
                                       Pattern="CustomPattern" />
                <sf:GridDateTimeColumn CustomPattern="MM/dd/yyyy"
                                       HorizontalHeaderContentAlignment="Left"
                                       HeaderText="Date Due"
                                       MappingName="PlanDue"
                                       Pattern="CustomPattern">


                    <sf:GridDateTimeColumn.CellStyle>
                        <Style TargetType="sf:GridCell">
                            <Setter Property="Foreground" Value="{Binding PlanDue, Converter={StaticResource ConverterResult}}" />
                        </Style>
                    </sf:GridDateTimeColumn.CellStyle>



                </sf:GridDateTimeColumn>
                    
                <sf:GridTextColumn HeaderText="Department"
                                   HorizontalHeaderContentAlignment="Left"
                                   MappingName="Department" />

            </sf:SfDataGrid.Columns>
        </sf:SfDataGrid>

最后是转换器

public class StyleConverterByDate : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        DateTime _value = (DateTime)value;
        DateTime _today = DateTime.Today;

        if (_value.Date >= _today.Date)
            return new SolidColorBrush(Colors.Red);
  
        if (_value.Date > _today.Date.AddDays(-10) && _value.Date < _today.Date)
            return new SolidColorBrush(Colors.Yellow);

        return new SolidColorBrush(Colors.Black);
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return new SolidColorBrush(Colors.Black);
    }
}

Answer 1

我找到了解决方案。我用 CellTemplate 替换了 CellStyle，并在 DataTemplate 中使用 TextBlock 来显示单元格数据。

<sf:GridDateTimeColumn.CellTemplate>
    <DataTemplate>
        <TextBlock Text="{Binding PlanDue, StringFormat=MM/dd/yyyy}"
                   Foreground="{Binding PlanDue, Converter={StaticResource StyleConverter}}"
                   VerticalAlignment="Center"
                   FontFamily="{StaticResource AppFont}"
                   FontWeight="DemiBold"/>
    </DataTemplate>
</sf:GridDateTimeColumn.CellTemplate>

GridDateTimeColumn 中日期的前景色现在会根据转换器中满足的条件在运行时更改。

希望这对其他人有帮助，因为我在这个问题上被难住了一段时间。

Answer 2

我怀疑您报告的异常发生是因为与 Syncfusion.SfGrid.WPF 和 Syncfusion.Grid.WPF DLL 中存在的“GridCell”类存在冲突。

此冲突会导致异常，当您在项目中引用 http://schemas.Syncfusion.com/wpf 时，在类型引用中找不到样式属性“Foreground”。

要解决此问题，您可以通过按以下方式指定程序集来显式声明“GridCell”的命名空间：

xmlns：sfdatagrid =“clr命名空间：Syncfusion.UI.Xaml.Grid;程序集= Syncfusion.SfGrid.WPF”

代码片段：

         xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation

         xmlns:x=http://schemas.microsoft.com/winfx/2006/xaml

         xmlns:mc=http://schemas.openxmlformats.org/markup-compatibility/2006

         xmlns:d=http://schemas.microsoft.com/expression/blend/2008

         xmlns:syncfusion=http://schemas.syncfusion.com/wpf

         xmlns:sfdatagrid="clr-namespace:Syncfusion.UI.Xaml.Grid;assembly=Syncfusion.SfGrid.WPF"

         xmlns:local="clr-namespace:SfDataGrid_Demo"

         mc:Ignorable="d"

         d:DesignHeight="450" d:DesignWidth="800">

<UserControl.DataContext>

    <local:ViewModel/>

</UserControl.DataContext>

<UserControl.Resources>

    <local:StyleConverterByDate x:Key="ConverterResult"/>

</UserControl.Resources>



<Grid x:Name="Root_Grid">

    <Grid.RowDefinitions>

        <RowDefinition Height="*"/>

        <RowDefinition Height="*"/>

   </Grid.RowDefinitions>

    <syncfusion:SfDataGrid x:Name="dataGrid" ItemsSource="{Binding Orders}" AllowSorting="True"  SelectionMode="Extended" AllowEditing="True" AllowTriStateSor

        <syncfusion:SfDataGrid.Columns>

            <syncfusion:GridDateTimeColumn CustomPattern="MM/dd/yyyy"

                                 HorizontalHeaderContentAlignment="Left"

                                 HeaderText="Date Due"

                                 MappingName="Date"

                                 Pattern="CustomPattern">

                <syncfusion:GridDateTimeColumn.CellStyle>

                    <Style TargetType="sfdatagrid:GridCell">

                        <Setter Property="Foreground" Value="{Binding Date, Converter={StaticResource ConverterResult}}" />

                    </Style>

                </syncfusion:GridDateTimeColumn.CellStyle>

            </syncfusion:GridDateTimeColumn>

        </syncfusion:SfDataGrid.Columns>

    </syncfusion:SfDataGrid>

</Grid>

有关不明确类型引用异常的更多信息，请参阅下面的知识库文档链接，

知识库链接：https://www.syncfusion.com/kb/5712/how-to-resolve-ambigously-type-reference-exception