We'll use the interpolate function from an Animated.Value to transition the background color of an Animated.View. We'll simultaneously translate the position with the same Animated.Value.
In this lesson we will use Animated.timing to animate the opacity and height of a View in our React Native application. This function has attributes that you can set such as easing and duration.
In this lesson we will use Animated.spring and TouchableWithoutFeedback to animate the scale of a button in our React Native application. We will use the scale transform property and see how adjusting the friction of a spring will effect the spring animation.
In this lesson we'll create a PanResponder to allow us to drag a card around the screen. We'll use Animated.event to automatically set the values of our Animated.Value and when the card is released we'll use Animated.decay to decelerate it to a stop.
In this lesson we'll use Animated.sequence to play multiple Animated.timing, and Animated.spring animations one after another.
In this lesson we'll use Animated.stagger to stagger Animated.timing animations that animate the height of a React Native view every 300 milliseconds.
In this lesson we'll use Animated.parallel to animate multiple Animated.timing and Animated.spring animations at the same time.
Liked this content?
Get notified more about React Native!
No Spam! We Promise!