设置Stretch后XAML GridViewItem内Grid未填充父容器求助

搞定这个问题其实核心在于GridViewItem默认的内容对齐方式不是Stretch，哪怕你给内部Grid设了Stretch，也会被Item的默认设置限制住。下面是具体的解决步骤：

1. 修改GridViewItem的内容对齐属性 #

首先要在GridView.ItemContainerStyle里把HorizontalContentAlignment和VerticalContentAlignment都设为Stretch，这样内部的Grid才能填满整个Item容器。同时你可以在这里统一设置磁贴的间距（比如Margin）：

<GridView>
    <!-- 设置Item容器样式 -->
    <GridView.ItemContainerStyle>
        <Style TargetType="GridViewItem">
            <!-- 让内容填满Item的水平/垂直空间 -->
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
            <!-- 设置磁贴之间的间距 -->
            <Setter Property="Margin" Value="6"/>
            <!-- 可选：设置悬停时的边框效果，和你看到的边界范围对应 -->
            <Setter Property="BorderBrush" Value="Gray"/>
            <Setter Property="BorderThickness" Value="1"/>
        </Style>
    </GridView.ItemContainerStyle>

    <!-- 你的磁贴内容示例 -->
    <GridView.ItemTemplate>
        <DataTemplate>
            <!-- 现在这个Grid会完全填满GridViewItem -->
            <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="#FFE0E0E0">
                <TextBlock Text="磁贴内容" VerticalAlignment="Center" HorizontalAlignment="Center"/>
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

2. 移除默认模板的内边距（如果需要完全贴合） #

如果设置了上面的属性后，Grid和Item边界还是有间隙，那是因为GridViewItem的默认ControlTemplate带有Padding。你可以自定义模板去掉这个内边距：

<GridView.ItemContainerStyle>
    <Style TargetType="GridViewItem">
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="Margin" Value="6"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="GridViewItem">
                    <Border x:Name="OuterContainer"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Padding="0"> <!-- 去掉默认的内边距 -->
                        <ContentPresenter x:Name="ContentPresenter"
                                          Content="{TemplateBinding Content}"
                                          ContentTemplate="{TemplateBinding ContentTemplate}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </Border>
                    <!-- 保留视觉状态（比如悬停、选中效果），可以根据需要调整 -->
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsPointerOver" Value="True">
                            <Setter TargetName="OuterContainer" Property="BorderBrush" Value="#FF707070"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</GridView.ItemContainerStyle>

关键原因说明 #

GridViewItem的默认HorizontalContentAlignment和VerticalContentAlignment是Center，这就导致内部的Grid即使设了Stretch，也只能在Item的中心区域拉伸，无法填满整个Item容器。把这两个属性改成Stretch后，内容就能完全填充Item的可用空间了。

内容的提问来源于stack exchange，提问作者James Hogle