Скрыть вертикальные линии между столбцами в заголовке WPF ListView

#wpf #listview

#wpf #listview

Вопрос:

Как я могу скрыть вертикальные линии между столбцами в заголовке WPF ListView?

Для иллюстрации: по умолчанию это выглядит как верхнее изображение; вместо этого я хочу, чтобы оно выглядело как нижнее изображение.


(источник: excastle.com)

Ответ №1:

К сожалению, вы не можете установить простое свойство, и вам придется изменить стиль GridViewColumnHeader. Если вы включите следующее в свои ресурсы приложения или окна, это выполнит то, что вы хотите для темы Aero:

 <LinearGradientBrush x:Key="GridViewColumnHeaderBorderBackground"
                        StartPoint="0,0"
                        EndPoint="0,1">
    <LinearGradientBrush.GradientStops>
        <GradientStop Color="#FFF2F2F2"
                        Offset="0" />
        <GradientStop Color="#FFD5D5D5"
                        Offset="1" />
    </LinearGradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="GridViewColumnHeaderBackground"
                        StartPoint="0,0"
                        EndPoint="0,1">
    <LinearGradientBrush.GradientStops>
        <GradientStop Color="#FFFFFFFF"
                        Offset="0" />
        <GradientStop Color="#FFFFFFFF"
                        Offset="0.4091" />
        <GradientStop Color="#FFF7F8F9"
                        Offset="1" />
    </LinearGradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="GridViewColumnHeaderHoverBackground"
                        StartPoint="0,0"
                        EndPoint="0,1">
    <LinearGradientBrush.GradientStops>
        <GradientStop Color="#FFBDEDFF"
                        Offset="0" />
        <GradientStop Color="#FFB7E7FB"
                        Offset="1" />
    </LinearGradientBrush.GradientStops>
</LinearGradientBrush>

<LinearGradientBrush x:Key="GridViewColumnHeaderPressBackground"
                        StartPoint="0,0"
                        EndPoint="0,1">
    <LinearGradientBrush.GradientStops>
        <GradientStop Color="#FF8DD6F7"
                        Offset="0" />
        <GradientStop Color="#FF8AD1F5"
                        Offset="1" />
    </LinearGradientBrush.GradientStops>
</LinearGradientBrush>

<Style x:Key="GridViewColumnHeaderGripper"
        TargetType="{x:Type Thumb}">
    <Setter Property="Canvas.Right"
            Value="-9" />
    <Setter Property="Width"
            Value="18" />
    <Setter Property="Height"
            Value="{Binding Path=ActualHeight,RelativeSource={RelativeSource TemplatedParent}}" />
    <Setter Property="Padding"
            Value="0" />
    <Setter Property="Background"
            Value="Transparent" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Thumb}">
                <Border Padding="{TemplateBinding Padding}"
                        Background="Transparent">
                    <Rectangle HorizontalAlignment="Center"
                                Width="1"
                                Fill="{TemplateBinding Background}" />
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Style x:Key="{x:Type GridViewColumnHeader}"
        TargetType="{x:Type GridViewColumnHeader}">
    <Setter Property="HorizontalContentAlignment"
            Value="Center" />
    <Setter Property="VerticalContentAlignment"
            Value="Center" />
    <Setter Property="Background"
            Value="{StaticResource GridViewColumnHeaderBackground}" />
    <Setter Property="BorderBrush"
            Value="{StaticResource GridViewColumnHeaderBorderBackground}" />
    <Setter Property="BorderThickness"
            Value="0" />
    <Setter Property="Padding"
            Value="2,0,2,0" />
    <Setter Property="Foreground"
            Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type GridViewColumnHeader}">
                <Grid SnapsToDevicePixels="true">
                    <Border Name="HeaderBorder"
                            BorderThickness="0,1,0,1"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            Background="{TemplateBinding Background}">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition MaxHeight="7" />
                                <RowDefinition />
                            </Grid.RowDefinitions>
                            <Rectangle Name="UpperHighlight"
                                        Visibility="Collapsed"
                                        Fill="#FFE3F7FF" />
                            <Border Grid.RowSpan="2"
                                    Padding="{TemplateBinding Padding}">
                                <ContentPresenter Name="HeaderContent"
                                                    Margin="0,0,0,1"
                                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                                    RecognizesAccessKey="True"
                                                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                            </Border>
                        </Grid>
                    </Border>
                    <Border Name="HeaderHoverBorder"
                            BorderThickness="1,0,1,1"
                            Margin="1,1,0,0" />
                    <Border Name="HeaderPressBorder"
                            BorderThickness="1,1,1,0"
                            Margin="1,0,0,1" />
                    <Canvas>
                        <Thumb x:Name="PART_HeaderGripper"
                                Style="{StaticResource GridViewColumnHeaderGripper}" />
                    </Canvas>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver"
                                Value="true">
                        <Setter TargetName="HeaderBorder"
                                Property="Background"
                                Value="{StaticResource GridViewColumnHeaderHoverBackground}" />
                        <Setter TargetName="HeaderHoverBorder"
                                Property="BorderBrush"
                                Value="#FF88CBEB" />
                        <Setter TargetName="UpperHighlight"
                                Property="Visibility"
                                Value="Visible" />
                        <Setter TargetName="PART_HeaderGripper"
                                Property="Background"
                                Value="Transparent" />
                    </Trigger>
                    <Trigger Property="IsPressed"
                                Value="true">
                        <Setter TargetName="HeaderBorder"
                                Property="Background"
                                Value="{StaticResource GridViewColumnHeaderPressBackground}" />
                        <Setter TargetName="HeaderHoverBorder"
                                Property="BorderBrush"
                                Value="#FF95DAF9" />
                        <Setter TargetName="HeaderPressBorder"
                                Property="BorderBrush"
                                Value="#FF7A9EB1" />
                        <Setter TargetName="UpperHighlight"
                                Property="Visibility"
                                Value="Visible" />
                        <Setter TargetName="UpperHighlight"
                                Property="Fill"
                                Value="#FFBCE4F9" />
                        <Setter TargetName="PART_HeaderGripper"
                                Property="Visibility"
                                Value="Hidden" />
                        <Setter TargetName="HeaderContent"
                                Property="Margin"
                                Value="1,1,0,0" />
                    </Trigger>
                    <Trigger Property="Height"
                                Value="Auto">
                        <Setter Property="MinHeight"
                                Value="20" />
                    </Trigger>
                    <Trigger Property="IsEnabled"
                                Value="false">
                        <Setter Property="Foreground"
                                Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="Role"
                    Value="Floating">
            <Setter Property="Opacity"
                    Value="0.4082" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type GridViewColumnHeader}">
                        <Canvas Name="PART_FloatingHeaderCanvas">
                            <Rectangle Opacity="0.4697"
                                        Fill="#FF000000"
                                        Width="{TemplateBinding ActualWidth}"
                                        Height="{TemplateBinding ActualHeight}" />
                        </Canvas>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Trigger>
        <Trigger Property="Role"
                    Value="Padding">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type GridViewColumnHeader}">
                        <Border Name="HeaderBorder"
                                BorderThickness="0,1,0,1"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                Background="{TemplateBinding Background}" />
                        <ControlTemplate.Triggers>
                            <Trigger Property="Height"
                                        Value="Auto">
                                <Setter Property="MinHeight"
                                        Value="20" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>
  

Стиль скопирован из системных стилей по умолчанию, предоставляемых Microsoft, с изменением одной строки (настройка свойства Background в стиле GridViewColumnHeaderGripper).

Комментарии:

1. Да, это работает как шарм. Заголовки отдельных столбцов по-прежнему выделяются при наведении на них курсора мыши, что является приятным эффектом — позволяет видеть края, чтобы можно было изменять размеры столбцов. Довольно гладко. Болезненно подробный, но изящный.

2. @Joe — Да, подобные вещи могут быть неприятными 🙂

3. По крайней мере, вы можете ими управлять!