缩放动画 - 不能 return 到 scale:1

Question

我一直在尝试通过情节提要动画来缩放网格。

这是动画：

<Storyboard x:Key="HoverOut" Duration="00:00:00.250">
    <DoubleAnimation 
        To="1" 
        Storyboard.TargetName="scale"
        Storyboard.TargetProperty="(ScaleTransform.ScaleX)"/>
    <DoubleAnimation 
        To="1" 
        Storyboard.TargetName="scale"
        Storyboard.TargetProperty="(ScaleTransform.ScaleY)"/>
</Storyboard>
<Storyboard x:Key="HoverIn" Duration="00:00:00.250">
    <DoubleAnimation 
        To="5" 
        Storyboard.TargetName="scale"
        Storyboard.TargetProperty="(ScaleTransform.ScaleX)"/>
    <DoubleAnimation 
        To="5" 
        Storyboard.TargetName="scale"
        Storyboard.TargetProperty="(ScaleTransform.ScaleY)"/>
</Storyboard>

我在 ControlTemplate 中以按钮样式使用它：

<ControlTemplate.Triggers>
                    <EventTrigger RoutedEvent="Button.MouseLeave">
                        <EventTrigger.Actions>
                            <BeginStoryboard Storyboard="{StaticResource HoverOut}"/>
                        </EventTrigger.Actions>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="Button.MouseEnter">
                        <EventTrigger.Actions>
                            <BeginStoryboard Storyboard="{StaticResource HoverIn}"/>
                        </EventTrigger.Actions>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="Button.LostFocus">
                        <EventTrigger.Actions>
                            <BeginStoryboard Storyboard="{StaticResource HoverOut}"/>
                        </EventTrigger.Actions>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="Button.GotFocus">
                        <EventTrigger.Actions>
                            <BeginStoryboard Storyboard="{StaticResource HoverIn}"/>
                        </EventTrigger.Actions>
                    </EventTrigger>
</ControlTemplate.Triggers>

网格包含一个 RenderTransform：

<Grid RenderTransformOrigin="0.5,0.5">
                        <Grid.RenderTransform>
                            <ScaleTransform x:Name="scale"
                                            ScaleX="1"
                                            ScaleY="1">
                            </ScaleTransform>
                        </Grid.RenderTransform>

问题是它确实可以按比例放大，但是当它应该通过 "HoverOut" 情节提要按比例缩小时，它不会 return 到默认比例。它缩小了一小部分。再次将鼠标悬停在按钮上会继续这种攀爬效果，越来越大。

此外，当鼠标 Entering/Leaving 非常快时，它似乎开始缩小...

编辑： 我在我的按钮模板中添加了一个标签，告诉我 ScaleTransform 的当前 scaleX 和 ScaleY，这些数字对我来说没有意义。

动画应该将比例因子设置为 5，然而，当放大时它只放大 1，给出比例因子 2。更奇怪的是，在再次 MouseLeave 和 MouseEnter 之后，它第二次缩放总共只增加了 0.81.

Answer 1

万一其他人遇到过这个问题，我终于找到了我做错了什么。我正在设置故事板的持续时间而不是 DoubleAnimations 的持续时间。

DoubleAnimation - duration property: duration of one iteration. 
Storyboard      - duration property: duration of the total animation and all iterations.

所以，动画应该是：

<Storyboard x:Key="HoverOut" >
    <DoubleAnimation 
        Duration="00:00:00.250"
        To="1" 
        Storyboard.TargetName="scale" 
        Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleX)"/>
    <DoubleAnimation 
        Duration="00:00:00.250"
        To="1" 
        Storyboard.TargetName="scale" 
        Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleY)"/>
</Storyboard>
<Storyboard x:Key="HoverIn" >
    <DoubleAnimation 
        Duration="00:00:00.250"
        To="5" 
        Storyboard.TargetName="scale" 
        Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleX)"/>
    <DoubleAnimation 
        Duration="00:00:00.250"
        To="5" 
        Storyboard.TargetName="scale" 
        Storyboard.TargetProperty="(RenderTransform).(ScaleTransform.ScaleY)"/>
</Storyboard>

缩放动画 - 不能 return 到 scale:1

Scaling animation - Can't return to scale:1

wpf

wpf-animation