Autoresize ListBox inside ScrollViewer

Question

In my application I have a Window. It contains a left side menu, a header and a place for content.

This content is being loaded dynamically - a UserControl is put in there. These UserControls are various. From just a TextBlock to quite complex pages. To make sure all the content will be visible I have to wrap it with a ScrollViewer (I mean in MyWindow.xaml). It all works fine until I need to put a ListView in the content.

More or less the code looks like that:

<ScrollViewer> // this is the wrapping viewer actually it's in a different file
    <UserControl>
        ......
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="10*"/>
                <ColumnDefinition Width="20*"/>
            </Grid.ColumnDefinitions>
            <ListView  ItemsSource="{Binding Entities}">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <StackPanel>
                            <TextBlock Style="{StaticResource Value}" Text="{Binding WorkOrderNumber}"/>
                            <TextBlock Style="{StaticResource Value}" Text="{Binding ActionType}"/>
                            <TextBlock Style="{StaticResource Value}" Text="{Binding StartDate}"/>
                            <TextBlock Style="{StaticResource Value}" Text="{Binding StopDate}"/>
                            <Separator/>
                        </StackPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
            <Whatever.. Grid.Row="0" Grid.Column="1"/>
            <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Right">
                <Button Style="{StaticResource CustomButton}" Content="Previous" />
                <Button Style="{StaticResource CustomButton}" Content="Current" />
                <Button Style="{StaticResource CustomButton}" Content="Next" />
            </StackPanel>
        </Grid>
    </UserControl>
</ScrollViewer>

The result is that the listbox has no scrollbar and gets vary high. The scrollbar is only at the window's scrollviewer.

So in my UserControl I want:

the buttons always to be at the very bottom
the listbox to fill the whole space left (also to resize along with the window)
avoid hardcoding listbox's height

Is that possible?

score 0 · Answer 1 · answered Dec 28 '12 at 05:08

Use a DockPanel instead of a Grid. DockPanel has a property called LastChhildFill. It is by default true. If you set your ListBox to be the last Child, it will fill all the space:

<ScrollViewer>
    <DockPanel>
        <StackPanel DockPanel.Dock="Bottom"
                    Orientation="Horizontal"
                    HorizontalAlignment="Center">
            <Button Style="{StaticResource CustomButton}"
                    Content="Previous" />
            <Button Style="{StaticResource CustomButton}"
                    Content="Current" />
            <Button Style="{StaticResource CustomButton}"
                    Content="Next" />
        </StackPanel>
        <ListView >
        </ListView>
    </DockPanel>
</ScrollViewer>

But this setting makes the Buttons to disappear. I mean they are always at the Bottom of the ListBox. So maybe you need to remove the ScrollViewer.

Autoresize ListBox inside ScrollViewer

1 Answers1