Question

I have a multiple treeviews inside expanders, which can grow in height along with the content. But when the height gets larger than the window’s size, it goes outside the window.

The obvious solution would be to set the MaxHeight of the Treeview, but I can’t determine it easily, because the available height depends on

• Window height
• The other expanders (open/closed)

What do I need to change to make the treeview’s height still grow automaticly, but never larger than the window’s height?

<StackPanel CanVerticallyScroll="True" ClipToBounds="False" Height="Auto" Name="StackPanel2" Width="250" DockPanel.Dock="Left" Orientation="Vertical" VerticalAlignment="Top" CanHorizontallyScroll="False" Margin="5">
    <Border BorderThickness="0" CornerRadius="5" Padding="1" BorderBrush="Red" Margin="0,5" >
        <Expander Header="Expander3" Height="Auto" IsExpanded="False" Width="Auto" Margin="2" BorderThickness="1">
           <Grid  Height="Auto" Width="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" >

            <TreeView Height="Auto" BorderThickness="1" Margin="0,0,0,0" Padding="7" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" >
           </TreeView>

        </Grid>
    </Expander>
    </Border>
</StackPanel>

Answer 1

One way I can think of is to put the StackPanel in a ScrollViewer. This way make sure it never expands beyond the Height of the Window. You won’t get a separate Scroll for each of your expanders (if they are in the same StackPanel?) but I’m not 100% sure what you’re after here.

<ScrollViewer Name="stackPanelScrollViewer"
              Loaded="stackPanelScrollViewer_Loaded"
              VerticalScrollBarVisibility="Auto">
    <StackPanel CanVerticallyScroll="True" ClipToBounds="False" Height="Auto" Name="StackPanel2" Width="250" DockPanel.Dock="Left" Orientation="Vertical" VerticalAlignment="Top" CanHorizontallyScroll="False" Margin="5">
        <Border BorderThickness="0" CornerRadius="5" Padding="1" BorderBrush="Red" Margin="0,5" >
            <Expander Header="Expander3" Height="Auto" IsExpanded="False" Width="Auto" Margin="2" BorderThickness="1">
                <Grid  Height="Auto" Width="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" >
                    <TreeView Name="treeView1" Height="Auto" BorderThickness="1" Margin="0,0,0,0" Padding="7" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" >
                    </TreeView>
                </Grid>
            </Expander>
        </Border>
    </StackPanel>
</ScrollViewer>

A downside to this is that a TreeView has it’s own ScrollViewer defined within its ControlTemplate so you won’t be able to Scroll with the MouseWheel if the mouse is positioned over a TreeView. A workaround to this is to attach a MouseWheel event handler for each TreeView and make the Scroll from there

private void stackPanelScrollViewer_Loaded(object sender, RoutedEventArgs e)
{
    treeView1.AddHandler(MouseWheelEvent, new RoutedEventHandler(StackPanelMouseWheel), true);
    //treeView2.AddHandler(MouseWheelEvent, new RoutedEventHandler(StackPanelMouseWheel), true);
}
private void StackPanelMouseWheel(object sender, RoutedEventArgs e)
{
    MouseWheelEventArgs eargs = (MouseWheelEventArgs)e;
    double x = (double)eargs.Delta;
    double y = stackPanelScrollViewer.VerticalOffset;
    stackPanelScrollViewer.ScrollToVerticalOffset(y - x);
}