0

The following text block ticker animation is not smooth at all. So need some guidance on how to make this double animation smoother for more user friendliness as I will be integrating RSS news feed in there after that.

XAML CODE:

<Window x:Class="Wpf_Marquee.MainWindow"
    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_Marquee"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">

<Canvas Margin="50" Canvas.Left="150" Canvas.Top="100" ClipToBounds="True" Name="canMain" Background="Red"   Height="100" Width="400" >  

    <TextBlock x:Name="marquee"  Margin="0 50 0 0" FontSize="20pt" Foreground="Black" Background="Transparent" Canvas.Left="0" Canvas.Right="68">

        Hello This is a Sample Marquee in Wpf. Please check the animation

    </TextBlock>

    <Button x:Name="btn1" Width="50" Height="50" Content="Marquee" Click="Button_Click"   />
</Canvas>

Where as my .CS code is as follows

using System;
using System.Collections.Generic;
using System.Linq;
using System.ServiceModel.Syndication;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Automation.Peers;
using System.Windows.Automation.Provider;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Xml;


namespace Wpf_Marquee
{
     /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();

    }
    public void Button_Click(object sender, RoutedEventArgs e)
    {


        DoubleAnimation doubleAnimation = new DoubleAnimation();
        doubleAnimation.From = this.ActualWidth;
        doubleAnimation.To = -marquee.ActualWidth;
        doubleAnimation.RepeatBehavior = RepeatBehavior.Forever;
        doubleAnimation.Duration = new Duration(TimeSpan.FromSeconds(2060)); // provide an appropriate  duration 
        marquee.BeginAnimation(Canvas.LeftProperty, doubleAnimation);
    }


}
}

Thanks in advance for your help :)

  • Can you define "smooth" for you need? You can put 10 seconds of time and check. – Gaurang Dave Jan 10 '18 at 02:52
  • In a non-real-time OS, with a non-kernel-level animation engine, there will always be the potential for some variation in smoothness. There are lots of other questions on Stack Overflow addressing how to mitigate this. See marked duplicates. In your own specific scenario, I was able to combine a change in framerate (you'll need to create a `Storyboard` to set the framerate on) and the technique of converting the text to a `Geometry` displayed in a `Path`, to achieve what I felt was a much improved level of smoothness. – Peter Duniho Jan 10 '18 at 03:23
  • Setting a `TranslateTransform` as the `RenderTransform` and then animating `RenderTransform.X` instead of `Canvas.Left` also worked well (as an alternative to using the `Path`+`Geometry` approach) – Peter Duniho Jan 10 '18 at 03:27

0 Answers0