如何为自定义组件旋转变换设置动画？

Question

鉴于以下情况：

<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>

这是一个新组件，它基本上是一个卡在 ViewBox 内部的精美标签（用于自动缩放标签），我需要将 Storyboard.TargetProperty 指向什么才能制作动画，比如，RotateTransform Angle 属性?

Answer 1

您的 TargetName 需要为您的 xfScale / xfRotate 命名变换设置。

您的目标属性将是所用变换的属性。

喜欢规模；

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 使这些东西 quicker/easier 变得更加容易，特别是对于复杂的动画。

希望这对您有所帮助，干杯。

如何为自定义组件旋转变换设置动画？

How do I animate a custom components Rotation Transformation?

c#

wpf

xaml

transformation

storyboard