WPF TreeView in ScrollView: How to enable scrolling with mouse over TreeView

Question

I have two tree views in a grid. This grid is in a ScrollView. (The reason for this was to have both tree nodes of ob view always at the same relative depth).

My Issue is now, that the Scroll view does not scroll when my mouse hovers over the Tree and then using the mouse wheel. Whe I hover over the other inner view (ConnectionView), it works fine.

My View:

  <!-- Window -->
  <ScrollViewer VerticalScrollBarVisibility="Visible">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <TreeView Grid.Column="0" ItemsSource="{Binding Path=TreeNodesLeft}" >                  
                <TreeView.ItemTemplate>
                    <HierarchicalDataTemplate ItemsSource="{Binding ChildNodes}" >
                        <local:TreeNodeView />
                    </HierarchicalDataTemplate>
                </TreeView.ItemTemplate>
                <!--styles -->
            </TreeView>

            <Grid Grid.Column="1" >
                <local:ConnectionView DataContext="{Binding Path=Connections}" />
            </Grid>

            <TreeView Grid.Column="2" ItemsSource="{Binding Path=TreeNodesRight}">                    
                <TreeView.ItemTemplate>
                    <HierarchicalDataTemplate ItemsSource="{Binding ChildNodes}" >
                        <local:TreeNodeView />
                    </HierarchicalDataTemplate>
                </TreeView.ItemTemplate>      
                <!--styles -->                  
            </TreeView>
        </Grid>
    </ScrollViewer>
    <!-- Window -->

score 1 · Accepted Answer · answered Jan 22 '19 at 20:24

If i understand correct the problem is that the scroll is not working when the mouse is over the Treeview controls (TreeNodesLeft/TreeNodesLeft)? If that's the case it's because the treeview has it's own internal scrollviewer so when the mouse is over it that scrollviewr is working. You have to edit the template of the treeview to remove the scrollviewer.

Add the below on your treeview

 <TreeView.Template>
      <ControlTemplate>
          <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness=" 
           {TemplateBinding BorderThickness}" SnapsToDevicePixels="true">
              <ItemsPresenter/>
          </Border>
      </ControlTemplate>
 </TreeView.Template>

Or add it as a static resource and reuse it

<ControlTemplate x:Key="NoScrollViewerTemplate">
        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" SnapsToDevicePixels="true">
            <ItemsPresenter/>
        </Border>
    </ControlTemplate>


<TreeView Template="{StaticResource NoScrollViewerTemplate}" />

Jonatan Dragon · Answer 2 · 2019-01-22T20:26:57.723

0

You could follow one of these two options:

Do not use custom scrollViewer, but sync scroll positions between TreeViews via ScrollChanged event and ScrollToVerticalOffset method like in this question: Synchronized scrolling of two ScrollViewers whenever any one is scrolled in wpf You can get ScrollViewer from TreeView via GetChildOfType: How to get children of a WPF container by type?
Disable ScrollViewers for both TreeViews via ScrollViewer.VerticalScrollBarVisibility="Disabled" and add WheelScrolling like in here: ScrollViewer mouse wheel not working . Probably TreeView ScrollViewers are still handling your scroll events.

edited Jan 22 '19 at 20:26

answered Jan 22 '19 at 16:15

Jonatan Dragon

4,675
3
30
38

My situation is, that Both view do not contain the same amount of nodes. That means that one might scrol, and the other not. And in the view in the middle, there are "connection" lines, going from "left index to right index". – Malior Jan 22 '19 at 16:36
What do do you mean by "one might scroll, and the other not". Do you mean you actually need those 2 ScrollViewers inside TreeViews and you can not disable them? – Jonatan Dragon Jan 22 '19 at 20:26
Sorry I mean they have different amount of nodes. So if both would have their own scroll bar - one tree view could have a scroll the other not. – Malior Jan 22 '19 at 20:51

WPF TreeView in ScrollView: How to enable scrolling with mouse over TreeView

2 Answers2