<ComponentOne Studio for WPF下載>

之前我們介紹了兩種基礎的動畫，本文就接著來介紹Rotation動畫。

創建Rotation動畫

Rotation動畫和scaling動畫類似，它們都僅僅使用一個RotateTransform而不是ScaleTransform。而且類似scaling動畫，您可以自定義原點（RenderTransformOrigin），同樣也是easing功能。代碼參考：

<Style TargetType="c1:PlotElement" x:Key="styleRotate">
<Setter Property="RenderTransform">
<Setter.Value>
<RotateTransform Angle="180" />
</Setter.Value>
</Setter>
<Setter Property="RenderTransformOrigin" Value="0.5, 0.5" />
</Style>
<Storyboard x:Key="sbRotate">
<DoubleAnimation Storyboard.TargetProperty="(RenderTransform).Angle" Duration="00:00:01" To="1" c1:PlotElementAnimation.IndexDelay="0.5">
<DoubleAnimation.EasingFunction>
<BackEase EasingMode="EaseIn" Amplitude="5" />
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
</Storyboard>

Index Delay

如果您是應用任何之前提到的例子，由于附屬與IndexDelay屬性，需要注意所有的plot元素動畫。它允許您在每個點之間設置一個延遲時間。它會創建escalating動畫效果，這對于Column、bar、pie和scatter圖表都是可用的（它對Area或是Line圖表沒有實際效果）。

例如我們來再次看看scaling動畫，這次我們設置IndexDelay屬性給每一個動畫對象，去創建我們的延遲。代碼參考：

<Style TargetType="c1:PlotElement" x:Key="styleScale">
<Setter Property="RenderTransform">
<Setter.Value>
<ScaleTransform ScaleX="0" ScaleY="0" />
</Setter.Value>
</Setter>
<Setter Property="RenderTransformOrigin" Value="0.5, 0.5" />
</Style>
<Storyboard x:Key="sbScale">
<DoubleAnimation Storyboard.TargetProperty="(RenderTransform).ScaleX" Duration="00:00:01" From="0" To="1"
c1:PlotElementAnimation.IndexDelay="0.5">
<DoubleAnimation.EasingFunction>
<CubicEase EasingMode="EaseInOut" />
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetProperty="(RenderTransform).ScaleY" Duration="00:00:00" From="0" To="1">
<DoubleAnimation.EasingFunction>
<CubicEase EasingMode="EaseInOut" />
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
</Storyboard>

本文所介紹的示例代碼： 

PS: 關于ComponentOne，這些產品你可以關注>>

本文轉載自

葡萄城經典UI產品新年大促，驚喜折扣禮品送不停！優惠詳情點擊查看>>

新年新禧新氣象，送禮送福送優惠！優惠詳情點擊查看>>