如何在WinUI的Style中像CSS一样管理Button的MouseOver事件？

在WinUI中，要通过Style统一管理Button的鼠标悬停状态样式，需要借助VisualStateManager重写控件的视觉状态，这和WPF的触发器思路逻辑一致，但WinUI采用VisualState的方式实现。

你可以在现有Style中添加<Setter Property="Template">，在ControlTemplate内定义VisualStateGroups，重写PointerOver（对应MouseOver）状态的外观。以下是修改后的完整样式代码：

<Style
    TargetType="Button"
    x:Key="btn_success"
    BasedOn="{StaticResource AccentButtonStyle}">
    <Setter Property="HorizontalAlignment" Value="Center"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <!-- 保留基样式的基础控件结构 -->
                <Grid x:Name="RootGrid" Background="{TemplateBinding Background}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <!-- 重写PointerOver（鼠标悬停）状态 -->
                            <VisualState x:Name="PointerOver">
                                <VisualState.Setters>
                                    <Setter Target="RootGrid.Background" Value="Bisque"/>
                                    <!-- 可按需添加其他属性修改，比如前景色、边框色 -->
                                    <!-- <Setter Target="ContentPresenter.Foreground" Value="DarkSlateGray"/> -->
                                </VisualState.Setters>
                            </VisualState>
                            <!-- 保留默认状态（无需修改时可省略，自动继承基样式） -->
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="Pressed"/>
                            <VisualState x:Name="Disabled"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <!-- 内容容器，与基模板结构保持一致 -->
                    <ContentPresenter
                        x:Name="ContentPresenter"
                        Content="{TemplateBinding Content}"
                        ContentTemplate="{TemplateBinding ContentTemplate}"
                        HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                        AutomationProperties.AccessibilityView="Raw"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

关键细节说明： #

• WinUI中鼠标悬停对应的标准视觉状态是PointerOver，而非WPF里的MouseOver，这是因为WinUI适配触摸、鼠标等多输入场景，状态命名更通用。
• 若不想完全重写模板，可先获取AccentButtonStyle的默认模板代码，仅修改PointerOver相关部分，避免破坏原有样式的其他结构。
• 通过Target属性可精准定位模板内的元素（如示例中的RootGrid），修改其属性值，实现类似CSS:hover的样式切换效果。

内容的提问来源于stack exchange，提问作者Riddsaw