WPF/SL 动画时间缩放

Question

我寻找这个特别的东西，因为我认为它是非常重要和令人费解的东西，但我没有找到任何关于这件事的东西。我在想的是 WPF 和 Silverlight 动画中的时间缩放。

假设我们有一个持续时间为 4 秒的 DoubleAnimation 并为一个从 0 到 100 的属性设置动画。它是自动反转的，或者有一个反转其效果的补充动画，这并不重要。假设触发此动画的事件是一个简单的 MouseOver。

问题是:我将光标悬停在一个元素上。该属性在 4 秒内从 0 变为 100。我将光标移开 1 秒，属性从 100 变为 75，然后将鼠标悬停回来。现在该属性在 4 秒内从 75 变为 100。对用户来说很明显，动画运行速度慢了 4 倍。有没有办法缩放动画的时间？如果我想让这个动画在 1 秒内从 75 运行到 100，我该怎么做？我自己在想一个转换器，它可能需要四个参数(绝对开始和结束、实际开始和整个间隔的时间跨度)，然后吐出适当的时间。有没有更优雅的方式？

我注意到，当动画速度很快时，这通常不是问题。当动画运行在 0.2s 或 0.1s 时，人类并没有真正观察到速度的差异，也许所有动画都应该尽可能快，以免恶化体验。但是请从理论上处理这个问题(因此没有代码示例)。我只是好奇是否有任何适当的方法来缩放动画时间。

如果我的问题在网络上的某个地方有答案，请直接告诉我。

帕维尔

附言别介意我的英语，我不是母语者 ;)

Answer 1

我知道这不是您确切问题的答案，但解决此问题的一种方法是捕获 MouseEnter和 MouseLeave , 检查当前动画状态并暂停或恢复它:

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="AnimationTest.MainPage"
    Width="640" Height="480">
    <UserControl.Resources>
        <Storyboard x:Name="Rotate" AutoReverse="True">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.Rotation)" Storyboard.TargetName="textBlock">
                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                <EasingDoubleKeyFrame KeyTime="0:0:4" Value="100"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">
        <TextBlock x:Name="textBlock" Margin="197,216,200,215" TextWrapping="Wrap" Text="My Funky Text" FontSize="32" RenderTransformOrigin="0.5,0.5" MouseEnter="textBlock_MouseEnter" MouseLeave="textBlock_MouseLeave">
            <TextBlock.RenderTransform>
                <CompositeTransform/>
            </TextBlock.RenderTransform>
        </TextBlock>
    </Grid>
</UserControl>

代码:

private void textBlock_MouseEnter(object sender, MouseEventArgs e)
{
    var state = Rotate.GetCurrentState();
    if (state == ClockState.Stopped || state == ClockState.Filling) { Rotate.Begin(); } else Rotate.Resume();
}

private void textBlock_MouseLeave(object sender, MouseEventArgs e)
{
    Rotate.Pause();
}