在WPF中加入主畫面(Key Frame)驅動的動畫

在WPF中加入動畫有簡單的動畫例子
不過如果使用者希望作一些比較複雜的動作，比如變紅之後變黃再變綠
那就沒辦法用單純的From和To來執行
這時候可以採用主畫面(Key Frame)的方法來設定動畫
依照主畫面轉換的效果一共可以分成三類

類別	說明
discrete	在設定的時間直接從前一個主畫面切換成此畫面，字串類別的動畫僅有此種主畫面
linear	在設定的時間之前，利用線性內插(linear interpolation)，從前一個主畫面漸進切換成此畫面
spline	在設定的時間之前，利用樣條插值(splined interpolation)，以指定Beizer曲線作為變化軌跡，從前一個主畫面漸進切換成此畫面

下面的例子會讓按鈕的背景顏色隨著時間而有不同變化

private void ApplyAnimation(Button b)
{
/// init a color animation using key frames
ColorAnimationUsingKeyFrames cak =
new ColorAnimationUsingKeyFrames();

/// set the total duration of each animation
cak.Duration = TimeSpan.FromSeconds(6);

/// Smooth change from current color to red in the
/// first 2 sec
cak.KeyFrames.Add(
new LinearColorKeyFrame(
Brushes.Red.Color,
TimeSpan.FromSeconds(2)));

/// Sudden jump to yellow at 2.5 sec
cak.KeyFrames.Add(
new DiscreteColorKeyFrame(
Brushes.Yellow.Color,
TimeSpan.FromSeconds(2.5)));

/// By the keyspline property, smooth change from
/// yellow to green in the next 2 sec
cak.KeyFrames.Add(
new SplineColorKeyFrame(
Brushes.Green.Color,
TimeSpan.FromSeconds(4.5),
new KeySpline(0.6,0,0.9,0)));

/// set the background of input button as a solid
/// color brush and apply the animation on it
b.Background = new SolidColorBrush();
(b.Background as SolidColorBrush).BeginAnimation(
SolidColorBrush.ColorProperty, cak);
}

--
參考資料
ColorAnimationUsingKeyFrames 類別
樣條插值- 維基百科，自由的百科全書