Note that there are some explanatory texts on larger screens.

plurals
  1. POWPF: Animation is not smooth
    primarykey
    data
    text
    <p>I am animating a <code>TextBlock</code>. In 60 seconds, it increases <code>FontSize</code> from 8pt to 200pt. Everything is working fine, except that my animation is moving up and down a bit as the text grows. Why is this happening and is it possible to avoid this?</p> <p>I have a very simple XAML file:</p> <pre><code>&lt;Window x:Class="Timer.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="800" Height="500" Title="MainWindow" Loaded="Window_Loaded"&gt; &lt;Grid&gt; &lt;TextBlock Name="TimerTextBlock" HorizontalAlignment="Center" VerticalAlignment="Center" Text="00h : 00m : 00.000s" /&gt; &lt;/Grid&gt; &lt;/Window&gt; </code></pre> <p>And equally simple code-behind:</p> <pre><code>public partial class MainWindow : Window { private const string timerFormat = "{0:hh'h : 'mm'm : 'ss'.'fff's'}"; private DispatcherTimer dispatcherTimer; private DateTime targetTime; public MainWindow() { InitializeComponent(); } private void Window_Loaded(object sender, RoutedEventArgs e) { targetTime = DateTime.Now.AddSeconds(60); double totalTime = targetTime.Subtract(DateTime.Now).TotalMilliseconds; DoubleAnimation animation = new DoubleAnimation(); animation.From = TimerTextBlock.FontSize; animation.To = 200; animation.Duration = new Duration(targetTime.Subtract(DateTime.Now)); TimerTextBlock.BeginAnimation(TextBlock.FontSizeProperty, animation); dispatcherTimer = new DispatcherTimer(); dispatcherTimer.Interval = TimeSpan.FromMilliseconds(1); dispatcherTimer.Tick += new EventHandler(dispatcherTimer_Tick); dispatcherTimer.Start(); } private void dispatcherTimer_Tick(object sender, EventArgs e) { if (DateTime.Compare(targetTime, DateTime.Now) &gt; 0) { TimerTextBlock.Text = string.Format(timerFormat, targetTime.Subtract(DateTime.Now)); } } } </code></pre> <p>Thank you for all the clarifications. </p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload