为啥 Canvas.SetTop 动画不能正常工作？

Posted 2023-03-21

【中文标题】为啥 Canvas.SetTop 动画不能正常工作？

【英文标题】：Why Canvas.SetTop animation doesn't work properly?为什么 Canvas.SetTop 动画不能正常工作？

【发布时间】：2012-03-17 20:39:25

【问题描述】：

我有这个 xaml：

    <Canvas Width="75" Height="75">
        <Button x:Name="button" Background="Olive" Canvas.Left="0" Canvas.Top="0" Width="75" Height="75" Click="button_Click"/>
    </Canvas>

还有这段代码：

    Private Sub button_Click(ByVal sender as Object, ByVal e as System.Windows.RoutedEventArgs)
        Canvas.SetTop(sender, -75)

        Dim sb1 As New Storyboard
        Dim da1 As New DoubleAnimationUsingKeyFrames
        da1.BeginTime = TimeSpan.FromSeconds(0)
        Storyboard.SetTargetName(da1, CType(sender, Button).Name)
        Storyboard.SetTargetProperty(da1, New PropertyPath(Canvas.TopProperty))

        Dim t1 As Double = Canvas.GetTop(sender)
        da1.KeyFrames.Add(New SplineDoubleKeyFrame(t1 + 75, TimeSpan.FromSeconds(0.2)))
        sb1.Children.Add(da1)

        BeginStoryboard(sb1)        
    End Sub

当我第一次单击该按钮时，它正确地上升了 75 并动画回 0，但是当我再次单击该按钮时，它只是动画下降了 75。为什么它会跳过 Canvas.SetTop 行并继续直接到动画部分？以及如何解决这个问题？

【参考方案1】：

在 Canvas.SetTop 之前使用这段代码（在 C# 中）

(sender as UIElement).BeginAnimation(Canvas.TopProperty, null);

这将避免任何动画覆盖值 Canvas.TopProperty

这个链接会帮助你

http://joshsmithonwpf.wordpress.com/2008/08/21/removing-the-value-applied-by-an-animation/