CODEWITHSUNDEEP
uwp-xaml
Jan Diederich
Jan Diederich

Reputation: 355

UWP XAML: Can't bring GridView item to stretch to full width

All explanations for this problem I've seen are't working in my case, most of them aren't even for UWP XAML.

How can I get the GridView Grid Items Container to stretch to the full width? (See my "Stretch this..." comment in the XAML.)

PS: Changing GridView to ListView doesn't change anything.

XAML:

<Grid>
    <GridView x:Name="barGrid" ItemsSource="{x:Bind projects}" Margin="10" HorizontalAlignment="Stretch" 
              HorizontalContentAlignment="Stretch" Background="Pink">
        <GridView.ItemTemplate>
            <DataTemplate x:Name="DoubleBars" x:DataType="local:Project">
                <!-- **Stretch this to the max container width!** -->
                <Grid HorizontalAlignment="Stretch" Background="Orange">
                    ...
                </Grid>
            </DataTemplate>
        </GridView.ItemTemplate>

        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsWrapGrid Orientation="Vertical" HorizontalAlignment="Left"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>

    </GridView>
</Grid>

Upvotes: 0

Views: 470

Answers (1)

Johnny Westlake
Johnny Westlake

Reputation: 1460

The secret sauce is in the style definition for ListViewItem

<ListView x:Name="barGrid" 
      ItemsSource="{x:Bind projects}"
      Margin="10" 
      HorizontalAlignment="Stretch"
      HorizontalContentAlignment="Stretch" 
      Background="Pink">
<ListView.Resources>
    <Style Target="ListViewItem">
        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
    </Style>
</ListView.Resources>
<ListView.ItemTemplate>
    <DataTemplate x:Name="DoubleBars" x:DataType="local:Project">
        <!-- **Stretch this to the max container width!** -->
        <Grid HorizontalAlignment="Stretch" Background="Orange">
            ...
        </Grid>
    </DataTemplate>
</ListView.ItemTemplate>

Upvotes: 3

Related Questions