如何删除 ListView GroupStyle Header 分隔线？

Question

在 windows 通用平台的 ListViews 中，当您使用 ListView 分组时，组 header 下方有一条难看的分隔线。甚至微软自己也在他们的应用程序中删除了这一行。在 Live Visual Tree 中，您可以看到它是 GridViewHeaderItem 中的一个矩形。我读到可以将其高度设置为 0。我该怎么做？

这是设置 header 项目文本的代码：

<ListView.GroupStyle>
  <GroupStyle HidesIfEmpty="True" >
     <GroupStyle.HeaderTemplate>
        <DataTemplate>
                  <TextBlock Text="{Binding Name}"/>
        </DataTemplate>
     </GroupStyle.HeaderTemplate>
   </GroupStyle>
</ListView.GroupStyle>

Answer 1

您可以在

找到 generic.xaml 中的所有默认样式

C:\Program Files (x86)\Windows Kits\DesignTime\CommonConfiguration\Neutral\UAP.0.10240.0\Generic

深入研究该文件，您还会发现 ListViewHeaderItem 的默认样式：

<!-- Default style for Windows.UI.Xaml.Controls.ListViewHeaderItem -->
<Style TargetType="ListViewHeaderItem">
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontSize" Value="{ThemeResource ListViewHeaderItemThemeFontSize}" />
    <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 ListViewHeaderItemMinHeight}"/>
    <Setter Property="UseSystemFocusVisuals" Value="True" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListViewHeaderItem">
                <StackPanel Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                    <ContentPresenter x:Name="ContentPresenter"
                                      Margin="{TemplateBinding Padding}"
                                      Content="{TemplateBinding Content}"
                                      ContentTemplate="{TemplateBinding ContentTemplate}"
                                      ContentTransitions="{TemplateBinding ContentTransitions}"
                                      HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    <Rectangle Stroke="{ThemeResource SystemControlForegroundBaseLowBrush}"
                               StrokeThickness="0.5"
                               Height="1"
                               VerticalAlignment="Bottom"
                               HorizontalAlignment="Stretch"
                               Margin="12,8,12,0"/>
                </StackPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

只需将该样式复制到项目的 ResourceDictionary 中，然后删除罪魁祸首 Rectangle（因此只有 ContentPresenter 保留为子元素）。

<Rectangle Stroke="{ThemeResource SystemControlForegroundBaseLowBrush}"
           StrokeThickness="0.5"
           Height="1"
           VerticalAlignment="Bottom"
           HorizontalAlignment="Stretch"
           Margin="12,8,12,0"/>

如何删除 ListView GroupStyle Header 分隔线？

How do I remove ListView GroupStyle Header seperator line?

xaml

listview

uwp