Expression Blend實例動畫-大壩水位升高演示

原文: Expression Blend實例動畫-大壩水位升高演示

Expression Blend是個很強大的東西,用它能夠完成不少很差作的動畫效果。css

動畫的主要元素:html

  時間線(Timeline) :定義了值隨着時間的變化方式。有不一樣類型的時間線,可用於改變不一樣類型的值。因此時間線的基類都是Timeline。爲了連續改變double,可使用DoubleAnimation類。windows

  Timeline的主要屬性工具

  AutoReverse :使用該屬性,能夠指定連續改變的值在動畫結束後是否返回初始值。動畫

  SpeedRatio:使用該屬性,能夠改變更畫的執行速度。在這個屬性中,能夠定義父子元素的相對關係。默認值爲1,將速率設爲較小的值時,動畫的執行速度較慢。spa

  BeginTime:使用該屬性,能夠指定從觸發事件開始到動畫開始之間的長度。.net

  Duration:指定動畫執行一次的時間長度。設計

  RepeatBehavior:定義動畫重複的次數或重複的時間。htm

  FillBehavior:若是父元素的時間線有不一樣的持續時間,則FillBehavior屬性就很重要。對象

  關於更多的Timeline類的屬性能夠參考?MSDN:http://msdn.microsoft.com/zh-cn/library/system.windows.media.animation.timeline_properties%28VS.85%29.aspx

  情景板(Storyboard) :用於合併動畫。Storyboard類派生子基類TimelineGroup,TimelineGroup又派生自基類Timeline。

  情景板或者故事板繼承自基類Timeline,可是能夠包含幾個時間線。StoryBoard類能夠用於控制時間線。

  StoryBoard類的主要方法以下:

  Begin():啓動與情景板相關的動畫

  BeginAnimation():能夠爲一個依賴屬性啓動單個動畫

  CreateClock():返回一個Clock對象,用於控制動畫

  Pause()、Resume():暫停、恢復動畫

  Seek():使動畫移動到指定的時間處

  Stop():中止動畫

  觸發器(Trigger) :經過觸發器能夠啓動和中止動畫。


我這裏用vs2013自帶的Blend工具來製做一個簡單的大壩水位升高的動畫演示:

1.打開Blend後新建一個Wpf項目:


2.用左側的「筆」工具畫出所須要的大壩及湖泊的大概形狀出來,用label或者textbox控件加入相應的文字信息,而後能夠填充一下本身須要的顏色:



3.在對象菜單欄下面選擇「新建」按鈕,新建一個StoryBoard,擊「Ok」後,Objects and Timeline編輯框將載入剛剛建立的StoryBoard,在右邊出現了動畫控制按鈕,關鍵幀設置按鈕以及時間線顯示面板。

4.在設計主窗口,會看到一個紅色框,這表明着控件處於動畫錄製狀態:


5.在黃色進程線爲「0:00:00」的位置,點擊添加一個KeyFrame關鍵幀:


6.移動黃色進程線到「0:01:000」位置:


7.最後拖動湖泊這個梯形向上拉便可:


8.若是想一直循環運行或者規定次數的話,能夠在屬性進行設置,選擇AutoReverse和RepeatBehavior:


9.運行後效果如圖:

相關文章
相關標籤/搜索