2016-02-11 81 views
1

考慮以下幾點:如何爲自定義組件旋轉轉換創建動畫?

<Viewbox> 
    <Foo:Bar 
     x:FieldModifier="private" 
     x:Name="fooBar" 
     HorizontalAlignment="Center" 
     VerticalAlignment="Center" 
     RenderTransformOrigin="0.5,0.5"> 
     <Foo:Bar.RenderTransform> 
      <TransformGroup> 
       <ScaleTransform 
        x:FieldModifier="private" 
        x:Name="xfScale"/> 
       <RotateTransform 
        x:FieldModifier="private" 
        x:Name="xfRotate"/> 
      </TransformGroup> 
     </Foo:Bar.RenderTransform> 
     <Foo:Bar.Style> 
      <Style TargetType="{x:Type Foo:Bar}"> 
       <Style.Triggers> 
        <DataTrigger 
         Binding="{ 
          Binding Flip, 
          RelativeSource={ 
           RelativeSource AncestorType={ 
            x:Type local:myFooBar}}}" 
         Value="True"> 
         <DataTrigger.EnterActions> 
          <BeginStoryboard> 
           <Storyboard> 
            <DoubleAnimation 
             Storyboard.TargetProperty=""/> 
           </Storyboard> 
          </BeginStoryboard> 
         </DataTrigger.EnterActions> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </Foo:Bar.Style> 
    </Foo:Bar> 
</Viewbox> 

這是一個新的組件,基本上是卡住內視框(自動縮放標籤)看中的標籤,我需要做什麼來點Storyboard.TargetProperty的是能夠動畫,例如,RotateTransformAngle屬性?

回答

1

您需要爲您的xfScale/xfRotate命名轉換設置TargetName

您的TargetProperty將是所使用轉換的屬性。

Like for Scale;

Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"

Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"

除了只有指定屬性,你還需要提供一個Value動畫來。所以就整體而言,它會變成類似的東西;

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="xfScale" 
           Storyboard.TargetProperty="X"> 
    <SplineDoubleKeyFrame KeyTime="0:0:0.2" Value="0" /> 
</DoubleAnimationUsingKeyFrames> 

或對於旋轉你需要你的Angle屬性。值得一提的是,Blend使得這些東西比手動更快更容易,特別是對於複雜的動畫。

希望這會有所幫助,歡呼聲。

+0

在想你的建議,我收到在編譯時出現以下異常: '錯誤\t \t targetName屬性不能在風格Setter.' – Will

+0

也可以設置 - 我要把這在混合了一槍;謝謝你的提示。 – Will

+1

哦,對,你可以期待。在這個例子中,你不需要樣式,直接將DataTrigger作爲Interaction.Trigger應用於'Foo:Bar'而不是Style.Trigger,或者因爲它是WPF,你應該可以做Foo:Bar .Triggers –