silverlight中擺擺動動畫

Question

嗨我想從中心開始動畫，然後像蹺蹺板一樣擺動。 Basiclly，這是我在XAML中發佈的內容，但我無法正常工作。

<Storyboard x:Name="wiggleAnimation" > 
     <DoubleAnimation Storyboard.TargetName="rotateSlider" 
         Duration="0:0:1" To="20" 
         Storyboard.TargetProperty="Angle"> 
     </DoubleAnimation> 
     <DoubleAnimation Storyboard.TargetName="rotateSlider" 
         Duration="0:0:1" To="-20" 
         RepeatBehavior="Forever" 
         AutoReverse="True" 
         Storyboard.TargetProperty="Angle"> 
     </DoubleAnimation> 
    </Storyboard> 

我應該使用Keyframes嗎？動畫開始後如何改變它的持續時間？也許我應該使用其他方法？

Answer 1

你可以做的是從-20到+20創建一個動畫，但在中間開始動畫。

<Storyboard x:Name="wiggleAnimation" > 
    <DoubleAnimation Storyboard.TargetName="rotateSlider" 
        Duration="0:0:2" From="-20" To="20" 
        RepeatBehavior="Forever" 
        AutoReverse="True" 
        Storyboard.TargetProperty="Angle"> 
    </DoubleAnimation> 
</Storyboard> 

和代碼啓動動畫：

wiggleAnimation.Begin(); 
wiggleAnimation.Seek(TimeSpan.FromSeconds(1)); 

編輯： 或者，您可以創建兩個動畫，針對兩種不同的變換：

<Button Content="Click" Click="button_Click" RenderTransformOrigin="0.5 0.5" > 
    <Button.RenderTransform> 
     <TransformGroup> 
      <RotateTransform x:Name="rotateSlider" /> 
      <RotateTransform x:Name="rotateSlider2" /> 
     </TransformGroup> 
    </Button.RenderTransform> 
</Button> 

現在您動畫兩者的RotateTransforms在同一時間：

<Storyboard x:Name="wiggleAnimation" 
      RepeatBehavior="Forever" 
      AutoReverse="True" 
      Duration="0:0:3" > 
    <DoubleAnimation Storyboard.TargetName="rotateSlider" 
        Duration="0:0:1" From="0" To="20" 
        Storyboard.TargetProperty="Angle"> 
    </DoubleAnimation> 
    <DoubleAnimation Storyboard.TargetName="rotateSlider2" 
        Duration="0:0:2" From="0" To="-40" 
        BeginTime="0:0:1" 
        Storyboard.TargetProperty="Angle"> 
    </DoubleAnimation> 
</Storyboard> 

使用這種方法，您無需在開始之前將故事板查找到中間位置。這些方法中的任何一種都可以幫助您實現您期望的目標。

此外，爲了使動畫看起來更自然一點，您可能需要應用EasingFunction。