trying to rotate a circle continuously in clockwise direction in UWP xaml

问题

I have implemented the structure that is rotating continuously in clockwise direction and now want to implement small circle attached along with it which should also rotate along the same direction in which pointed structure is rotating. Code for that are given below.

XAML

<Grid Name="mainGridView">
        <Grid.Background>
            <ImageBrush  ImageSource="Assets/info_bg.png"/>
        </Grid.Background>
        <Grid.RowDefinitions>
            <RowDefinition x:Name="rowDefSubjectHeadingGrid" Height="1*"/>
            <RowDefinition x:Name="rowDefSubjectListGrid" Height="4.4*"/>
            <RowDefinition x:Name="rowDefButtonGrid" Height="1*"/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0" Background="#339FFE">
            <Image Source="Assets\ic_nytra_logo.png" HorizontalAlignment="Left"  Stretch="Fill" Width="84" Height="72" 
                    Margin="10,0,0,0"/>
            <Image Source="Assets\ic_setting.png" HorizontalAlignment="Right" VerticalAlignment="Top"  Stretch="Uniform" Width="49" Height="49" 
                    Margin="0,10,15,0"/>
        </Grid>
        <Grid Grid.Row="1">
            <Image Stretch="Uniform" Name="Display" HorizontalAlignment="Center" Source="Assets/ic_out_circle.png" Width="230">
                <Image.Projection>
                    <PlaneProjection/>
                </Image.Projection>
            </Image>
        </Grid>
        <Grid Grid.Row="2" Background="#339FFE">
        </Grid>
    </Grid>

CS

public sealed partial class MainPage : Page
{
    private Storyboard rotation = new Storyboard();

    public MainPage()
    {
        this.InitializeComponent();
        DoubleAnimation animation = new DoubleAnimation();
        animation.From = 0.0;
        animation.To = 360.0;
        // animation.BeginTime = TimeSpan.FromSeconds(1);
        animation.RepeatBehavior = RepeatBehavior.Forever;
        animation.Duration = TimeSpan.FromSeconds(15);
        Storyboard.SetTarget(animation, Display);
        Storyboard.SetTargetProperty(animation, "(UIElement.Projection).(PlaneProjection.Rotation" + "Z" + ")");
        rotation.Children.Clear();
        rotation.Children.Add(animation);
        rotation.Begin();
    } 
}

Image given below

回答1:

i got the solution

<Grid x:Name="ImageGrid" Grid.Row="1">
            <Grid.Projection>
                <PlaneProjection/>
            </Grid.Projection>            
            <Ellipse VerticalAlignment="Center" Margin="10,-266,10,10" Fill="Orange" Height="47" Width="47" StrokeThickness="5" />
            <Ellipse VerticalAlignment="Center" Margin="147,-240,10,0" Fill="#E84C3D" Height="47" Width="47" StrokeThickness="5"/>
            <Ellipse VerticalAlignment="Center" Margin="245,-134,10,10" Fill="Orange" Height="47" Width="47" StrokeThickness="5" />
            <Ellipse VerticalAlignment="Center" Margin="285,2,10,10" Fill="Orange" Height="47" Width="47" StrokeThickness="5" />
            <Ellipse VerticalAlignment="Center" Margin="254,134,10,10" Fill="Orange" Height="47" Width="47" StrokeThickness="5" />
            <Ellipse VerticalAlignment="Center" Margin="147,240,10,0" Fill="#E84C3D" Height="47" Width="47" StrokeThickness="5"/>
            <Ellipse VerticalAlignment="Center" Margin="10,286,10,10" Fill="Orange" Height="47" Width="47" StrokeThickness="5" />
            <Ellipse VerticalAlignment="Center" Margin="-130,252,0,10" Fill="Orange" Height="47" Width="47" StrokeThickness="5" />
            <Ellipse VerticalAlignment="Center" Margin="-239,146,0,10" Fill="Orange" Height="47" Width="47" StrokeThickness="5" />
            <Ellipse VerticalAlignment="Center" Margin="-266,10,10,10" Fill="Orange" Height="47" Width="47" StrokeThickness="5" />
            <Ellipse VerticalAlignment="Center" Margin="-232,-122,10,10" Fill="Orange" Height="47" Width="47" StrokeThickness="5" />
            <Ellipse VerticalAlignment="Center" Margin="-130,-238,10,0" Fill="#E84C3D" Height="47" Width="47" StrokeThickness="5"/>
            <Image  x:Name="ImageBlock" Source="Assets/ic_out_circle.png" HorizontalAlignment="Center" Stretch="Uniform" Width="230">            
            <Image.Triggers>
                    <EventTrigger RoutedEvent="Image.Loaded">
                        <BeginStoryboard>
                            <Storyboard x:Name="SpinAnimation">
                                <DoubleAnimation To="0" From="360" RepeatBehavior="Forever" Duration="0:0:5"  Storyboard.TargetName="ImageGrid"
                Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationZ)"/>                 
                            </Storyboard>                                             
                        </BeginStoryboard>
                    </EventTrigger>
                </Image.Triggers>
            </Image>
</Grid>

来源：https://stackoverflow.com/questions/39953056/trying-to-rotate-a-circle-continuously-in-clockwise-direction-in-uwp-xaml