What versions of Reanimated does this skill support?

This skill focuses on Reanimated 2 and 3, utilizing the modern Shared Value API, worklets, and useAnimatedStyle hooks.

How does this skill help with animation performance?

It provides patterns that ensure animations run on the UI thread, preventing frame drops caused by heavy JavaScript execution.

Does this skill work with Expo projects?

Yes, it includes patterns specifically compatible with Expo, including installation commands and babel configuration requirements.

Can it help with gesture-based interactions?

Yes, it includes boilerplate and logic for integrating React Native Gesture Handler with Reanimated for interactive, physics-based UI.

Reanimated Animation Patterns

Name: Reanimated Animation Patterns
Author: IvanTorresEdge

byIvanTorresEdge

Mobile Development

Implements high-performance, 60fps React Native animations using standardized Reanimated and Gesture Handler patterns.

About

This skill provides specialized guidance for implementing complex, fluid animations in React Native applications using the Reanimated library. It simplifies the creation of gesture-based interactions, layout transitions, and high-performance UI thread animations by providing standardized patterns for shared values, animated styles, and interpolation. By leveraging worklets and UI-thread execution, this skill helps developers build professional-grade mobile interfaces that remain responsive under heavy interaction, ensuring optimal frame rates across both iOS and Android platforms.

Key Features

Entering, exiting, and layout transition presets
Worklet-based custom animation implementation
High-performance UI thread animation patterns
Complex gesture-based interaction logic
Shared value and animated style synchronization
0 GitHub stars

Use Cases

Implementing interactive drag-and-drop or swipe-to-dismiss UI
Building fluid onboarding carousels and screen transitions
Optimizing list item transitions using Layout Animations

About

Key Features

Entering, exiting, and layout transition presets
Worklet-based custom animation implementation
High-performance UI thread animation patterns
Complex gesture-based interaction logic
Shared value and animated style synchronization
0 GitHub stars

Use Cases

Implementing interactive drag-and-drop or swipe-to-dismiss UI
Building fluid onboarding carousels and screen transitions
Optimizing list item transitions using Layout Animations