如何在Windows UI库中使用ListViewItem样式中的显示悬停？

我试图为UWP应用程序中的控件自定义默认的ListViewItem样式，但我无法使显示悬停/单击效果生效

在添加自定义样式之前，显示效果很好（使用默认的ListView控件）。我在设计视图中右键单击ListView控件，然后选择编辑其他模板->编辑生成的项目容器（ItemContainerStyle）->编辑副本。。。此时，Style属性被设置为新生成的样式，但我还没有修改它，因此UI中应该没有任何更改。但“显示悬停/单击”效果现在已被破坏

我们的应用程序在其他地方使用Windows UI库（Microsoft.UI.Xaml），因此

已添加到application.Resources。如果删除此选项，则“显示悬停/单击”效果有效。因此，似乎是定义自定义样式和添加XamlControlsResources的组合打破了这种效果。我已经尝试将样式移动到App.xaml或单独的ResourceDictionary中，没有任何更改。我已经尝试删除样式的各个部分，以确定是什么导致它崩溃。如果我删除模板的Setter，它会工作，但这正是我要定制的

根据,，“需要注意的是，Reveal需要笔刷和设置器在其视觉状态下正常工作。仅仅将控件的画笔设置为我们的显示画笔资源之一并不能为该控件启用显示。相反，只有目标或设置而没有显示笔刷的值也不会启用显示。”因此，可能是ListViewItemPresenter.RevealBackground属性或VisualStateManager导致其中断，但我不确定如何或为什么

如何为我的ListView定义自定义样式而不丢失悬停效果（并且不删除XamlControlsResources，因为这是应用程序所必需的）

这里有一个简单的复制：

App.xaml

<Application
    x:Class="BrokenRevealEffect.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    RequestedTheme="Dark">
    <Application.Resources>
        <!--  Remove XamlControlsResources to see the Reveal hover/click effect.  -->
        <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
    </Application.Resources>
</Application>

<Page
    x:Class="BrokenRevealEffect.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    mc:Ignorable="d">
    <Page.Resources>
        <!--  This is the default style for the ListViewItem. It has not been modified.  -->
        <Style x:Key="abc" TargetType="ListViewItem">
            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
            <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
            <Setter Property="Background" Value="{ThemeResource ListViewItemBackground}" />
            <Setter Property="Foreground" Value="{ThemeResource ListViewItemForeground}" />
            <Setter Property="TabNavigation" Value="Local" />
            <Setter Property="IsHoldingEnabled" Value="True" />
            <Setter Property="Padding" Value="12,0,12,0" />
            <Setter Property="HorizontalContentAlignment" Value="Left" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}" />
            <Setter Property="MinHeight" Value="{ThemeResource ListViewItemMinHeight}" />
            <Setter Property="AllowDrop" Value="False" />
            <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
            <Setter Property="FocusVisualMargin" Value="0" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListViewItem">
                        <ListViewItemPresenter
                            x:Name="Root"
                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                            CheckBoxBrush="{ThemeResource ListViewItemCheckBoxBrush}"
                            CheckBrush="{ThemeResource ListViewItemCheckBrush}"
                            CheckMode="{ThemeResource ListViewItemCheckMode}"
                            ContentMargin="{TemplateBinding Padding}"
                            ContentTransitions="{TemplateBinding ContentTransitions}"
                            Control.IsTemplateFocusTarget="True"
                            DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
                            DragBackground="{ThemeResource ListViewItemDragBackground}"
                            DragForeground="{ThemeResource ListViewItemDragForeground}"
                            DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
                            FocusBorderBrush="{ThemeResource ListViewItemFocusBorderBrush}"
                            FocusSecondaryBorderBrush="{ThemeResource ListViewItemFocusSecondaryBorderBrush}"
                            FocusVisualMargin="{TemplateBinding FocusVisualMargin}"
                            PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackground}"
                            PointerOverBackground="{ThemeResource ListViewItemBackgroundPointerOver}"
                            PointerOverForeground="{ThemeResource ListViewItemForegroundPointerOver}"
                            PressedBackground="{ThemeResource ListViewItemBackgroundPressed}"
                            ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
                            RevealBackground="{ThemeResource ListViewItemRevealBackground}"
                            RevealBorderBrush="{ThemeResource ListViewItemRevealBorderBrush}"
                            RevealBorderThickness="{ThemeResource ListViewItemRevealBorderThemeThickness}"
                            SelectedBackground="{ThemeResource ListViewItemBackgroundSelected}"
                            SelectedForeground="{ThemeResource ListViewItemForegroundSelected}"
                            SelectedPointerOverBackground="{ThemeResource ListViewItemBackgroundSelectedPointerOver}"
                            SelectedPressedBackground="{ThemeResource ListViewItemBackgroundSelectedPressed}"
                            SelectionCheckMarkVisualEnabled="{ThemeResource ListViewItemSelectionCheckMarkVisualEnabled}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="Selected" />
                                    <VisualState x:Name="PointerOver">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="PointerOver" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPointerOver}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="PointerOverSelected">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="PointerOver" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPointerOver}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="PointerOverPressed">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="Pressed" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPressed}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="Pressed" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPressed}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="PressedSelected">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="Pressed" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPressed}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="DisabledStates">
                                    <VisualState x:Name="Enabled" />
                                    <VisualState x:Name="Disabled">
                                        <VisualState.Setters>
                                            <Setter Target="Root.RevealBorderThickness" Value="0" />
                                        </VisualState.Setters>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                        </ListViewItemPresenter>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Page.Resources>
    <Grid>
        <!--  Remove ItemContainerStyle to see the Reveal hover/click effect.  -->
        <ListView ItemContainerStyle="{StaticResource abc}" ItemsSource="{x:Bind Items}" />
    </Grid>
</Page>

MainPage.xaml

<Application
    x:Class="BrokenRevealEffect.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    RequestedTheme="Dark">
    <Application.Resources>
        <!--  Remove XamlControlsResources to see the Reveal hover/click effect.  -->
        <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
    </Application.Resources>
</Application>

<Page
    x:Class="BrokenRevealEffect.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
    mc:Ignorable="d">
    <Page.Resources>
        <!--  This is the default style for the ListViewItem. It has not been modified.  -->
        <Style x:Key="abc" TargetType="ListViewItem">
            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
            <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
            <Setter Property="Background" Value="{ThemeResource ListViewItemBackground}" />
            <Setter Property="Foreground" Value="{ThemeResource ListViewItemForeground}" />
            <Setter Property="TabNavigation" Value="Local" />
            <Setter Property="IsHoldingEnabled" Value="True" />
            <Setter Property="Padding" Value="12,0,12,0" />
            <Setter Property="HorizontalContentAlignment" Value="Left" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}" />
            <Setter Property="MinHeight" Value="{ThemeResource ListViewItemMinHeight}" />
            <Setter Property="AllowDrop" Value="False" />
            <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
            <Setter Property="FocusVisualMargin" Value="0" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListViewItem">
                        <ListViewItemPresenter
                            x:Name="Root"
                            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                            CheckBoxBrush="{ThemeResource ListViewItemCheckBoxBrush}"
                            CheckBrush="{ThemeResource ListViewItemCheckBrush}"
                            CheckMode="{ThemeResource ListViewItemCheckMode}"
                            ContentMargin="{TemplateBinding Padding}"
                            ContentTransitions="{TemplateBinding ContentTransitions}"
                            Control.IsTemplateFocusTarget="True"
                            DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
                            DragBackground="{ThemeResource ListViewItemDragBackground}"
                            DragForeground="{ThemeResource ListViewItemDragForeground}"
                            DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
                            FocusBorderBrush="{ThemeResource ListViewItemFocusBorderBrush}"
                            FocusSecondaryBorderBrush="{ThemeResource ListViewItemFocusSecondaryBorderBrush}"
                            FocusVisualMargin="{TemplateBinding FocusVisualMargin}"
                            PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackground}"
                            PointerOverBackground="{ThemeResource ListViewItemBackgroundPointerOver}"
                            PointerOverForeground="{ThemeResource ListViewItemForegroundPointerOver}"
                            PressedBackground="{ThemeResource ListViewItemBackgroundPressed}"
                            ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
                            RevealBackground="{ThemeResource ListViewItemRevealBackground}"
                            RevealBorderBrush="{ThemeResource ListViewItemRevealBorderBrush}"
                            RevealBorderThickness="{ThemeResource ListViewItemRevealBorderThemeThickness}"
                            SelectedBackground="{ThemeResource ListViewItemBackgroundSelected}"
                            SelectedForeground="{ThemeResource ListViewItemForegroundSelected}"
                            SelectedPointerOverBackground="{ThemeResource ListViewItemBackgroundSelectedPointerOver}"
                            SelectedPressedBackground="{ThemeResource ListViewItemBackgroundSelectedPressed}"
                            SelectionCheckMarkVisualEnabled="{ThemeResource ListViewItemSelectionCheckMarkVisualEnabled}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="Selected" />
                                    <VisualState x:Name="PointerOver">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="PointerOver" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPointerOver}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="PointerOverSelected">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="PointerOver" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPointerOver}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="PointerOverPressed">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="Pressed" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPressed}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="Pressed" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPressed}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="PressedSelected">
                                        <VisualState.Setters>
                                            <Setter Target="Root.(RevealBrush.State)" Value="Pressed" />
                                            <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPressed}" />
                                        </VisualState.Setters>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="DisabledStates">
                                    <VisualState x:Name="Enabled" />
                                    <VisualState x:Name="Disabled">
                                        <VisualState.Setters>
                                            <Setter Target="Root.RevealBorderThickness" Value="0" />
                                        </VisualState.Setters>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                        </ListViewItemPresenter>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Page.Resources>
    <Grid>
        <!--  Remove ItemContainerStyle to see the Reveal hover/click effect.  -->
        <ListView ItemContainerStyle="{StaticResource abc}" ItemsSource="{x:Bind Items}" />
    </Grid>
</Page>

MainPage.xaml.cs

using System.Collections.Generic;
using Windows.UI.Xaml.Controls;

namespace BrokenRevealEffect
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            InitializeComponent();
        }

        public List<string> Items => new List<string> { "Red", "Yellow", "Blue", "Green" };
    }
}

使用System.Collections.Generic；
使用Windows.UI.Xaml.Controls；
命名空间BrokenRevealeFect
{
公共密封部分类主页面：第页
{
公共主页（）
{
初始化组件（）；
}
公共列表项=>新列表{“红色”、“黄色”、“蓝色”、“绿色”}；
}
}

我发现这可以通过使用自定义样式重复

RevealBackgroundBrush

系统控制TransparentRevealBackgroundBrush

和

ListViewItemRevealBackground

的定义来解决

        <RevealBackgroundBrush
            x:Key="SystemControlTransparentRevealBackgroundBrush"
            FallbackColor="Transparent"
            TargetTheme="Light"
            Color="Transparent" />
        <StaticResource x:Key="ListViewItemRevealBackground" ResourceKey="SystemControlTransparentRevealBackgroundBrush" />

只需将此代码添加到

页面.Resources

或

App.Resources

或

ResourceDictionary

中的自定义

ListViewItem

样式之前，无论您在何处定义样式

---

我无法从逻辑上解释为什么需要这样做。这些资源已经在

generic.xaml

中定义，因此这不应该是必需的，但它确实解决了问题。我会将这归因于Windows UI库中的一个错误。

您的意思是当您在App.xaml中添加XamlControlsResources并将abc设置为ItemContainerSt时yle，显示悬停/点击效果将消失？我使用了你的代码，但悬停/点击效果没有消失，与添加自定义样式之前的效果相同。那么，你能提供一个简单的示例，让我们测试悬停效果吗？@Faywang是的，这正是我的意思。我在问题中发布的代码是一个简单的复制，我正是为了这个目的而创建的。如果在运行此代码时效果没有被破坏，我会更加惊讶。我创建了一个全新的项目，并复制和复制了pas