Trying to implement two or more animation inside a grid in uwp - xaml

Question

Trying to implement two animation which will run forever but not getting idea how to do here are my findings which i was trying
<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 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>
<Canvas x:Name="round_anima" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="-120,10,0,130" >
<Image x:Name="round_anima1" Canvas.ZIndex="2" Source="Assets/ic_round_animation.png" Height="120" Width="120">
<Image.Projection>
<PlaneProjection/>
</Image.Projection>
<Image.Triggers>
<EventTrigger RoutedEvent="Image.Loaded">
<BeginStoryboard>
<Storyboard x:Name="SpinAnimation1">
<DoubleAnimation To="360" From="0" RepeatBehavior="Forever" Duration="0:0:5" Storyboard.TargetName="round_anima"
Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationZ)"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</Image>
</Canvas>
</Grid>
but the storyboard containing second animation is not working.Any reference or idea regarding this issue.one can refer for image in given postenter link description here

Answer 1

but the storyboard containing second animation is not working.Any reference or idea regarding this issue.
The second animation should target round_anima1(image) instead of round_anima(canvas), you are defining a PlaneProjection on an image, not on Canvas.
I guess you want to rotate the second image(round_anima1) anticlockwise. You are doing it correctly, but since the second image is inside of ImageGrid, it's also rotating with the ImageGrid. Thus the second animation looks like it's not working.
To fix the problem, change Storyboard.TargetName="round_anima" to Storyboard.TargetName="round_anima1" and change To value from 360 to 720:
<Image x:Name="round_anima1" Canvas.ZIndex="2" Source="Assets/profiler.jpeg" Height="120" Width="120">
<Image.Projection>
<PlaneProjection />
</Image.Projection>
<Image.Triggers>
<EventTrigger RoutedEvent="Image.Loaded">
<BeginStoryboard>
<Storyboard x:Name="SpinAnimation1">
<DoubleAnimation To="720" From="0" RepeatBehavior="Forever" Duration="0:0:5" Storyboard.TargetName="round_anima1"
Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationZ)"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</Image>
Here is the result: