Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Making a grid in a ListView ItemTemplate fill

I have a ListView which has a data template based on a grid. The xaml is as follows:

<ListView ItemsSource="{Binding SomeItemSource}" HorizontalAlignment="Stretch" Height="281">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Grid HorizontalAlignment="Stretch" Margin="3" Width="Auto"> 
                <Grid.RowDefinitions>
                    <RowDefinition></RowDefinition>
                    <RowDefinition></RowDefinition>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="70"></ColumnDefinition>
                    <ColumnDefinition Width="*"></ColumnDefinition>
                </Grid.ColumnDefinitions>
                <!-- Grid content here -->
                <TextBlock Text="SomeTextbox" 
                           Margin="5,5,0,0"/>

                <TextBox Grid.Column="1" 
                         Margin="0,5,0,0"
                         Text="{Binding SomeProperty, Mode=TwoWay}"
                         HorizontalAlignment="Left"
                         Width="90"/>

                <TextBlock Text="AnotherText" 
                           Grid.Column="0" 
                           Grid.Row="1"
                           Margin="5,5,0,0"/>

                <TextBox Grid.Column="1" Grid.Row="1"
                         Margin="0,5,0,0"
                         Text="{Binding AnotherProperty, Mode=TwoWay}" 
                         HorizontalAlignment="Stretch"
                         Width="300"/>
            </Grid>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

What I want, is for the grid to fill (stretch over) the entire horizontal width of the parent ListView, however it currently wraps to the width of the sum of its contents. How can I achieve the behavior I want?

like image 615
havardhu Avatar asked May 30 '13 09:05

havardhu


1 Answers

You need to set ListViewItem.HorizontalContentAlignment to Stretch. Try adding this into your ListView definition:

<ListView.ItemContainerStyle>
    <Style TargetType="{x:Type ListViewItem}">
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    </Style>
</ListView.ItemContainerStyle>
like image 115
dkozl Avatar answered Sep 20 '22 15:09

dkozl