How to get rid of display corruption during horizontal scroll in WPF4 DataGrid with grouping?

I'm trying to create a datagrid with grouping and I'm getting display corruption (blank areas) during horizontal scrolling. The issue appears only when there is a GroupStyle.ContainerStyle defined. The datagrid should contain 200 rows or more to reproduce the problem.

UPDATE2: Related Microsoft Connect feedback.

UPDATE: Microsoft guy at social.msdn.com pointed out that adding grouping turns off datagrid virtualization. Possibly that's the root of the problem. I removed grouping from my sample and set VirtualizingStackPanel.IsVirtualizing to false and got exactly the same kind of corruption.

Cod开发者_如何学运维e to reproduce the problem:

<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>

After several horizontal scrolls to the right and back to the left blank areas appear on the left side. I tried it on WinXP and Win7.

The question is: how to get rid of that bug? Is there any workaround? Any suggestions?

Screenshot illustrating the problem:

---

We once faced the same issue (but not the same cause) i.e. the datagrid will have blank areas just before the first column of some of the rows. The way we solved (a hack) it at that time was by disabling the rowheader (don't know how it solved the problem but did figure out that the blank areas were actually rowheaders).

We disabled (correct word would be made it size-zero) the rowheader by setting the width to zero, something like the code below:

<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>

Let me know if it works in your case.

One more thing we noticed that if we either disable the virtualization or rowheaderstyle, it would solve our problem. We went for disabling the rowheader as we didn't need it.

---

This is a shot in the dark, but when scrolling is completed just call InvalidateVisual() on the control.

Also, since you say it's with approximately 200 rows, we've encountered similar responsiveness issues with high load. We were able to work around it by updating the UI from the background thread. You can read more on that here.

---

I think your template for groupstyle is causing some clipping, I tried loading up 1000 rows and it worked fine. One more catch here is try hosting the header inside a container, In the below sample I used a 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>

Let me know if this helps.

-Fahad