Align GridView children to top of cell in UWP XAML

Question

I am using GridView to display a grid of variable-height items, except each cell is aligned to the middle of the row.

My markup is

<GridView ItemsSource="{x:Bind Bounties}" SelectionMode="None" HorizontalAlignment="Left"
          VerticalAlignment="Top" >
  <GridView.ItemTemplate>
    <DataTemplate x:DataType="local:Bounty">
      <Grid>
        <TextBlock Margin="12" MaxWidth="350" HorizontalAlignment="Left"
                   Text="{x:Bind ItemDefinition.DisplayProperties.Description}"
                   Style="{ThemeResource BodyTextBlockStyle}" TextWrapping="WrapWholeWords" />
      </Grid>
    </DataTemplate>
  </GridView.ItemTemplate>
</GridView>

How can I get each cell to align to the top left of its row?

Answer 1

The internal content of the GridViewItem is vertically centered, this is the default style, if you want to modify it, please try this:

<GridView ...>
    <GridView.ItemContainerStyle>
        <Style TargetType="GridViewItem">
            <Setter Property="VerticalContentAlignment" Value="Top" />
        </Style>
    </GridView.ItemContainerStyle>
    <GridView.ItemTemplate>
        ...
    </GridView.ItemTemplate>
</GridView>

In addition, if you want to make the elements in the GridView adaptive height (the default is the height of the first element or the preset height as the height of all items), you can try StaggeredPanel in Windows Community Toolkit.

Thanks.