按钮背景动画:无法解析属性路径';中的所有属性引用;背景';

本文关键字:属性 背景 引用 动画 按钮 路径 | 更新日期: 2023-09-27 18:14:08

我正在尝试将鼠标悬停时的动画添加到为wpf应用程序中的按钮设置的控制模板中

这是我的代码:

<Style x:Key="scanButtonActive" TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border CornerRadius="3,3,0,0" BorderBrush="#575757" BorderThickness="0,6,0,0" Height="{TemplateBinding Height}" Width="{TemplateBinding Width}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" Cursor="{TemplateBinding Cursor}">
                    <ContentPresenter x:Name="ScanButton">
                    </ContentPresenter>
                </Border>
                <ControlTemplate.Triggers>
                    <EventTrigger RoutedEvent="MouseEnter">
                        <BeginStoryboard>
                            <Storyboard>
                                <ColorAnimation From="#6d6e6e" To="#b2b2b2" Duration="0:0:1" Storyboard.TargetName="ScanButton" Storyboard.TargetProperty="Background"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="MouseLeave">
                        <BeginStoryboard>
                            <Storyboard>
                                <ColorAnimation From="#b2b2b2" To="#6d6e6e" Duration="0:0:1" Storyboard.TargetName="ScanButton" Storyboard.TargetProperty="Background"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>           
    <Setter Property="Padding" Value="7, 3, 7, 3" />
    <Setter Property="Margin" Value="0, 0, 0, 10" />
    <Setter Property="Background" Value="#6d6e6e" />
    <Setter Property="Foreground" Value="#ffffff" />
    <Setter Property="Height" Value="100"/>
    <Setter Property="Width" Value="250"/>
    <Setter Property="HorizontalAlignment" Value="Center"/>
    <Setter Property="VerticalAlignment" Value="Center"/>
    <Setter Property="Cursor" Value="Hand"/>               
</Style>

然而,当我将鼠标悬停在按钮上时,会出现以下错误:

无法解析属性路径Background中的所有属性引用。

我该如何解决这个问题?

按钮背景动画:无法解析属性路径';中的所有属性引用;背景';

有一些错误。

第一个ContentPresenter不具有Background属性。您可以改为设置Border控件的Background

其次,Background的类型是Brush,但ColorAnmation会为Color设置动画,因此应该将属性路径更改为Background.Color

第三(为了完整性(,您应该显式地将SolidColorBrush分配给Background属性,该属性保证是可修改的。

<Style TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border x:Name="border" ...>
                    ...
                </Border>
                <ControlTemplate.Triggers>
                    <EventTrigger RoutedEvent="MouseEnter">
                        <BeginStoryboard>
                            <Storyboard>
                                <ColorAnimation
                                    To="#b2b2b2" Duration="0:0:1"
                                    Storyboard.TargetName="border" 
                                    Storyboard.TargetProperty="Background.Color"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="MouseLeave">
                        <BeginStoryboard>
                            <Storyboard>
                                <ColorAnimation
                                    To="#6d6e6e" Duration="0:0:1"
                                    Storyboard.TargetName="border"
                                    Storyboard.TargetProperty="Background.Color"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    ...
    <Setter Property="Background">
        <Setter.Value>
            <SolidColorBrush Color="#6d6e6e"/>
        </Setter.Value>
    </Setter>
</Style>

还请注意,您不必显式设置动画的From值。

尝试使用以下代码:

<ControlTemplate.Triggers>
    <EventTrigger RoutedEvent="MouseEnter">
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation From="#6d6e6e" To="#b2b2b2" Duration="0:0:1" 
                    Storyboard.TargetName="ScanButton" 
                    Storyboard.TargetProperty="Control.Background"/>
            </Storyboard>
        </BeginStoryboard>
    </EventTrigger>
    <EventTrigger RoutedEvent="MouseLeave">
        <BeginStoryboard>
            <Storyboard>
                <ColorAnimation From="#b2b2b2" To="#6d6e6e" Duration="0:0:1" 
                    Storyboard.TargetName="ScanButton" 
                    Storyboard.TargetProperty="Control.Background"/>
            </Storyboard>
        </BeginStoryboard>
    </EventTrigger>
</ControlTemplate.Triggers>