What's the best way to do sprite sheet animation?
Posted: 08 Aug 2017, 17:21
Hi,
I need to do much sprite sheet animation in NoesisGUI, so I'd like to find some way to do this more efficient.
From the official tutorial, I can use following code snippet to achieve this animation:
But the method would draw bunch of Rectangles for each frame, maybe just draw one rectangle and animate its Fill property would be better?
I need to do much sprite sheet animation in NoesisGUI, so I'd like to find some way to do this more efficient.
From the official tutorial, I can use following code snippet to achieve this animation:
Code: Select all
<Storyboard RepeatBehavior="Forever">
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="aladin_sprite_01"
Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0:0:0.00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
<DiscreteObjectKeyFrame KeyTime="0:0:0.05">
<DiscreteObjectKeyFrame.Value>
<Visibility>Hidden</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
...
</Storyboard>
...
<Grid>
<Rectangle x:Name="aladin_sprite_01" Fill="{StaticResource aladin01}" Width="33" Height="54"
HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Visible"/>
<Rectangle x:Name="aladin_sprite_02" Fill="{StaticResource aladin02}" Width="33" Height="54"
HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Hidden"/>
...
</Grid>
Code: Select all
<Storyboard RepeatBehavior="Forever">
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="aladin"
Storyboard.TargetProperty="Fill">
<DiscreteObjectKeyFrame KeyTime="0:0:0.00" Value="{Binding Source={StaticResource aladin01}}" />
<DiscreteObjectKeyFrame KeyTime="0:0:0.10" Value="{Binding Source={StaticResource aladin02}}" />
<DiscreteObjectKeyFrame KeyTime="0:0:0.20" Value="{Binding Source={StaticResource aladin03}}" />
<DiscreteObjectKeyFrame KeyTime="0:0:0.30" Value="{Binding Source={StaticResource aladin04}}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
...
<Grid>
<Rectangle x:Name="aladin" Width="33" Height="54" />
</Grid>