Search code examples
c#wpfxamldatatemplate

Suppress mouse hover effect on GridViewColumn


I have a GridViewColumn with a HeaderTemplate that has an Image and a TextBlock. When the user hovers over the Image I am changing its opacity, but I am still getting the default header mouse over effect. How can I suppress this effect when the user hovers over the image?


Solution

  • The IsMouseOver Trigger is located inside the GridViewColumnHeader template. It looks like this

    <Trigger Property="IsMouseOver" Value="true">
        <Setter Property="Background" TargetName="HeaderBorder" Value="{StaticResource GridViewColumnHeaderHoverBackground}"/>
        <Setter Property="BorderBrush" TargetName="HeaderHoverBorder" Value="#FF88CBEB"/>
        <Setter Property="Visibility" TargetName="UpperHighlight" Value="Visible"/>
        <Setter Property="Background" TargetName="PART_HeaderGripper" Value="Transparent"/>
    </Trigger>
    

    Update

    With a little code behind you can disable the IsMouseOver trigger in the Loaded event for GridViewColumnHeader. It's overriding the setters in the trigger by setting their values and this will work for the classic theme as well.

    <ListView ...>
        <ListView.Resources>
            <Style TargetType="{x:Type GridViewColumnHeader}">
                <EventSetter Event="Loaded" Handler="GridViewColumnHeader_Loaded"/>
            </Style>
        </ListView.Resources>
        <!--...-->
    </ListView>
    

    Code behind event handler

    private void GridViewColumnHeader_Loaded(object sender, RoutedEventArgs e)
    {
        GridViewColumnHeader columnHeader = sender as GridViewColumnHeader;
        Border HeaderBorder = columnHeader.Template.FindName("HeaderBorder", columnHeader) as Border;
        if (HeaderBorder != null)
        {
            HeaderBorder.Background = HeaderBorder.Background;
        }
        Border HeaderHoverBorder = columnHeader.Template.FindName("HeaderHoverBorder", columnHeader) as Border;
        if (HeaderHoverBorder != null)
        {
            HeaderHoverBorder.BorderBrush = HeaderHoverBorder.BorderBrush;
        }
        Rectangle UpperHighlight = columnHeader.Template.FindName("UpperHighlight", columnHeader) as Rectangle;
        if (UpperHighlight != null)
        {
            UpperHighlight.Visibility = UpperHighlight.Visibility;
        }
        Thumb PART_HeaderGripper = columnHeader.Template.FindName("PART_HeaderGripper", columnHeader) as Thumb;
        if (PART_HeaderGripper != null)
        {
            PART_HeaderGripper.Background = PART_HeaderGripper.Background;
        }
    }
    

    Aero solution, the default Style with the IsMouseOver Trigger removed

    <LinearGradientBrush x:Key="GridViewColumnHeaderBackground" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#FFFFFFFF" Offset="0"/>
        <GradientStop Color="#FFFFFFFF" Offset="0.4091"/>
        <GradientStop Color="#FFF7F8F9" Offset="1"/>
    </LinearGradientBrush>
    <LinearGradientBrush x:Key="GridViewColumnHeaderBorderBackground" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#FFF2F2F2" Offset="0"/>
        <GradientStop Color="#FFD5D5D5" Offset="1"/>
    </LinearGradientBrush>
    <LinearGradientBrush x:Key="GridViewColumnHeaderHoverBackground" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#FFBDEDFF" Offset="0"/>
        <GradientStop Color="#FFB7E7FB" Offset="1"/>
    </LinearGradientBrush>
    <LinearGradientBrush x:Key="GridViewColumnHeaderPressBackground" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#FF8DD6F7" Offset="0"/>
        <GradientStop Color="#FF8AD1F5" Offset="1"/>
    </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 ActualHeight, RelativeSource={RelativeSource TemplatedParent}}"/>
        <Setter Property="Padding" Value="0"/>
        <Setter Property="Background" Value="{StaticResource GridViewColumnHeaderBorderBackground}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Thumb}">
                    <Border Background="Transparent" Padding="{TemplateBinding Padding}">
                        <Rectangle Fill="{TemplateBinding Background}" HorizontalAlignment="Center" Width="1"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style TargetType="{x:Type GridViewColumnHeader}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type GridViewColumnHeader}">
                    <Grid SnapsToDevicePixels="true">
                        <Border x:Name="HeaderBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0,1,0,1" Background="{TemplateBinding Background}">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition MaxHeight="7"/>
                                    <RowDefinition/>
                                </Grid.RowDefinitions>
                                <Rectangle x:Name="UpperHighlight" Fill="#FFE3F7FF" Visibility="Collapsed"/>
                                <Border Padding="{TemplateBinding Padding}" Grid.RowSpan="2">
                                    <ContentPresenter x:Name="HeaderContent" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="0,0,0,1" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                </Border>
                            </Grid>
                        </Border>
                        <Border x:Name="HeaderHoverBorder" BorderThickness="1,0,1,1" Margin="1,1,0,0"/>
                        <Border x: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 Property="Background" TargetName="HeaderBorder" Value="{StaticResource GridViewColumnHeaderHoverBackground}"/>
                            <Setter Property="BorderBrush" TargetName="HeaderHoverBorder" Value="#FF88CBEB"/>
                            <Setter Property="Visibility" TargetName="UpperHighlight" Value="Visible"/>
                            <Setter Property="Background" TargetName="PART_HeaderGripper" Value="Transparent"/>
                        </Trigger>-->
                        <Trigger Property="IsPressed" Value="true">
                            <Setter Property="Background" TargetName="HeaderBorder" Value="{StaticResource GridViewColumnHeaderPressBackground}"/>
                            <Setter Property="BorderBrush" TargetName="HeaderHoverBorder" Value="#FF95DAF9"/>
                            <Setter Property="BorderBrush" TargetName="HeaderPressBorder" Value="#FF7A9EB1"/>
                            <Setter Property="Visibility" TargetName="UpperHighlight" Value="Visible"/>
                            <Setter Property="Fill" TargetName="UpperHighlight" Value="#FFBCE4F9"/>
                            <Setter Property="Visibility" TargetName="PART_HeaderGripper" Value="Hidden"/>
                            <Setter Property="Margin" TargetName="HeaderContent" 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 x:Name="PART_FloatingHeaderCanvas">
                                <Rectangle Fill="#FF000000" Height="{TemplateBinding ActualHeight}" Opacity="0.4697" Width="{TemplateBinding ActualWidth}"/>
                            </Canvas>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Trigger>
            <Trigger Property="Role" Value="Padding">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type GridViewColumnHeader}">
                            <Border x:Name="HeaderBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0,1,0,1" 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>