CODEWITHSUNDEEP
listviewwin-universal-appuwp-xaml
PandaSharp
PandaSharp

Reputation: 642

Adapt itemtemplate columns width to headertemplate columns in a listview

I have a listview, I want that the width of ItemTemplate columns will be the same of HeaderTemplate columns. I tried many approaches found on the web but nobody seems to work, can you help me? Thanks! here it is my code:

<ListView x:Name="ProductListView" Header="Products List" ItemsSource="{x:Bind ViewModel.Products}">

<ListView.HeaderTemplate>
    <DataTemplate>
        <Grid>

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>

            <TextBlock x:Name="NameTextBlock" Style="{ThemeResource BodyTextBlockStyle}" Text="Name" Grid.Column="0"/>
            <TextBlock x:Name="PriceTextBlock" Style="{ThemeResource BodyTextBlockStyle}" Text="Price" Grid.Column="1"/>

        </Grid>
    </DataTemplate>
</ListView.HeaderTemplate>

<ListView.ItemTemplate>
    <DataTemplate x:DataType="m:SellingProduct">
        <Grid>

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="Auto" />                    
            </Grid.ColumnDefinitions>

            <TextBlock Style="{ThemeResource BodyTextBlockStyle}" Text="{x:Bind Name, Mode=OneWay}" Grid.Column="0"/>
            <TextBlock Style="{ThemeResource BodyTextBlockStyle}" Text="{x:Bind Price, Mode=OneWay}" Grid.Column="1"/>

        </Grid> 
    </DataTemplate>
</ListView.ItemTemplate>

Upvotes: 0

Views: 283

Answers (1)

Archana
Archana

Reputation: 3221

You have specify width="*" in both column definitions instead of auto and HorizontalContentAlignment value of Stretch should be Stretch

<ListView Margin="80,109,0,-109" ItemsSource="{Binding ListTest}"  x:Name="listview">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                </Style>

            </ListView.ItemContainerStyle>
            <ListView.HeaderTemplate>
                <DataTemplate>
                    <Grid>

                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" x:Name="namecolumn"/>
                            <ColumnDefinition Width="*" x:Name="pricecolumn" />
                        </Grid.ColumnDefinitions>

                        <TextBlock x:Name="NameTextBlock" Style="{ThemeResource BodyTextBlockStyle}" Text="Name" Grid.Column="0"/>
                        <TextBlock x:Name="PriceTextBlock" Style="{ThemeResource BodyTextBlockStyle}" Text="Price" Grid.Column="1"/>

                    </Grid>
                </DataTemplate>
            </ListView.HeaderTemplate>

            <ListView.ItemTemplate>
                <DataTemplate >
                    <Grid HorizontalAlignment="Stretch">

                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <TextBlock   Text="{Binding Number}" Grid.Column="0"/>
                        <TextBlock  Text="{Binding Name}" Grid.Column="1"/>

                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

Upvotes: 1

Related Questions