快捷導(dǎo)航

WPF實(shí)現(xiàn)動(dòng)畫(huà)效果（二）之From/To/By動(dòng)畫(huà)

更新時(shí)間：2022年06月23日 11:20:37 作者：天方

這篇文章介紹了WPF實(shí)現(xiàn)動(dòng)畫(huà)效果之From/To/By動(dòng)畫(huà)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

WPF動(dòng)畫(huà)效果系列

WPF實(shí)現(xiàn)動(dòng)畫(huà)效果（一）之基本概念

WPF實(shí)現(xiàn)動(dòng)畫(huà)效果（二）之From/To/By 動(dòng)畫(huà)

WPF實(shí)現(xiàn)動(dòng)畫(huà)效果（三）之時(shí)間線（TimeLine）

WPF實(shí)現(xiàn)動(dòng)畫(huà)效果（四）之緩動(dòng)函數(shù)

WPF實(shí)現(xiàn)動(dòng)畫(huà)效果（五）之關(guān)鍵幀動(dòng)畫(huà)

WPF實(shí)現(xiàn)動(dòng)畫(huà)效果（六）之路徑動(dòng)畫(huà)

WPF實(shí)現(xiàn)動(dòng)畫(huà)效果（七）之演示圖板

正文

我們所實(shí)現(xiàn)的的動(dòng)畫(huà)中，很大一部分是讓一個(gè)屬性在起始值和結(jié)束值之間變化，例如，我在前文中實(shí)現(xiàn)的改變寬度的動(dòng)畫(huà)：

    var widthAnimation = new DoubleAnimation()
    {
        From = 0,
        To = 320,
        Duration = TimeSpan.FromSeconds(2),
        RepeatBehavior = RepeatBehavior.Forever,
    };

    button.BeginAnimation(WidthProperty, widthAnimation);

這個(gè)動(dòng)畫(huà)實(shí)現(xiàn)了寬度在0和320之間的變化，由于寬度是一個(gè)double型，因此這里用的是DoubleAnimation。對(duì)于一些其它常見(jiàn)的類型，如Byte、Color、Int32、Size、Point等，在System.Windows.Media.Animation下都有相應(yīng)的過(guò)渡動(dòng)畫(huà)實(shí)現(xiàn)，命名規(guī)則是"數(shù)據(jù)結(jié)構(gòu)類型+Animation"這里就不多介紹了。

這種過(guò)渡動(dòng)畫(huà)一般成為From/To/By 動(dòng)畫(huà)，是因?yàn)樗鼈兪峭ㄟ^(guò)From、To、By三個(gè)屬性來(lái)決定了目標(biāo)屬性的起始值和結(jié)束值。首先我們來(lái)看下這三個(gè)屬性代表的意義：

From：起始值，在動(dòng)畫(huà)開(kāi)始的時(shí)候?qū)⒛繕?biāo)屬性設(shè)置為該值
To：結(jié)束值，動(dòng)畫(huà)結(jié)束是目標(biāo)屬性為改值
By：偏移值：動(dòng)畫(huà)結(jié)束的時(shí)候目標(biāo)屬性為"初始值+偏移值"

很明顯，To和By的效果是有可能沖突的。實(shí)際上，這三個(gè)屬性都是可選設(shè)置的，并且在設(shè)置了To和By的時(shí)候，是會(huì)忽略By屬性的。下面我再通過(guò)一些簡(jiǎn)單的場(chǎng)景介紹一下這三個(gè)屬性如何組合使用。

由0 變?yōu)?320：From = 0， To = 320
由初始值變?yōu)?20：To = 320
由0變?yōu)槌跏贾担篎rom = 0
由0增大150：From = 0， By = 150
由初始值增大150：By = 150

看了這幾個(gè)用例后，相信大家已經(jīng)大致能明白這三個(gè)參數(shù)的使用方法。

為什么這么設(shè)計(jì)

初一看上去，這種From、To、By的三參數(shù)設(shè)計(jì)得過(guò)于復(fù)雜，完全可以用From和To兩個(gè)參數(shù)可以確定，需要用到By的地方通過(guò)運(yùn)算獲取。甚至From和To也可以強(qiáng)制要求賦值，這樣就不會(huì)出現(xiàn)From和To都不賦值的這種非法情況了。為什么要這么設(shè)計(jì)呢？我覺(jué)得有兩個(gè)原因：

這種比較靈活的方式可以方便將動(dòng)畫(huà)和具體的對(duì)象分離出來(lái)，可以方便復(fù)用和組合。
方便在XAML中使用。如果像我上述的那樣的做法，很多時(shí)候需要取對(duì)象的初始值，用XAML編寫(xiě)復(fù)雜的動(dòng)畫(huà)時(shí)，這種操作并不是是很方便。

時(shí)間控制

這里只介紹了如何設(shè)置過(guò)渡動(dòng)畫(huà)的起始狀態(tài)和終止?fàn)顟B(tài)，動(dòng)畫(huà)還有一個(gè)比較重要部分是時(shí)間控制，如動(dòng)畫(huà)時(shí)間段的長(zhǎng)度、開(kāi)始時(shí)間、重復(fù)次數(shù)、進(jìn)度的快慢，結(jié)束通知等。這些都是在其基類TimeLine中控制的，下一章將單獨(dú)對(duì)其介紹。