0

我有一个非常基本的用户控件,带有一个带有图像的按钮。我想通过将其更改为不同的图像来为按钮的图像设置动画。

<UserControl.Resources>
    <Image x:Key="GlyphDefault" Source="pack://application:,,,/X;component/images/Glyphs_Default.png" Height="8" Width="8" />
    <Image x:Key="GlyphClicked" Source="pack://application:,,,/X;component/images/Glyphs_Click.png" Height="8" Width="8"  />

</UserControl.Resources>
    <Grid>
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup Name="MouseStates">
            <VisualState Name="MouseHover" >
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames
                                Storyboard.TargetName="GlyphButton"
                                Storyboard.TargetProperty="Content"
                                Duration="0:0:1" >
                        <ObjectAnimationUsingKeyFrames.KeyFrames>
                            <DiscreteObjectKeyFrame KeyTime="0:0:1">
                                <DiscreteObjectKeyFrame.Value="{StaticResource GlyphClicked}" />
                            </DiscreteObjectKeyFrame>
                        </ObjectAnimationUsingKeyFrames.KeyFrames>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
            <VisualState Name="MouseNotHover" >
            </VisualState>
        </VisualStateGroup>

    </VisualStateManager.VisualStateGroups>
    <Button x:Name="GlyphButton" 
            MouseLeave="GlyphButton_MouseLeave"
            MouseEnter="GlyphButton_MouseEnter"
            Content="{StaticResource GlyphDefault}"
            />
</Grid>

不幸的是,当我运行它并将鼠标悬停在按钮上时,我得到“Freezable 不能被冻结”异常(鼠标事件处理程序更改状态)。它似乎正在尝试冻结当前图像,但由于某种原因不能。

我也尝试过不使用静态资源(只是将图像内联),但同样的错误。奇怪的是,我几乎找不到关于在 Content 属性上制作动画的文档或博客。我不得不想象这将是一个常见的场景。关于我做错了什么的任何想法?

我非常感谢您在这方面的帮助!

4

1 回答 1

3

这可能不是解决此问题的最佳(或最简单)方法。该Content属性绝对不是 WPF 设计者为动画所考虑的。下面是我将如何做到这一点:

  1. 将 设置Button.Content为 a Grid,两个图像都放在里面(因此,相互重叠)。
  2. 将您希望最初可见的 设置为 1.0 和 0.0 设置Opacity为最初隐藏。ImageImage
  3. Opacity使用 aDoubleAnimation而不是 an动画ObjectAnimation- 您可以通过将一个不透明度设置为 0.0,同时将另一个设置为 1.0 来切换图像。此外,根据持续时间,这会给你一个很好的淡入淡出过渡。
于 2010-05-06T19:48:54.697 回答