Question

我需要在代码中逐步启动和停止动画（旋转）。

首先，我制作了下一个故事板：

DoubleAnimation StartRotating = new DoubleAnimation();
StartRotating.From = 0;
StartRotating.To = 360;
StartRotating.Duration = TimeSpan.FromSeconds(2);
control.storyboard.Children.Add(StartRotating);
Storyboard.SetTarget(StartRotating, control.FanCanvas);
Storyboard.SetTargetProperty(StartRotating, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"));
PowerEase easingFunction = new PowerEase();
easingFunction.EasingMode = EasingMode.EaseIn;
StartRotating.EasingFunction = easingFunction;

DoubleAnimationUsingKeyFrames persistentRotation = new DoubleAnimationUsingKeyFrames();
persistentRotation.BeginTime = TimeSpan.FromSeconds(2);
persistentRotation.RepeatBehavior = RepeatBehavior.Forever;
Storyboard.SetTarget(persistentRotation, control.FanCanvas);
Storyboard.SetTargetProperty(persistentRotation, new PropertyPath("(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"));
persistentRotation.KeyFrames.Add(new EasingDoubleKeyFrame(360, KeyTime.FromTimeSpan(TimeSpan.FromSeconds(0))));
persistentRotation.KeyFrames.Add(new EasingDoubleKeyFrame(720, KeyTime.FromTimeSpan(TimeSpan.FromSeconds(1))));
control.storyboard.Children.Add(persistentRotation);
control.storyboard.Begin();

有一刻我需要逐渐停止它。但是，我有一些问题：

1）我无法获得当前Angle的值。我尝试过此解决方案（How to get the rotation value of a UI Element in WPF），但值rotation为空...所以，我无法获得Angle。

2）然后我想逐渐停止动画，我改变我的故事板，然后停止它，然后再次开始。所以，它有一个小停顿。但是，我想要没有停顿的平滑动画。

提前致谢。

Answer 1

要平滑地更改动画的速度，您有两个主要选项。第一个使用其中一个可用的Easing Functions，例如ExponentialEase Class（从此链接页面获取的示例）：

<Rectangle Name="myRectangle" Width="200" Height="30" Fill="Blue">
    <Rectangle.Triggers>
        <EventTrigger RoutedEvent="Rectangle.MouseDown">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation From="30" To="200" Duration="00:00:3" 
                     Storyboard.TargetName="myRectangle" 
                     Storyboard.TargetProperty="Height">
                        <DoubleAnimation.EasingFunction>
                            <ExponentialEase Exponent="6" EasingMode="EaseOut"/>
                        </DoubleAnimation.EasingFunction>
                    </DoubleAnimation>

                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Rectangle.Triggers>

</Rectangle>

另一个更简单但不可配置的选项是在使用过的Animation对象上使用Timeline.DecelerationRatio Property。

虽然我发现您使用的是EasingMode属性，但我想补充一点，使用KeyFrame时更改平滑动画会有些困难。

更新＆gt;＆gt;＆gt;

您应该能够从RotateTransform属性中找到RenderTransform的当前值，如下所示：

double currentRotationValue = 0;
TransformGroup transformGroup = element.RenderTransform as TransformGroup;
if (transformGroup != null)
{
    RotateTransform rotateTransform = transformGroup.Children[2] as RotateTransform;
    if (rotateTransform != null)
    {
        currentRotationValue = rotation.Angle;
    }
}
// Use currentRotationValue for whatever you want

这显然假设您的RotationTransform位于TransformGroup元素的第三个位置。如果不是这种情况，则需要在运行之前调整此代码。

代码中逐渐停止旋转（WPF动画）

1 个答案: