3. Animations

Animate Framework Elements

<!-- FadeInAnimation -->
<Grid Style="{StaticResource FadeInAnimation}">
     <!-- Your grid content goes here -->
</Grid>

Built in Animations

Key	Type	Description
FadeInAnimation	Style	Applies a fade-in animation to a FrameworkElement when loaded. The element's opacity increases from 0 to 1 within 0.3 seconds.
FadeInFromLeftAnimation	Style	Creates a fade-in from the left animation for a FrameworkElement. The element's opacity increases from 0 to 1 and moves from -50 to 0 in the X direction within 0.3 seconds.
FadeInFromTopAnimation	Style	Creates a fade-in from the top animation for a FrameworkElement. The element's opacity increases from 0 to 1 and moves from -50 to 0 in the Y direction within 0.3 seconds.
FadeInFromRightAnimation	Style	Creates a fade-in from the right animation for a FrameworkElement. The element's opacity increases from 0 to 1 and moves from 50 to 0 in the X direction within 0.3 seconds.
FadeInFromBottomAnimation	Style	Creates a fade-in from the bottom animation for a FrameworkElement. The element's opacity increases from 0 to 1 and moves from 50 to 0 in the Y direction within 0.3 seconds.