XamDataGrid 字段值作为渐变背景

Question

我有 Infragistics XamDataGrid，其中有几列以百分比显示数据。

现在我希望这些列将值显示为百分比，将背景显示为 2 色渐变，其中第一种颜色将绑定到百分比值，第二种颜色将显示剩余值。

解决此问题的方法是模板化 cellvaluepresenter，通过它您可以在单元格上设置样式。

您可以使用 TargetType="{x:Type igDP:CellValuePresenter}" 创建样式。

但现在问题来了，我如何决定后端有哪些值，并根据值显示背景。

以下是代码。在此代码中，当我在 CellValuePresenterStyle 中使用 StaticResource 时。绑定工作正常，但未调用样式中的转换器。当我在 CellValuePresenterStyle 中使用 DynamicResource 时，绑定中断并且列中的值为空。

<igDP:XamDataPresenter x:Name="xamDataPresenter1" Height="300" DataSource="{Binding DV}"    >
        <igDP:XamDataPresenter.FieldLayoutSettings>
            <igDP:FieldLayoutSettings AutoGenerateFields="True" HeaderPrefixAreaDisplayMode="FieldChooserButton" 
                                      />
        </igDP:XamDataPresenter.FieldLayoutSettings>

        <igDP:XamDataPresenter.FieldLayouts>
            <igDP:FieldLayout>
                <igDP:FieldLayout.FieldSettings>
                    <igDP:FieldSettings CellClickAction="SelectCell" AllowEdit="False" />
                </igDP:FieldLayout.FieldSettings>
                <igDP:FieldLayout.Fields>
                    <!--<igDP:UnboundField Name="ProductID" Label="Product ID" />-->
                    <igDP:Field Name="LocationID" DisallowModificationViaClipboard="True" >
                        <igDP:Field.Settings>
                            <igDP:FieldSettings CellValuePresenterStyle="{DynamicResource myCustomFieldCell}"/>
                        </igDP:Field.Settings>
                    </igDP:Field>
                    <!--You can add more Field objects here-->
                </igDP:FieldLayout.Fields>
            </igDP:FieldLayout>
        </igDP:XamDataPresenter.FieldLayouts>           
    </igDP:XamDataPresenter>

样式代码

 <local:StringToDoubleConverter x:Key="stringToDoubleConverter" />


    <Style x:Key="myCustomFieldCell" TargetType="{x:Type igDP:CellValuePresenter}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type igDP:CellValuePresenter}">
                    <Grid>                                         
                        <Border Panel.ZIndex="0" Width="{Binding ElementName=textBlock,Path=Text,Converter={StaticResource stringToDoubleConverter}}" HorizontalAlignment="Left">
                            <Border.Background>
                                <LinearGradientBrush>
                                    <GradientStop Color="Red" Offset="0" />
                                    <GradientStop Color="Transparent" Offset="1" />
                                    <GradientStop Color="White" Offset=".99" />
                                </LinearGradientBrush>
                            </Border.Background>
                        </Border>
                          <TextBlock Panel.ZIndex="1"
                                Width="Auto"
                                Height="Auto"
                                Text="{TemplateBinding Content}"                                                                         
                                HorizontalAlignment="Center"
                                Margin="5,0,0,0"                                       
                                VerticalAlignment="Center"                                  
                                x:Name="textBlock" />
                    </Grid>                      
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

任何人都可以为此提供任何解决方法吗？

谢谢，

VJ

Answer 1

上面代码中的一切都是正确的，只需用下面的代码更改样式即可。

<Style x:Key="myCustomFieldCell" TargetType="{x:Type igDP:CellValuePresenter}">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type igDP:CellValuePresenter}">
                    <Grid>                            
                        <ContentPresenter Panel.ZIndex="1"                                  
                                Content="{TemplateBinding Content}"                                                                      
                                HorizontalAlignment="Center"
                                Margin="5,0,0,0"                                       
                                VerticalAlignment="Center"                                  
                                x:Name="contentPresenter" />
                        <Border Panel.ZIndex="0" Width="{Binding ElementName=contentPresenter, Path=Content, Converter={StaticResource stringToDoubleConverter}}" HorizontalAlignment="Left">
                            <Border.Background>
                                <LinearGradientBrush>
                                    <GradientStop Color="Red" Offset="0" />
                                    <GradientStop Color="Transparent" Offset="1" />
                                    <GradientStop Color="White" Offset=".99" />
                                </LinearGradientBrush>
                            </Border.Background>
                        </Border>
                    </Grid>                        
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Answer 2

我相信您可以创建两个转换器，它们将计算渐变开始/停止键的颜色，并通过数据绑定接受百分比值。