Question

我正在使用UWP应用程序并且无法将标题与分组GridView中的项目对齐，这里是我的意思的图片：

这是一个简单的GridView，没有应用任何花哨的样式或者其他什么，我认为这应该是开箱即用的，但它没有。

使用VS 2015中的实时可视树，我发现这是ContentPresenter上的12px左边距和GridView头内的Rectangle：

StackPanel位于标题内部，它包含来自我的标题模板的网格（参见下面的XAML），包含在ContentPresenter（具有12px边距）和Rectangle（也具有该边距）之下;这似乎是小组冠军以下的统治者。

然而，我还没有想到如何改变这个边际的最模糊的想法。我尝试在GridView的GroupStyle中设置标题模板

 <GridView Grid.Row="1"
        ItemsSource="{Binding Source={StaticResource exercisesCollection}}"
        ItemTemplate="{StaticResource gridViewTemplate}"
        SelectionMode="None"
        CanDragItems="True">
    <GridView.GroupStyle>
       <GroupStyle HidesIfEmpty="True">
          <GroupStyle.HeaderTemplate>
             <DataTemplate>
                <Grid>
                   <TextBlock Text="{Binding Path=Name}" />
                </Grid>
             </DataTemplate>
          </GroupStyle.HeaderTemplate>
       </GroupStyle>
    </GridView.GroupStyle>
 </GridView>

但无济于事。有没有办法解决这个问题？

Answer 1

<GridView Grid.Row="1"
        ItemsSource="{Binding Source={StaticResource exercisesCollection}}"
        ItemTemplate="{StaticResource gridViewTemplate}"
        SelectionMode="None"
        CanDragItems="True">
    <GridView.GroupStyle>
       <GroupStyle HidesIfEmpty="True">
          <GroupStyle.HeaderTemplate>
             <DataTemplate>
                <Grid>
                   <TextBlock Text="{Binding Path=Name}" Margin="-12, 0, 0,0"/>
                </Grid>
             </DataTemplate>
          </GroupStyle.HeaderTemplate>
       </GroupStyle>
    </GridView.GroupStyle>
 </GridView>

并添加GridView标题项样式：

<Style x:Key="GridViewHeaderItemStyle1" TargetType="GridViewHeaderItem">
            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
            <Setter Property="FontSize" Value="{ThemeResource GridViewHeaderItemThemeFontSize}"/>
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Margin" Value="0,0,0,4"/>
            <Setter Property="Padding" Value="12,8,12,0"/>
            <Setter Property="HorizontalContentAlignment" Value="Left"/>
            <Setter Property="VerticalContentAlignment" Value="Top"/>
            <Setter Property="MinHeight" Value="{ThemeResource GridViewHeaderItemMinHeight}"/>
            <Setter Property="UseSystemFocusVisuals" Value="True"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="GridViewHeaderItem">
                        <StackPanel BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
                            <ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            <Rectangle HorizontalAlignment="Stretch" Height="1" Margin="0,8,12,0" Stroke="{ThemeResource SystemControlForegroundBaseLowBrush}" StrokeThickness="0.5" VerticalAlignment="Bottom"/>
                        </StackPanel>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

在gridview中编辑组样式并添加：

HeaderContainerStyle="{StaticResource GridViewHeaderItemStyle1}"

看起来像是：

<GroupStyle HeaderContainerStyle="{StaticResource GridViewHeaderItemStyle1}">

对齐分组GridView中的标题和项目

1 个答案: