3D and Canvas-Based Animations with Reanimated
summary
Shows a working pipeline that renders a rotating 3D cube rendered with ExpoGL using vertex and fragment shaders, then animates it by updating the projection matrix from Reanimated so animation runs on the UI thread without bridge latency. Demonstrates setup with two commands, how to plug shared values into shader uniforms, gesture-driven rotations via Gesture Handler, loading full 3D models through Expo three (threejs) instead of hand authoring vertices, and integrating Skia surfaces with Reanimated for canvas effects.
AI-written summary · about
chapters (9)
- 0:00Introduction and background
- 2:14Exploring Expo GL for 3D
- 7:17Shaders and visual effects
- 9:31Animating 3D cubes with Reanimated
- 13:06Using Three.js with Expo GL
- 15:13Animated sensor and 3D movement
- 16:20Skia integration for animations
- 17:24Gestures and Reanimated API
- 18:08Closing and thanks
related talks
10m3D Experiences in React Native With Expo-GL
27m3D graphics in React & React Native using React-three-fiber
32mAnimations Should Be Fun
31mThe Future of Web Animation
35mAnimations and gesture handling in React Native and native languages
26mUsing lit APIs to make dope games with Expo
36mMake Your Apps Move! Awesome Animations with React Native ⚡️
29mIt all starts with navigation