Master React Native Animations Simple, easy to follow, step-by-step lessons for every type of animation

I want you to be completely satisfied. If you want more explanation or I'm missing something, I'll make more videos/tutorials. If you aren’t totally happy with your purchase within 30 days, I will happily refund your money entirely.

React Native is used by industry leading companies like Facebook, Airbnb, and Uber. You, too, can master the same animated library used every day at these companies.

All source code of every animation is provided, cloneable, and interactive on Expo. Test every demo on your phone instantly with Expo.

And many more...

Use interpolation to animate the width/height percentage of a view with Animated.timing.

Use interpolation to animate the rotation of a view with Animated.timing.

Use interpolation to animate the colors of a view with Animated.timing.

Control the position and layout of a view using absolute position and Animated.timing.

Control the size and layout of a view using width/height values and Animated.timing.

Control the position of a view using translate transform and Animated.timing.

Control the size of a view using scale transform and Animated.timing.

Control the visibility of a view using the opacity style and Animated.timing

The basics includes videos and articles on animating all style properties of React Native elements. We also go over each Animated method, how to use them, and how to combine methods to create more complex animations.

And many more...

We'll demonstrate what an interrupted animation looks like, and how to handle it.

We'll show case the pointer events technique, to prepare us to use it with real world animations.

We'll walk using state and the start callback to create pseudo unmounting animations while also handling interrupted animations.

Understanding .99 cliffs is essential to understanding how to build immediate animations while maintaining their declarative structure.

We will cover all uses of interpolate extrapolate. This is just one example of a mixed extrapolateLeft/extrapolateRight that we cover.

Some unique animations require rotations. We'll show how to rotate different axes using rotateX and rotateY with interpolate.

Color changing is another big use case with Animated. We'll cover how to change colors, background colors, and just alpha channels

Interpolating numbers is a crucial piece to crafting animated. We'll cover multiple examples, including interpolating interpolations.

In our advanced work, we dive into complex topics with Animated including interpolation, PanResponder, gestures, and techniques to help construct more complex animations. We’ll also explore how Animated works, rebuild animations, and animate SVGs.

Part 3: Real World (20+ videos)

Understanding animations aren’t worth anything unless you can apply them to real world ideas. In this section we start with basic animations and slowly work our way up to complex concepts like “Shared Element Transitions”.

Each video comes with a separate animated breakdown. We will talk through the concepts of each animated piece that builds up to make that animation.