Ronald
Ronald

Reputation: 2100

Enable scroll for WPF Treeview

Can anybody help me out with how to enable a treeview to scroll? There must be a simple way but I can't make it work in my code. After multiple failed tries, I currently have something like this:

        <ScrollViewer CanContentScroll="True">
           <TreeView ...>
           </TreeView>
        </ScrollViewer>

I do see an 'disabled' scrollbar, but when the notes of the treeview are larger than the screen height, no scrolling is activated.

Upvotes: 31

Views: 39531

Answers (6)

How about just setting the height and width to a fixed amount? I know this might not be the answer for everyone.

Upvotes: -1

Rubarb
Rubarb

Reputation: 41

It's a simply a matter of giving the TreeView a fixed Height and Width. And maybe put it in a border. Also, i do have a MaxWidth on my items' content. For example the following is in my main window under two stack panels and it works (I'm using MahApps Metro controls):

<StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
        <Border BorderThickness="2" BorderBrush="DarkGoldenrod" Margin="4">
        <TreeView x:Name="TreeView" Width="400" Height="800" Focusable="True" VerticalAlignment="Top">
        </TreeView>            
    </Border>
</StackPanel>

Upvotes: 2

Dipesh Bagdi
Dipesh Bagdi

Reputation: 1

Instead of Tree View you can use Expander. Which can scoll With Scroll view properly this work same as Treeview.

Upvotes: 0

Kent Boogaart
Kent Boogaart

Reputation: 178680

The TreeView control itself includes a ScrollViewer in its template. You should be able to just use a TreeView inside an appropriate host (not a StackPanel!).

Upvotes: 49

drjeks
drjeks

Reputation: 101

The TreeView contains a ScrollViewer, but as @Carlo said, the TreeView or its container needs to have a height. Alternatively, the TreeView should be hosted in a container that doesn't give infinite height to its children (i.e. a StackPanel which I think was what @Kent was meaning). So place it inside a Grid, no need to give the Grid or the TreeView an explicit height and you should get the scrollbars.

Upvotes: 10

Carlo
Carlo

Reputation: 25959

Do you have a height explicitly set on your window? If you want to see the scrollbar something must define the height of the TreeView or its container, otherwise it won't know when it needs to show the scrollbar.

Example:

<Window x:Class="StackOverflowTests.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" x:Name="window1" Height="300" Width="300">
    <Grid>
        <TreeView  Name="treeView1" Height="150" VerticalAlignment="Top">
            <TreeViewItem Header="Root" IsExpanded="True">
                <TreeViewItem Header="Item 1"></TreeViewItem>
                <TreeViewItem Header="Item 2"></TreeViewItem>
                <TreeViewItem Header="Item 3"></TreeViewItem>
                <TreeViewItem Header="Item 4"></TreeViewItem>
                <TreeViewItem Header="Item 5"></TreeViewItem>
                <TreeViewItem Header="Item 6"></TreeViewItem>
                <TreeViewItem Header="Item 7"></TreeViewItem>
                <TreeViewItem Header="Item 8"></TreeViewItem>
                <TreeViewItem Header="Item 9"></TreeViewItem>
                <TreeViewItem Header="Item 10"></TreeViewItem>
                <TreeViewItem Header="Item 11"></TreeViewItem>
                <TreeViewItem Header="Item 12"></TreeViewItem>
                <TreeViewItem Header="Item 13"></TreeViewItem>
                <TreeViewItem Header="Item 14"></TreeViewItem>
                <TreeViewItem Header="Item 15"></TreeViewItem>
                <TreeViewItem Header="Item 16"></TreeViewItem>
                <TreeViewItem Header="Item 17"></TreeViewItem>
                <TreeViewItem Header="Item 18"></TreeViewItem>
                <TreeViewItem Header="Item 19"></TreeViewItem>
                <TreeViewItem Header="Item 20"></TreeViewItem>
                <TreeViewItem Header="Item 21"></TreeViewItem>
                <TreeViewItem Header="Item 22"></TreeViewItem>
                <TreeViewItem Header="Item 23"></TreeViewItem>
                <TreeViewItem Header="Item 24"></TreeViewItem>
                <TreeViewItem Header="Item 24"></TreeViewItem>
            </TreeViewItem>
        </TreeView>
    </Grid>
</Window>

Upvotes: 4

Related Questions