从ListViewItem中移除高亮效果

52
ListView 中有ListviewItems,当鼠标悬停在它们上面或者它们被选中时,它们的外观不能改变。
我尝试使用这个样式来实现,并且有些程度上成功了:
<Style x:Key="ItemContainerStyle1" TargetType="ListViewItem">
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="Focusable" Value="False" />
        </Trigger>
    </Style.Triggers>
</Style>
但它引发了一个新问题。当背景设置为“透明”时,我现在能够看到鼠标悬停在列表视图项上时显示的这种悬浮/光泽效果,如下图所示。

enter image description here

我已经尝试用这种方法解决问题,但没有成功。
<Style TargetType="{x:Type ListViewItem}">
    <Style.Resources>
      <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#00000000"/>
      <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="#00000000"/>
    </Style.Resources>
</Style>

有人知道如何去除这个悬停效果吗?


2
如果有人只需要控件列表(而不是表格),可以使用ItemsControl。https://dev59.com/4nTYa4cB1Zd3GeqPzuDp#17853517 - Pavel
8个回答

143

我不知道这是否是唯一的解决方案,但我是按照以下方式实现的(通过设置ListViewItemTemplate属性):

<ListView.ItemContainerStyle>
    <Style TargetType="{x:Type ListViewItem}">
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListViewItem}">
                    <Border
                         BorderBrush="Transparent"
                         BorderThickness="0"
                         Background="{TemplateBinding Background}">
                        <GridViewRowPresenter HorizontalAlignment="Stretch" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Width="Auto" Margin="0" Content="{TemplateBinding Content}"/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ListView.ItemContainerStyle>

编辑:

或者像Grant Winney建议的那样(我自己没有测试过):

<ListView.ItemContainerStyle>
    <Style TargetType="{x:Type ListViewItem}">
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ListViewItem}">
                    <ContentPresenter />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ListView.ItemContainerStyle>

谢谢,这解决了我的问题 :) 我已经用了两天时间在这上面!我想知道你是否知道一本好书或一些好的网站来获取关于样式的知识? - RooKie-
8
我测试了 @GrantWinney 提供的解决方案,它运行良好。 - J3soon
7
最佳答案!第二个回答是最好的,第一个回答导致我的整个组件消失了。 - Abraão Caldas
@GrantWinney的解决方案是我一直在使用的。 - Avrohom
@GrantWinney的解决方案对我非常有效!它去除了MouseOver和Selected效果,这正是我所需要的(它可以用来模拟逐行动画文本)。第一个解决方案使我的ListView内容消失了。 - CodingNinja
显示剩余5条评论

6

对我来说,这个东西很好用,像这样:

<ListView.ItemContainerStyle>
  <Style TargetType="ListViewItem">
    <Style.Triggers>
      <Trigger Property="IsMouseOver" Value="True">
        <Setter Property="Background" Value="Transparent" />
        <Setter Property="BorderThickness" Value="0" />
      </Trigger>
    </Style.Triggers>
  </Style>
</ListView.ItemContainerStyle> 

6

这项工作:

<Style TargetType="{x:Type ListViewItem}">  
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type ListViewItem}">
            <Grid Background="{TemplateBinding Background}">
                <Border Name="Selection" Visibility="Collapsed" />
                <!-- This is used when GridView is put inside the ListView -->
                <GridViewRowPresenter Grid.RowSpan="2"
                                      Margin="{TemplateBinding Padding}"
                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                      SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>

            </Grid>
        </ControlTemplate>
    </Setter.Value>
</Setter>


2
这是在使用GridView时唯一可行的选项。谢谢! - Daniel

4

我有同样的问题,但是所有的答案都没有帮助到我。在网上搜索后,我找到了这个解决方案,它起作用了:

        <ListView.Resources>
            <Style TargetType="{x:Type ListViewItem}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ListViewItem}">
                            <GridViewRowPresenter />
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ListView.Resources>

4

虽然问题不同,但这个方法对我有用。

<Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="BorderBrush" Value="Transparent"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                        <Border Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
                                <ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" Margin="{TemplateBinding Padding}" />
                            </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

这个版本在我的情况下工作,有一个嵌套的列表视图。 - Felice Pollano
这个版本在我的情况下可以工作,其中包含了一个嵌套的列表视图。 - Felice Pollano

3
这个答案与Big Kev的答案类似,不过适用于需要使用GridViewRowPresenter而不是ContentPresenterGridView
我最喜欢Kev的答案,因为它移除了默认的悬停高亮,并仍然使用IsMouseOver触发器控制样式,而其他答案没有这样做。
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type ListViewItem}">
            <Border Name="Border" BorderBrush="{TemplateBinding BorderBrush}" 
                                  BorderThickness="{TemplateBinding BorderThickness}" 
                                  Background="{TemplateBinding Background}">
                <GridViewRowPresenter Content="{TemplateBinding Content}"
                                      Margin="{TemplateBinding Padding}" />
            </Border>
        </ControlTemplate>
    </Setter.Value>
</Setter>

0

你可以试试这个,它对我有效。

                        <Style TargetType="{x:Type ListBoxItem}">
                            <Setter Property="Background" Value="Transparent" />
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                                        <ContentPresenter HorizontalAlignment="Left" Margin="2,3,2,3" />
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </ListBox.ItemContainerStyle>

0
我刚刚在ControlTemplate Trigger中添加了这段代码:
<Trigger Property="IsMouseOver" Value="True">
     <Setter Property="Background" Value="Transparent"/>
     <Setter Property="Foreground" Value="{DynamicResource White_200}"/>
</Trigger>

这是ListViewItem模板样式的完整示例;
<ListView x:Name="ListViewMenu" ItemsSource="{Binding Path=SubItems}" 
                      Background="Transparent" Foreground="White" BorderThickness="0"
                      ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                      ScrollViewer.VerticalScrollBarVisibility="Disabled"
                      Height="210">
                <ListView.ItemContainerStyle>
                    <Style TargetType="ListViewItem">
                        <Setter Property="Background" Value="Transparent" />
                        <Setter Property="Foreground" Value="#808182" />
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="{x:Type ListViewItem}">
                                    <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
                                        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                    </Border>
                                    <ControlTemplate.Triggers>
                                        <Trigger Property="IsSelected" Value="true">
                                            <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
                                        </Trigger>
                                        <MultiTrigger>
                                            <MultiTrigger.Conditions>
                                                <Condition Property="IsSelected" Value="true"/>
                                                <Condition Property="Selector.IsSelectionActive" Value="false"/>
                                            </MultiTrigger.Conditions>
                                            <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightBrushKey}}"/>
                                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightTextBrushKey}}"/>
                                        </MultiTrigger>
                                        <Trigger Property="IsEnabled" Value="false">
                                            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                        </Trigger>
                                        <Trigger Property="IsMouseOver" Value="True">
                                            <Setter Property="Background" Value="Transparent"/>
                                            <Setter Property="Foreground" Value="{DynamicResource White_200}"/>
                                        </Trigger>
                                    </ControlTemplate.Triggers>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </ListView.ItemContainerStyle>
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Path=Name}" Padding="20 5" />
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接