CODEWITHSUNDEEP
uwpuwp-xaml
AxD
AxD

Reputation: 3182

Why isn't a Grid or a StackPanel stretched to full width of container control?

I try to display some text in a GridView control.

Each DataTemplate is containing a Grid with some text content.

Each Grid is supposed to stretch to full width within the ItemControl, but it doesn't:

Screenshot


Why?

No matter what value I assign to Grid.HorizontalAlignment, it doesn't change anything.

Here's my source code:

<Page
  x:Class="BindingTest1.MainPage"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  xmlns:models="using:BindingTest1.Models"
  xmlns:me="using:BindingTest1"
  mc:Ignorable="d">
  <Page.Background>
    <ImageBrush ImageSource="Assets/engine-blades.jpg" Stretch="UniformToFill"/>
  </Page.Background>

  <Page.Resources>
    <Style x:Key="HeaderTextBlock" TargetType="TextBlock" BasedOn="{StaticResource TitleTextBlockStyle}">
      <Setter Property="Foreground" Value="Crimson" />
    </Style>
    <Style x:Key="SubHeaderTextBlock" TargetType="TextBlock" BasedOn="{StaticResource SubtitleTextBlockStyle}">
      <Setter Property="Foreground" Value="DarkOrange" />
    </Style>
  </Page.Resources>

  <StackPanel>
    <GridView ItemsSource="{x:Bind CdList}">
      <!--<GridView.ItemsPanel>
        <ItemsPanelTemplate>
          <me:MyDynamicSizePanel/>
        </ItemsPanelTemplate>
      </GridView.ItemsPanel>-->

      <GridView.ItemTemplate>
        <DataTemplate x:DataType="models:CD">

          <Grid BorderThickness="2" BorderBrush="SaddleBrown" HorizontalAlignment="Stretch">
            <Grid.RowDefinitions>
              <RowDefinition />
              <RowDefinition />
              <RowDefinition />
            </Grid.RowDefinitions>
            <TextBlock Grid.Row="0" Style="{StaticResource HeaderTextBlock}" Text="{x:Bind Artist}"></TextBlock>
            <TextBlock Grid.Row="1" Style="{StaticResource SubHeaderTextBlock}" Text="{x:Bind Name}"></TextBlock>
            <TextBlock Grid.Row="2" Style="{StaticResource SubHeaderTextBlock}">
              <Run>Test</Run>
              <LineBreak/>
              <Run>Test</Run>
            </TextBlock>
          </Grid>

        </DataTemplate>
      </GridView.ItemTemplate>
    </GridView>
  </StackPanel>
</Page>

Upvotes: 0

Views: 62

Answers (1)

Anran Zhang
Anran Zhang

Reputation: 7737

You can achieve your goal by configuring GridView.ItemContainerStyle:

<GridView ...>
    <GridView.ItemContainerStyle>
        <Style TargetType="GridViewItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <Setter Property="VerticalContentAlignment" Value="Stretch" />
        </Style>
    </GridView.ItemContainerStyle>
    
    <!-- other code -->
</GridView>

Upvotes: 2

Related Questions