如何对自定义组件旋转变换进行动画处理

本文关键字:换进 动画 处理 转变 旋转 自定义 组件 | 更新日期: 2023-09-27 18:34:24

给定以下内容:

<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 属性进行动画处理?

如何对自定义组件旋转变换进行动画处理

您的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 使这些东西比手工更快/更容易完成,特别是对于复杂的动画。

希望这有帮助,干杯。