Jerky animation when using withTiming with GestureDetector in React Native #3038
Unanswered
onigiri-w2
asked this question in
Q&A
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Description
I'm encountering an issue with React Native animations using
react-native-reanimated
andreact-native-gesture-handler
. The problem specifically affects width animations driven bywithTiming
, but not translate animations. When I run awithTiming
animation on a shared value used for width and simultaneously tap aGestureDetector
, the width animation becomes jerky. Interestingly, translate animations using the same setup remain smooth.Expected Behavior
Both width and translate animations should remain smooth regardless of tapping on the
GestureDetector
.Actual Behavior
GestureDetector
during the animation. The width change of the green box becomes visibly choppy.GestureDetector
.Environment
Reproduction
You can reproduce this issue using this Expo Snack: Jerky Animation Demo
Steps to reproduce:
Note: This issue is particularly noticeable when running the app on a physical iOS device using Expo Go. The problem is much more pronounced in this environment compared to the web or simulator versions.
Code Sample
I've created a minimal reproducible example in the Expo Snack. Here's the key part of the code:
Questions
Any insights or suggestions would be greatly appreciated. Thank you in advance for your help!
Beta Was this translation helpful? Give feedback.
All reactions