动画按钮.鼠标上方的LinearGradientBrush背景

本文关键字:LinearGradientBrush 背景 按钮 鼠标 动画 | 更新日期: 2023-09-27 18:19:49

我正在设计一个自定义按钮,并希望在MouseOver上将其背景更改为LinearGradientBrush。这就是我尝试的:

<UserControl Height="Auto" Width="Auto">
<UserControl.Resources>
    <LinearGradientBrush x:Key="toBackgroundBrush" EndPoint="0,1" StartPoint="0,0">
        <GradientStop Color="#FFC8C8C8" Offset="1"/>
        <GradientStop Color="#FF626161" Offset="0.599"/>
        <GradientStop Color="#FF787878" Offset="0.497"/>
        <GradientStop Color="#FF939393" Offset="1"/>
    </LinearGradientBrush>
</UserControl.Resources>
<Grid>
    <Button Content="Button" Foreground="#FFFFFEFE" Height="30" Width="120">
        <Button.Background>
            <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#FFC8C8C8" Offset="0"/>
                <GradientStop Color="#FF626161" Offset="0.539"/>
                <GradientStop Color="#FF787878" Offset="0.467"/>
                <GradientStop Color="#FF939393" Offset="1"/>
            </LinearGradientBrush>
        </Button.Background>
        <Button.Style>
            <Style TargetType="{x:Type Button}">
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Trigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ColorAnimation 
                                                    Storyboard.TargetProperty="Background"
                                                    AutoReverse="True"
                                                    Duration="0:0:0.25"
                                                    To="{StaticResource toBackgroundBrush}">
                                    </ColorAnimation>
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.EnterActions>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </Button.Style>
    </Button>
</Grid>

然而,当我运行代码时,我得到了这个异常:

Cannot convert the value in attribute 'To' to object of type 
'System.Nullable`1[[System.Windows.Media.Color, PresentationCore, Version=3.0.0.0, 
Culture=neutral, PublicKeyToken=31bf3856ad364e35]]'. 
'System.Windows.Media.LinearGradientBrush' is not a valid value for property 'To'.

我最初尝试在Blend中设置MouseOver事件的动画,但这并没有覆盖默认模板,所以我最终使用情节提要"手动"进行了设置。当To真正指向按钮上的Background属性时,我不明白为什么LinearGradientBrush不是属性To的有效值。感谢您的帮助。

动画按钮.鼠标上方的LinearGradientBrush背景

按钮样式和模板MSDN页面中的示例ControlTemplate展示了如何通过为MouseOver视觉状态创建情节提要来解决问题。
相关文章:
  • 没有找到相关文章