In WPF Stretch a control to fill a ListView Column

Question

How do I make a control fill the whole cell in a ListView (with a GridView)? I've played around with various properties, but the control is always it's minimum size.

Here's my xaml.

<Window x:Class="ListViewUserControlTest.Window1"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:local="clr-namespace:ListViewUserControlTest"
  Title="Window1" Height="300" Width="300">
    <Window.Resources>
        <DataTemplate x:Key="UserControlCell">
            <Rectangle Fill="Red" HorizontalAlignment="Stretch" MinWidth="10" MinHeight="10" />              
        </DataTemplate>
    </Window.Resources>
    <Grid>        
        <ListView Name="MyListView">
            <ListView.View>
                <GridView>
                    <GridViewColumn Width="30" Header="Col1" DisplayMemberBinding="{Binding Name}"  />
                    <GridViewColumn Width="200" Header="Col2" CellTemplate="{StaticResource UserControlCell}"  />
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>

Edit Sorry I changed the question because I had eliminated the user control as the source of the problem. It happens with any control.

Answer 1

Your user control specifies the values for the "Height" and "Width" properties. Nothing is allowed to override properties you have explicitly set. Remove "Height" and "Width" and the control's container will be able to mess with the size.

You might want to set a reasonable "MinHeight" and "MinWidth" to prevent containers from squishing you.

Different containers do different things to your control's size; for example, Grid expands you to fill the grid cell you're in, while StackPanel shrinks you to your minimum size. So you might need to deal with that too.

Answer 2

After narrowing down my question I was about to Google and find an answer here.

Basically for some reason the ListViewItems are set to align to the Left. Setting them to Stretch fixes this problem. This is done through a style like so:

<Style TargetType="ListViewItem">
    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>

This unfortunately affects every column, but then you can set the contents of other columns to left, right, center as explained in the link.