Search code examples
wpfmodern-ui

How to remove hover style for ListView rows?


I'm using Modern UI, and I have a ListView containing a Gridview. When I hover over or select a row, there is a background color applied to the row. How can I remove this style?

<ListView ... >
    <ListView.Resources>
        <SolidColorBrush x:Key="ItemBackgroundHover" Color="Transparent" />
        <Style TargetType="ListViewItem">
            <Style.Triggers>
                <Trigger Property="Validation.HasError" Value="True">
                    <Setter Property="Background" Value="Red" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </ListView.Resources>
    <ListView.View>
        <GridView>
            <GridViewColumn Header="Action">
                <GridViewColumn.CellTemplate>
                    <DataTemplate>
                    ...

enter image description here


Solution

  • In your ListView.Resources, override the ItemBackgroundHover brush resource:

    <SolidColorBrush x:Key="ItemBackgroundHover" Color="Transparent" />
    

    Do the same for ItemBackgroundSelected if you don't want the selected item to be highlighted.

    You may also need to override the foreground brushes if you support the Modern Light theme. You can see the brushes that get applied here.

    This won't work if you replace Modern UI's ListViewItem style with your own, but you could base yours off of theirs, and it should work:

    <Style TargetType="ListViewItem"
           BasedOn="{StaticResource {x:Type ListViewItem}}">
    

    Also, based on your screenshot, you probably don't need to be using a ListView, as you appaerntly don't care about selecting items. You could use a simple ItemsControl.


    To remove the button chrome, you can create a style like this:

    <Style x:Key="GlyphButton" TargetType="Button">
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="Button">
            <Border>
              <ContentPresenter x:Name="ContentSite" />
            </Border>
            <ControlTemplate.Triggers>
              <Trigger Property="IsPressed" Value="True">
                <Setter TargetName="ContentSite"
                        Property="Margin"
                        Value="1,1,-1,-1" />
              </Trigger>
            </ControlTemplate.Triggers>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>