Reputation: 2071
I have a portion of my page dedicated to showing credits and there are three textblocks that scroll vertically. I need each line however to pause when it gets into position (a position in the panel) and then continue after a second or so. Without making this all very complex, I don't know how to do this. I had all three lines scrolling together but didn't know how to make it pause.
I even tried DoubleAnimationUsingKeyFrames but could not get that working either.
Any pointers?
Upvotes: 2
Views: 1721
Reputation: 34295
The trick is to set BeginTime
of animations, like in this sample.
<Window x:Class="WpfApplication1.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Titles" SizeToContent="WidthAndHeight">
<Window.Resources>
<Style TargetType="Grid">
<Setter Property="Width" Value="300" />
<Setter Property="Height" Value="100" />
</Style>
<Style TargetType="TextBlock">
<Setter Property="HorizontalAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="FontSize" Value="20" />
</Style>
<Style TargetType="StackPanel">
<Setter Property="Canvas.Top" Value="200" />
<Style.Triggers>
<EventTrigger RoutedEvent="Loaded">
<BeginStoryboard>
<Storyboard RepeatBehavior="Forever">
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Top)" From="300" To="100" BeginTime="0:00:00" Duration="0:00:02" />
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Top)" From="100" To="0" BeginTime="0:00:04" Duration="0:00:01" />
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Top)" From="0" To="-100" BeginTime="0:00:06" Duration="0:00:01" />
<DoubleAnimation Storyboard.TargetProperty="(Canvas.Top)" From="-100" To="-300" BeginTime="0:00:08" Duration="0:00:02" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Canvas Width="300" Height="300">
<StackPanel>
<Grid>
<TextBlock Text="Name 1" />
</Grid>
<Grid>
<TextBlock Text="Name 2" />
</Grid>
<Grid>
<TextBlock Text="Name 3" />
</Grid>
</StackPanel>
</Canvas>
</Window>
Upvotes: 3