Scrolling in virtualized WPF TreeView is very unstable

Question

If virtualizing is enabled in TreeView with items having various sizes, multiple problems appear:

• Vertical scroll bar changes its size randomly and

Answer 1

i have taken same error in wpf application while loading window. Visual Studio 2017 After some researching find out something like this post and i have noticed it is interesting WindowStyle element.

In my case the error in XAML design window in wpf and windows attribute value was

WindowStyle ="none"

i have changed it's value to WindowStyle ="SingleBorderWindow" and this errors has disappeared

Answer 2

To make the link more prominent, I am posting it in an answer too. It looks like a bug is within the framework code and there are no workarounds found yet. I have reported the bug on Microsoft Connect:

Microsoft Connect: Scrolling in virtualized WPF TreeView is very unstable

There is also a maybe related bug which was posted in the comments by @sixlettervariables:

Microsoft Connect: WPF application freezes while scrolling the TreeView under specific conditions

If you can reproduce the bugs, please vote them up.

Answer 3

By default Virtualization Stack panel uses pixel rendering to render child elements and the Recycling mode will discard each elements inside the treeview container that is no longer needed in UI. This cause the scroll bar size to change automatically. The VirtualizationPanel Pixel rendering technique will leads to slow down the scrolling option also. By changing to VirtualizingPanel.ScrollUnit="Item" will solve your issues. Below xaml is working fine for me

<Window x:Class="VirtualTreeView.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="800" Width="400" Left="0" Top="0"
    DataContext="{Binding RelativeSource={RelativeSource Self}}">
<Grid>
    <TreeView x:Name="tvwItems"
              ItemsSource="{Binding Items}"
              VirtualizingPanel.IsVirtualizing="True"
              VirtualizingPanel.VirtualizationMode="Recycling"
              VirtualizingPanel.ScrollUnit="Item"
              >
        <TreeView.ItemTemplate>
            <DataTemplate>
                <Border Height="{Binding Height}"
                        Width="{Binding Height}"
                        BorderThickness="1"
                        Background="DarkGray"
                        BorderBrush="DarkBlue" />
            </DataTemplate>
        </TreeView.ItemTemplate>
    </TreeView>
</Grid>
</Window>