Summary
Keywords
Full Transcript
Have you ever felt the need to keep track of the pages you view on an Onboarding? Here it comes in handy to know how to make a custom pager from scratch. In this tutorial, we'll do exactly that by using Reanimated. My React Native course: https://reanimate.dev Shared 100+ Animations on Demos: https://reactiive.io/demos Twitter: https://twitter.com/reactiive_ Animate with Reanimated Playlist: https://www.youtube.com/watch?v=yz9E10Dq8Bg&list=PLjHsmVtnAr9TWoMAh-3QMiP7bPUqPFuFZ How to properly handle the scrollOffset? I explained that in detail in the Pager Dots Tutorial: https://youtu.be/04K3wPK2yC8 Source code: https://github.com/enzomanuelmangano/animate-with-reanimated/tree/main/src/animations/26-animated-bar-chart Chapters: 00:00 Introduction 01:33 Understanding the data 04:30 Weekly Bar Chart UI 11:43 Add the ScrollView 20:44 Bind the scroll offset to the active week index 25:22 Animate the Bar Chart 29:45 Adding the week letters 24:12 Animate the background colors 27:25 Final touches
