CODEWITHSUNDEEP
c#wpf
Matheus Miranda
Matheus Miranda

Reputation: 1805

Class DoubleAnimation - Animation is very fast with longer text

Follow code:

XAML:

<Window x:Class="Wpf_Notice.MostrarAviso"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:Wpf_Notice"
        mc:Ignorable="d"
        Title="Notice" Height="300" Width="300" WindowStyle="None" ShowInTaskbar="False" ResizeMode="NoResize" Loaded="Window_Loaded">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>
        <StackPanel Grid.Row="0">
            <!--...-->
        </StackPanel>
        <Canvas Background="Black">
            <Canvas Canvas.Bottom="0" ClipToBounds="True" Name="canMain" Background="Red" Height="97" Width="300">
                <TextBlock FontSize="70" Name="tbmarquee" Height="74" FontFamily="Arial Black" Foreground="White" Canvas.Top="10"></TextBlock>
            </Canvas>
        </Canvas>
    </Grid>
</Window>

Quick animation:

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    canMain.Width = ActualWidth;
    tbmarquee.Text = "Donald Trump announced on Friday a new package of measures against North Korea bla bla bla bla bla bla bla bla...";
    UpdateLayout();

    DoubleAnimation doubleAnimation = new DoubleAnimation
    {
        From = -tbmarquee.ActualWidth,
        To = canMain.ActualWidth,
        RepeatBehavior = new RepeatBehavior(2),
        Duration = new Duration(TimeSpan.FromSeconds(10))
    };

    tbmarquee.BeginAnimation(Canvas.RightProperty, doubleAnimation);
}

Result: (Quick animation)

enter image description here

Slow animation:

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    canMain.Width = ActualWidth;
    tbmarquee.Text = "Donald Trump announced...";
    UpdateLayout();

    DoubleAnimation doubleAnimation = new DoubleAnimation
    {
        From = -tbmarquee.ActualWidth,
        To = canMain.ActualWidth,
        RepeatBehavior = new RepeatBehavior(2),
        Duration = new Duration(TimeSpan.FromSeconds(10))
    };

    tbmarquee.BeginAnimation(Canvas.RightProperty, doubleAnimation);
}

Result: (Slow animation)

enter image description here

When the text is small, the animation is slow, now when the text is long, the animation is fast. How to leave the 2 texts with the same speed?

Any solution ?

Upvotes: 0

Views: 263

Answers (1)

Karolis Kajenas
Karolis Kajenas

Reputation: 1543

You can try having a formula depending on UI elements size:

Duration = new Duration(TimeSpan.FromSeconds((tbmarquee.ActualWidth + canMain.ActualWidth) * 0.005)));

Note 0.005 is just a random constant, adjust it to increase or decrease speed. Instead of relying on length of the string you should rely on size of UI elements since chars have different display size.

Upvotes: 1

Related Questions