WPF 故事板動畫示例

WPF做動畫比較方便；
Storyboard和Animation，你只要指定一些屬性值，比如開始值和結束值、由開始值到達結束值所需的時間、需要動畫的屬性，便可形成一個簡單的動畫。
可以在xaml代碼裏指定；也可以在C#代碼裏指定；可以在C#代碼裏引用xaml代碼裏的控件；

下面指定長方形的寬度由100變化到200，所需時間爲1秒；

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 
  WindowTitle="Storyboards Example">
  <StackPanel Margin="20">
    
    <Rectangle Name="MyRectangle"
      Width="100"
      Height="100">
      <Rectangle.Fill>
        <SolidColorBrush x:Name="MySolidColorBrush" Color="Green" />
      </Rectangle.Fill>
      <Rectangle.Triggers>
        <EventTrigger RoutedEvent="Page.Loaded">
          <BeginStoryboard>
            <Storyboard RepeatBehavior="Forever" AutoReverse="True">
              <DoubleAnimation 
                Storyboard.TargetName="MyRectangle"
                Storyboard.TargetProperty="Width"
                From="100" To="200" Duration="0:0:1" />              
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </Rectangle.Triggers>
    </Rectangle> 
  </StackPanel>
</Page>

效果如下；一個長方形持續在改變寬度；

WPF的動畫有一個比較有用的特性；就是它動畫結束會觸發一個事件；可在此事件執行一些需要的代碼；

以前開發體感項目時，因爲用戶用體感進行手勢操作，並不像鼠標鍵盤那麼自如，經常需要屏幕有明確的提示下一步操作；
以前做的體感進入下一級菜單是，用戶擡起手臂和身體成一個夾角，就觸發一個光圈動畫，動畫時間是30秒；30秒光圈從頭轉到尾；如果在30秒內，用戶放下手臂，就停止動畫，菜單停留在當前級；如果用戶一直保持擡起手臂和身體成一個夾角，光圈轉完後，觸發一個事件，在此事件中讀取下一級菜單文本，加載下一級菜單；進入到下一級菜單；