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.

The main concepts we’ll explore are:

  • useAnimatedScrollHandler
  • Animated ScrollView
  • interpolate

All the source code is fully available on GitHub: https://github.com/enzomanuelmangano/animate-with-reanimated

If you are new to Reanimated 2, I highly recommend you to check out my first video: https://youtu.be/yz9E10Dq8Bg

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

#react native #react native reanimated 2

Interpolate with ScrollView like a pro (React Native Reanimated 2)
1.85 GEEK