2

在我的 Silverlight 应用程序中，我希望不同的文本从正确的颜色不断变化并变得更小重复飞入。动画第一次通过循环工作，但不是后续时间。

这是我所做的：

(1) 我进入Expression blend，使用“创建故事板”工具创建动画。

然后 (2)将 StoryBoard块复制到我的 XAML：

<UserControl x:Class="TestWeb124.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Width="800" Height="600">
    <UserControl.Resources>
        <Storyboard x:Key="FadeTextIn">
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OutputText" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
                <SplineDoubleKeyFrame KeyTime="00:00:01.5000000" Value="-111" KeySpline="0,0,0,1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OutputText" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
                <SplineDoubleKeyFrame KeyTime="00:00:01.5000000" Value="-88" KeySpline="0,0,0,1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OutputText" Storyboard.TargetProperty="(TextBlock.FontSize)">
                <SplineDoubleKeyFrame KeyTime="00:00:01.5000000" Value="14" KeySpline="0,0,0,1"/>
            </DoubleAnimationUsingKeyFrames>
            <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OutputText" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)">
                <SplineColorKeyFrame KeyTime="00:00:00" Value="#FFC24343"/>
                <SplineColorKeyFrame KeyTime="00:00:01.5000000" Value="#FF000000" KeySpline="0,0,0,1"/>
            </ColorAnimationUsingKeyFrames>
        </Storyboard>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">
        <StackPanel Margin="20">
            <TextBlock Height="57" Margin="190,90,133,0" VerticalAlignment="Top" Text="This is a test." TextWrapping="Wrap" FontSize="36" RenderTransformOrigin="0.5,0.5" x:Name="OutputText" Foreground="#FF000000">
            <TextBlock.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </TextBlock.RenderTransform>
            </TextBlock>
        </StackPanel>
    </Grid>
</UserControl>

然后（3）在我后面的代码中运行一个计时器循环。动画第一次效果很好，但随后没有动画：

public void Each_Tick(object o, EventArgs sender)
{
    if (_secondsElapsed % 5 == 0 || _secondsElapsed == 0)
    {
        OutputText.Text = String.Format("{0}", _customerFirstNames.ElementAt(_customerNodeIndex));
        Storyboard fadeTextIn = (Storyboard)Resources["FadeTextIn"];
        fadeTextIn.Begin();
        _customerNodeIndex++;
        if (_customerNodeIndex > _customerFirstNames.Count() - 1) _customerNodeIndex = 0;
    }
    _secondsElapsed++;
}

看来我需要重新设置下一段应该飞行的新文本的位置。我怎么做？

4

1 回答 1

2 
        <Storyboard x:Name="FadeTextIn">
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OutputText" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0" KeySpline="0,0,0,1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:01.5000000" Value="-111" KeySpline="0,0,0,1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OutputText" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0" KeySpline="0,0,0,0"/>
                <SplineDoubleKeyFrame KeyTime="00:00:01.5000000" Value="-88" KeySpline="0,0,0,1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OutputText" Storyboard.TargetProperty="(TextBlock.FontSize)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="36" KeySpline="0,0,0,0"/>
                <SplineDoubleKeyFrame KeyTime="00:00:01.5000000" Value="14" KeySpline="0,0,0,1"/>
            </DoubleAnimationUsingKeyFrames>
            <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OutputText" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)">
                <SplineColorKeyFrame KeyTime="00:00:00" Value="#FFC24343"/>
                <SplineColorKeyFrame KeyTime="00:00:01.5000000" Value="#FF000000" KeySpline="0,0,0,1"/>
            </ColorAnimationUsingKeyFrames>
        </Storyboard>

Storyboard 所做的是获取一个元素，然后对其属性的操作进行动画处理。这就是为什么它第二次运行时元素已经具有目标属性，因此通过为动画的开始添加一个关键帧，将值设置为初始值，您的动画将很好地重复。

于 2009-04-01T13:39:13.953 回答