Interpolate with ScrollView like a pro (React Native Reanimated 2)
In this tutorial, we’ll unleash the power of the interpolate function from the Reanimated package. In order to do that, we are going to build an amazing animation with an Animated ScrollView.
Written article: https://reactiive.io/articles/interpo...
My React Native animations course: https://reanimate.dev
Shared 100+ Animations on Demos: https://reactiive.io/demos
Twitter: / reactiive_
Source code: https://github.com/enzomanuelmangano/...
The main concepts we'll explore are:
useAnimatedScrollHandler
Animated ScrollView
interpolate
If you are new to Reanimated 2, I highly recommend you to check out my first video: • Introduction to React Native Reanimated 2
Chapters:
00:00 Introduction
00:55 Setup ScrollView and Pages
08:34 The translateX value
13:44 Let's start to interpolate
21:53 The text animations
28:15 Final touches