Picl
Picl

Reputation: 149

XAML - Get ListView to use full height of grid cell

I created a Grid in XAML with 2 Columns and 3 Rows, where the last of each shall have double the size of the rest:

<Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="2*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="2*"/>
        </Grid.RowDefinitions>

Then I added a ScrollViewer containing a ListView to the grid, located in the biggest cell:

        <ScrollViewer Grid.Row="2" Grid.Column="1">
             <ListView x:Name="OutputListView" >
                    <ListView.ItemsPanel>
                        <ItemsPanelTemplate>
                            <VirtualizingStackPanel/>
                        </ItemsPanelTemplate>
                    </ListView.ItemsPanel>
                </ListView>
            </ScrollViewer>
</Grid>

The ListView displays the items correctly, but although it is located in the big cell, it only has the height of one of the small cells, therefore not filling out the whole cell (surprisingly, the width matches the cell size).

If I place a TextBox within the cell, it fills it out completely, so my grid seems to be alright.

Any idea, how I get the ListView to use the full height of the cell?

EDIT: taekahn's comment was the right hint. Here is my working version:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="2*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="2*"/>
    </Grid.RowDefinitions>
    <ListView x:Name="OutputListView" ScrollViewer.VerticalScrollMode="Enabled" ScrollViewer.VerticalScrollBarVisibility="Visible">
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
    </ListView>
</Grid>

Upvotes: 2

Views: 439

Answers (1)

Taekahn
Taekahn

Reputation: 1692

When running your code, the ScrollViewer and the ListView take up the entire cell on my machine. I did a side-by-side of the code as you posted it, and one with the backgrounds of the other cells colored for comparison.

results

Upvotes: 1

Related Questions