具有内容模板的 wpf 控件在鼠标悬停时更改背景

Question

我真的很陌生。下面的代码完美地显示了按钮，但我无法在鼠标悬停时更改按钮内的矩形填充。我尝试了几种不同的方法，但 none 有效。我试过 controltemplate.triggers 和 style.triggers。我做错了什么？

    <Window.Resources>
        <LinearGradientBrush x:Key="buttonbkgrnd" StartPoint="0,0" EndPoint="1,1">
            <GradientStop Color="#FF7D7DF1" Offset="0.0" />
            <GradientStop Color="white" Offset="0.25" />
            <GradientStop Color="#FF7D7DF1" Offset="0.75" />
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="buttonhoverbkgrnd" StartPoint="0,0" EndPoint="1,1">
            <GradientStop Color="#FF28D366" Offset="0.0" />
            <GradientStop Color="white" Offset="0.25" />
            <GradientStop Color="#FFC4C4F7" Offset="0.75" />
        </LinearGradientBrush>
        <Style x:Key="{x:Type Button}" TargetType="{x:Type Button}">
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid>
                            <Rectangle x:Name="btnback" StrokeThickness="8" RadiusY="10" RadiusX="10" Fill="{StaticResource buttonbkgrnd}" >
                                <Rectangle.Stroke>
                                    <LinearGradientBrush>
                                        <GradientStop Offset="0" Color="Gray"/>
                                        <GradientStop Offset="0.25" Color="LightGray"/>
                                        <GradientStop Offset="0.75" Color="Gray"/>
                                    </LinearGradientBrush>
                                </Rectangle.Stroke>
                                <Rectangle.Style>
                                    <Style TargetType="{x:Type Rectangle}">
                                        <Style.Triggers>
                                            <DataTrigger Binding="{Binding Path=IsMouseOver,
                                     RelativeSource={RelativeSource FindAncestor,
                                     AncestorType={x:Type Button}}}" Value="true">
                                                <Setter Property="Fill" Value="{StaticResource buttonhoverbkgrnd}" />
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>
                                </Rectangle.Style>
                            </Rectangle>

                            <ContentPresenter
                                Margin = "10"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                            />
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
...
window stuff ...
...
        <WrapPanel Margin="0,50,0,0" HorizontalAlignment="Center">
            <Button x:Name="BtnGo" Content="Go" HorizontalAlignment="Center" Margin="5,5,15,5" VerticalAlignment="Top" Width="172" Height="60" RenderTransformOrigin="1.881,0.729" FontSize="20" Click="BtnGo_Click" TabIndex="3" IsDefault="True" AutomationProperties.AcceleratorKey="g"/>
            <Button x:Name="BtnCancel" Content="Cancel" HorizontalAlignment="Center" Margin="15,5,5,5" VerticalAlignment="Top" Width="172" Height="60" RenderTransformOrigin="1.881,0.729" FontSize="20" TabIndex="4" AutomationProperties.AcceleratorKey="c" Click="BtnCancel_Click" />
        </WrapPanel>

Answer 1

<Rectangle ... Fill="{StaticResource buttonbkgrnd}">

此处 Fill 属性具有 本地值 。 Style.Trigger 无法覆盖它。

你可以...

... 删除该本地值并使用 Style Setter:

<Rectangle.Style>
    <Style TargetType="{x:Type Rectangle}">
        <Setter Property="Fill" Value="{StaticResource buttonbkgrnd}" />
        <Style.Triggers>
            <DataTrigger Binding="{Binding Path=IsMouseOver,
                                           RelativeSource={RelativeSource FindAncestor,
                                           AncestorType={x:Type Button}}}" Value="true">
                <Setter Property="Fill" Value="{StaticResource buttonhoverbkgrnd}" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</Rectangle.Style>

... 保留本地值并使用 ContentTemplate.Trigger 和 TargetName:

<ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" Value="true">
        <Setter TargetName="btnback" Property="Fill" Value="{StaticResource buttonhoverbkgrnd}" /> 
    </Trigger>
</ControlTemplate.Triggers>

在这种情况下 <Rectangle.Style> 变得多余，可以删除

具有内容模板的 wpf 控件在鼠标悬停时更改背景

wpf control with content template change background on mouseover

wpf

binding

controltemplate