0

我有以下简单的动画：

<Window x:Class="AnimationTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <StackPanel Background="Black">
        <TextBox Name="Box" >

        </TextBox>
        <TextBlock Text="{Binding Text, ElementName=Box, NotifyOnTargetUpdated=True}"  Foreground="White" >
            <TextBlock.Style>
                <Style TargetType="TextBlock"  >
                    <Style.Triggers>
                        <EventTrigger RoutedEvent="Binding.TargetUpdated">
                            <BeginStoryboard>
                                <Storyboard>
                                    <ColorAnimation AutoReverse="True" To="#A933FF" Duration="0:0:1" Storyboard.TargetProperty="Foreground.Color" FillBehavior="Stop" IsCumulative="True" />
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                    </Style.Triggers>
                </Style>
            </TextBlock.Style>
        </TextBlock>
    </StackPanel>
</Window>

它只是在值更改时使 flash 成为一个值。如果您写一个字母，您会看到它正确闪烁到动画中设置的颜色并返回。但是，如果您单击几次，持续时间会更长（这是所需的行为），但它会变为原始颜色而不会淡出。为什么会发生这种情况以及如何避免？

4

2 回答 2

2

所以再一次，我们有一个问题，用户提供了一些代码并说为什么会发生这种情况？这种情况下的答案是这些问题的正常答案：

你写了一些代码来实现它

所以为了更深入地挖掘，你问过：

如果您写一个字母，您会看到它正确闪烁到动画中设置的颜色并返回。但是，如果您单击几次，持续时间会更长（这是所需的行为），但它会变为原始颜色而不会淡出。为什么会发生这种情况以及如何避免？

首先，为什么会发生这种情况？

所以它发生的原因是因为你声明了 aColorAnimation没有From设置值，所以它总是从当前值开始，不管这个值是否被 an 操作过Animation：

<ColorAnimation AutoReverse="True" To="#A933FF" Duration="0:0:1" FillBehavior="Stop" 
    Storyboard.TargetProperty="Foreground.Color" IsCumulative="True" />

对于输入的单个字符，您将看到ColorAnimation预期的结果。但是，当您继续输入更多字符时，它已经达到了您设置的紫色，并且在您停止输入之前您将看不到任何其他动画，因为它现在正在尝试从您的紫色动画到相同的紫色。

现在，如何避免呢？

要解决此问题，请提供From颜色，或将 设置为Duration更快，或者最好同时设置：

<ColorAnimation AutoReverse="True" From="White" To="#A933FF" Duration="0:0:0.1" 
    Storyboard.TargetProperty="Foreground.Color" FillBehavior="Stop" 
    IsCumulative="True" />
于 2014-06-20T15:23:46.100 回答
0

您可以使用它来实现所需的结果，ColorAnimationUsingKeyFrames这将为您提供对使用关键帧的精确控制，而不是反转在多次调用后丢失初始值的双重动画，并且 FillBehavior 停止强制它恢复到原始值，因为动画完成

样品给你

<TextBlock Text="{Binding Text, ElementName=Box, NotifyOnTargetUpdated=True}"  Foreground="White" >
    <TextBlock.Style>
        <Style TargetType="TextBlock">
            <Style.Triggers>
                <EventTrigger RoutedEvent="Binding.TargetUpdated">
                    <BeginStoryboard>
                        <Storyboard>
                            <ColorAnimationUsingKeyFrames Duration="0:0:2" Storyboard.TargetProperty="Foreground.Color" >
                                <SplineColorKeyFrame Value="#A933FF"/>
                                <SplineColorKeyFrame Value="White" KeyTime="0:0:1"/>
                            </ColorAnimationUsingKeyFrames>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </TextBlock.Style>
</TextBlock>

更简洁的方法包括停止以前的情节提要并调用新情节提要

<TextBlock Text="{Binding Text, ElementName=Box, NotifyOnTargetUpdated=True}"  Foreground="White" >
    <TextBlock.Style>
        <Style TargetType="TextBlock"  >
            <Style.Resources>
                <Storyboard x:Key="animate">
                    <ColorAnimationUsingKeyFrames Duration="0:0:2" Storyboard.TargetProperty="Background.Color" >
                        <SplineColorKeyFrame Value="#A933FF"/>
                        <SplineColorKeyFrame Value="White" KeyTime="0:0:1"/>
                    </ColorAnimationUsingKeyFrames>
                </Storyboard>
            </Style.Resources>
            <Style.Triggers>
                <EventTrigger RoutedEvent="Binding.TargetUpdated">
                    <StopStoryboard BeginStoryboardName="beginAnimate"/>
                    <BeginStoryboard x:Name="beginAnimate" Storyboard="{StaticResource animate}"/>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </TextBlock.Style>
</TextBlock>
于 2014-06-20T15:35:52.583 回答