在我的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++;
}
似乎我需要重置新作品的下一段文字的位置。 我该怎么做?
答案 0 :(得分: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>
故事板正在做的是获取一个元素,然后设置它的属性操作的动画。这就是为什么第二次运行Element时已经有了目标属性,所以通过为动画的开头添加一个关键帧,将值设置为初始值,动画将很好地重复。