时间戳

首页 > 解决方案 > WPF：如何通过 bool 类型的 DependencyProperty DataTrigger 路径动画？

wpf - WPF：如何通过 bool 类型的 DependencyProperty DataTrigger 路径动画？

问题描述

在过去的一周里，我徒劳地试图找到一种触发路径动画的方法。

我想要做的是使用在我的 ViewModel 中定义的布尔属性，这样当这个值为真时，一个矩形将沿着路径移动。

起初我以为这很容易，但...

我发现的路径动画演示会通过 RoutedEvent 触发故事板，例如单击按钮或 Button.Loaded 等，而我没有办法通过 DependencyProperty 触发它。

我是 WPF 的新手，在此先感谢您！

代码在这里：

    <!--I define a rectangle which is expected to be auto-moving along the path when "Monitoring" is set true. -->
    <Rectangle Width="20" Height="10" Fill="LightBlue">
        <Rectangle.RenderTransform>
            <MatrixTransform x:Name="RectangleMatrixTransform">
                <MatrixTransform.Matrix >
                    <Matrix />
                </MatrixTransform.Matrix>
            </MatrixTransform>
        </Rectangle.RenderTransform>
        <Rectangle.Style>
            <Style TargetType="Rectangle">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Monitoring}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <!--Here I got compile exception: 'TargetName property cannot be set on a Style Setter.'-->
                                    <MatrixAnimationUsingPath
                                        Storyboard.TargetName="RectangleMatrixTransform"
                                        Storyboard.TargetProperty="Matrix"
                                        DoesRotateWithTangent="True"
                                        Duration="0:0:5" 
                                        RepeatBehavior="Forever" >
                                        <MatrixAnimationUsingPath.PathGeometry>
                                            <PathGeometry Figures="M 10,100 C 35,0 135,0 160,100 180,190 285,200 310,100" 
                                                  PresentationOptions:Freeze="True" />
                                        </MatrixAnimationUsingPath.PathGeometry>
                                    </MatrixAnimationUsingPath>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Rectangle.Style>
    </Rectangle>
</Canvas>

顺便说一句，WPF 很强大但真的很艰难 :(

标签： wpfxamlanimationdatatrigger

解决方案

只需放下Storyboard.TargetName并使用Storyboard.TargetProperty="RenderTransform.Matrix"：

<Rectangle Width="20" Height="10" Fill="LightBlue">
    <Rectangle.RenderTransform>
        <MatrixTransform />
    </Rectangle.RenderTransform>
    <Rectangle.Style>
        <Style TargetType="Rectangle">
            <Style.Triggers>
                <DataTrigger Binding="{Binding Monitoring}" Value="True">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <MatrixAnimationUsingPath
                                    Storyboard.TargetProperty="RenderTransform.Matrix"
                                    DoesRotateWithTangent="True"
                                    Duration="0:0:5" 
                                    RepeatBehavior="Forever" >
                                    <MatrixAnimationUsingPath.PathGeometry>
                                        <PathGeometry Figures="M 10,100 C 35,0 135,0 160,100 180,190 285,200 310,100" />
                                    </MatrixAnimationUsingPath.PathGeometry>
                                </MatrixAnimationUsingPath>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Rectangle.Style>
</Rectangle>

推荐阅读