WPF中的動畫——（一）基本概念

原文: WPF中的動畫——（一）基本概念 WPF的一個特點就是支援動畫，我們可以非常容易的實作漂亮大方的界面。首先，我們來複習一下動畫的基本概念。計算機中的動畫一般是 定格動畫 ，也稱之為逐幀動畫，它通過每幀不同的圖像連續播放，進而欺騙眼和腦産生動畫效果。其原理在 維基百科

上有比較詳盡的解釋，這裡就不多介紹了。

也就是說，我們要産生動畫，隻需要連續重新整理界面即可。例如，我們要實作一個寬度變化的按鈕的動畫，可以用如下方式來實作：

    private void MainWindow_Loaded(object sender, RoutedEventArgs e)

    {

        var timer = new System.Windows.Threading.DispatcherTimer();

        timer.Tick += new

EventHandler(OnTimedEvent);

        timer.Interval = TimeSpan.FromSeconds(1.0 / 20);

        timer.Start();

    }

    int index = 0;

    private

void OnTimedEvent(object sender, EventArgs e)

        index++;

        if (index > 40)

            index = 0;

        button.Width = 8 * (index++);

這段代碼不難了解，就是每隔1/20秒更新一次按鈕的寬度，在2s内将其高度從0變為320，重複播放。

這段代碼雖然實作了動畫效果，但它是通過計時器更新的傳統做法，在WinForm下也能實作。在WPF中，正統的實作動畫方式為：

void MainWindow_Loaded(object sender, RoutedEventArgs e)

        var widthAnimation = new

DoubleAnimation()

        {

            From = 0,

            To = 320,

            Duration = TimeSpan.FromSeconds(2),

            RepeatBehavior = RepeatBehavior.Forever,

        };

        button.BeginAnimation(WidthProperty, widthAnimation);

相比較而言，WPF的動畫的實作方式有如下優點：

一、簡潔

這個是非常明顯的，WPF的動畫的代碼非常容易了解，Timer的版本則要難懂得多。當然，我們也可以通過封裝，使得用Timer也能用類似的API實作動畫。但動畫的API并不是僅僅這麼一點，要把整個動畫架構的API都封裝也沒有那麼容易。

二、和XAML無縫內建

這個就是WPF的獨有技術了，得益于XAML強大的表述能力，我們可以寫出非常強大且容易維護的動畫。（這裡就不舉例了，後續文章中再做介紹）這點WinFom的Timer版本是無法做到的。

三、流暢性

如果将這兩種實作方式一起跑起來比較一下就會發現，Timer實作的版本明顯要卡頓，并且并沒有精準的按照我們設計的那樣運動。具體原因為：

Timer精度的問題：由于是改UI控件的屬性（按鈕的寬度），是以必須在UI線程上進行，是以DispatcherTimer 操作與其他操作一樣需要放置到 Dispatcher 隊列中，它并不保證恰好在改時間間隔中。它并不适合動畫這種間隔很短的計時。

幀率的問題：逐幀動畫的流暢性一般取決于每秒更新的幀數，也就是常說的幀率。人眼睛上限是70幀，而我這裡代碼中的Timer的固定了為20幀，是以是能明顯感覺到卡頓的。而WPF的動畫則不然，從它的API中可以看到，它是沒有幀率的設定的。實際上，它是根據計算機的性能和目前程序的繁忙程度盡可能增大幀率的，是以WPF的動畫是遠大于20幀的，是以要流暢得多。

那麼，是否隻要修改參數，加大Timer的版本的幀率，也可以實作同樣流暢的動畫呢？ 試了一下，就算修改參數，也是無法達到WPF版本的流暢程度的。我認為原因主要有如下兩點，

1. DispatcherTimer精度不夠，無法實作大幀率下準确重新整理。
2. 通過簡單的設定參數很難像WPF那樣幀率根據計算機的性能和目前程序的繁忙程度智能比對幀率。幀率設定過低，動畫不流暢，設定過大，處理不過來仍然不流暢。并且UI線程的忙碌程度是會動态變化的，幀率也需要相應調整，這些都無法通過Timer來簡單的處理。

總之，通過Timer定時更新的方式并不适合用來實作動畫。是以還是有必要學習一下WPF的動畫架構的，後面我将陸續寫一系列文章進行一些簡單的介紹。如果要系統的學習，建議參看以下微軟的官方文檔：

http://msdn.microsoft.com/zh-cn/library/ms752312(v=vs.110).aspx