Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

Animate Everything - How to Use Animations with 60 FPS

Callstack Engineers via YouTube

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

Reviews

Start your review of Animate Everything - How to Use Animations with 60 FPS

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.