如何通过分组消除 WPF4 DataGrid 中水平滚动期间的显示损坏？

Question

我正在尝试创建一个带有分组的数据网格，但在水平滚动期间出现显示损坏（空白区域）。 仅在定义了 GroupStyle.ContainerStyle 时才会出现此问题。数据网格应包含 200 行或更多行才能重现该问题。

更新2： 相关 Microsoft Connect 反馈。

更新： 微软人员 社交。 msdn.com 指出添加分组会关闭数据网格虚拟化。也许这就是问题的根源。我从示例中删除了分组，并将 VirtualizingStackPanel.IsVirtualizing 设置为 false，并得到了完全相同的损坏。

重现问题的代码：

<DataGrid ItemsSource="{Binding Source={StaticResource ResourceKey=cvsGoods}}"
          CanUserAddRows="False" CanUserReorderColumns="False"
          CanUserDeleteRows="False" CanUserResizeRows="False"
          CanUserSortColumns="False" AutoGenerateColumns="True">
    <DataGrid.GroupStyle>
        <GroupStyle>
            <GroupStyle.ContainerStyle>
                <Style TargetType="{x:Type GroupItem}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type GroupItem}">
                                <ItemsPresenter  />
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </GroupStyle.ContainerStyle>
        </GroupStyle>
    </DataGrid.GroupStyle>
</DataGrid>

向右和向左水平滚动几次后，左侧出现空白区域。我在WinXP和Win7上都试过了。

问题是：如何消除该错误？有什么解决方法吗？有什么建议吗？

说明问题的屏幕截图：

Answer 1

我们曾经遇到过同样的问题（但原因不同），即数据网格在某些行的第一列之前会有空白区域。当时我们解决（黑客）这个问题的方法是禁用行标题（不知道它是如何解决问题的，但确实发现空白区域实际上是行标题）。

我们通过将宽度设置为零来禁用（正确的单词将使其大小为零）行标题，类似于下面的代码：

<wpftk:DataGrid>
...
...
<wpftk:DataGrid.RowHeaderStyle>
    <Style  TargetType="wpftk:DataGridRowHeader" >
        <Setter Property="Width" Value="0" />
        <Setter Property="MaxWidth" Value="0" />
    </Style>
</wpftk:DataGrid.RowHeaderStyle>
...
...
</wpftk:DataGrid>

让我知道它是否适用于您的情况。

我们注意到的另一件事是，如果我们禁用虚拟化或 rowheaderstyle，它将解决我们的问题。我们尝试禁用行标题，因为我们不需要它。

Answer 2

这是在黑暗中拍摄的，但是当滚动完成时，只需在控件上调用 InvalidateVisual() 即可。

另外，由于您说它大约有 200 行，因此我们在高负载下遇到了类似的响应问题。我们可以通过从后台线程更新 UI 来解决这个问题。您可以在此处了解更多信息。

Answer 3

我认为你的 groupstyle 模板导致了一些裁剪，我尝试加载 1000 行，效果很好。这里还有一个问题是尝试将标头托管在容器内，在下面的示例中我使用了 TreeViewItem，

                <GroupStyle.ContainerStyle>
                    <Style TargetType="{x:Type GroupItem}">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="{x:Type GroupItem}">
                                    <TreeViewItem IsExpanded="True">
                                        <TreeViewItem.Header>
                                            <TextBlock Text="{Binding Name}" />
                                        </TreeViewItem.Header>
                                        <ItemsPresenter />
                                    </TreeViewItem>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </GroupStyle.ContainerStyle>

请告诉我这是否有帮助。

——法赫德