Question

I have a scrolling text line, and I need to achieve effect that immediately after the end of the text, start of the same text will appear. Any ideas?

UPD text is static (doesn’t change)
Current animation code is like this:

                    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                    <BeginStoryboard>
                        <Storyboard RepeatBehavior="Forever">
                            <DoubleAnimation From="200" To="-200" Storyboard.TargetName="translate" 
                                Storyboard.TargetProperty="Y" Duration="0:0:5" />
                        </Storyboard>
                    </BeginStoryboard>

It works ok, but it jerks when reaches end (and jumps back to the start). I need to avoid this.

Answer 1

If the text length is static, the easiest way to do this is to create multiple copies of the text offscreen and have the copy/copies animate to the same position as the original. If you have an animation loop this way, there will be no “jerk”

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
x:Class="SilverlightApplication3.MainPage"
Width="200" Height="480">
<UserControl.Resources>
    <Storyboard x:Name="TextScrollStoryboard">
        <DoubleAnimationUsingKeyFrames  Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="offscreenTextBlock" RepeatBehavior="Forever">
            <EasingDoubleKeyFrame KeyTime="0" Value="-200"/>
            <EasingDoubleKeyFrame KeyTime="0:0:2" Value="0"/>
        </DoubleAnimationUsingKeyFrames>
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="textBlock" RepeatBehavior="Forever">
            <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
            <EasingDoubleKeyFrame KeyTime="0:0:2" Value="200"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>
</UserControl.Resources>

<i:Interaction.Triggers>
    <i:EventTrigger>
        <ei:ControlStoryboardAction Storyboard="{StaticResource TextScrollStoryboard}"/>
    </i:EventTrigger>
</i:Interaction.Triggers>

<Grid x:Name="LayoutRoot" Background="#FFBBBBBB">
    <TextBlock x:Name="textBlock" Text="This is some text" RenderTransformOrigin="0.5,0.5" >
        <TextBlock.RenderTransform>
            <CompositeTransform TranslateX="0"/>
        </TextBlock.RenderTransform>
    </TextBlock>
    <TextBlock x:Name="offscreenTextBlock" Text="This is some text" RenderTransformOrigin="0.5,0.5" >
        <TextBlock.RenderTransform>
            <CompositeTransform TranslateX="-200"/>
        </TextBlock.RenderTransform>
    </TextBlock>
</Grid>