开发者

WPF - How do I make a UI element animate along a path of an ellipse?

I h开发者_StackOverflow中文版ave a canvas that contains a couple other elements. I need this canvas to animate continuously along a circular (elliptical) path.

How can I do this in XAML?


not sure if this is doing it the hard way or not but this works...

<Canvas>
    <Rectangle Height="30" Width="30" Fill="Blue">
        <Rectangle.RenderTransform>
            <MatrixTransform x:Name="elementMatrixTransform">
                <MatrixTransform.Matrix >
                    <Matrix />
                </MatrixTransform.Matrix>
            </MatrixTransform>
        </Rectangle.RenderTransform>
        <Rectangle.Triggers>
            <EventTrigger RoutedEvent="Rectangle.Loaded">
                <BeginStoryboard>
                    <Storyboard>
                        <MatrixAnimationUsingPath
                            Storyboard.TargetName="elementMatrixTransform"
                            Storyboard.TargetProperty="Matrix"
                            Duration="0:0:10"
                            RepeatBehavior="Forever">
                            <MatrixAnimationUsingPath.PathGeometry>
                                <PathGeometry>
                                    <PathFigure StartPoint="0,50">
                                        <ArcSegment Point="50,0" Size="50,50" SweepDirection="Clockwise"></ArcSegment>
                                        <ArcSegment Point="100,50" Size="50,50" SweepDirection="Clockwise"></ArcSegment>
                                        <ArcSegment Point="50,100" Size="50,50" SweepDirection="Clockwise"></ArcSegment>
                                        <ArcSegment Point="0,50" Size="50,50" SweepDirection="Clockwise"></ArcSegment>
                                    </PathFigure>
                                </PathGeometry>
                            </MatrixAnimationUsingPath.PathGeometry>
                        </MatrixAnimationUsingPath>

                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Rectangle.Triggers>
    </Rectangle>
</Canvas>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜