Overview
Explore the world of React Native animations in this 42-minute conference talk from React Native EU 2021. Dive into various animation solutions including Animated, Reanimated 2, and Lottie, with detailed code examples and recommended use cases. Learn to animate image list headers, change element properties on scroll, and control Lottie animations programmatically. Discover techniques to achieve smooth 60fps animations across all devices. Presented by Alexander Kuttig, owner of Horizon Alpha, this comprehensive talk covers topics from basic animation concepts to advanced techniques using worklets, hooks, and shared values in Reanimated 2.
Syllabus
Intro
Why animations?
The animation problem in RN
Animations in React Native
Simple Example
Scroll Example
Use useNativeDriver
Advanced Example
Summary
Creating Lottie Animations
Introducing Worklets
Using Hooks
Shared Values
Reanimated 2 2
Useful Links
Taught by
Callstack Engineers