question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Using Animated.event with TapGestureHandler onHandlerStateChange doesn't work

See original GitHub issue

This is usage with react-native-reanimated.

I get this error:

Expected `onGestureHandlerStateChange` listener to be a function, instead got a value of `object` type.

Example:

const tapState = new Animated.Value(0);
const tapStateEvent = Animated.event([{ nativeEvent: { state: tapState } }]);
// ...
<TapGestureHandler onHandlerStateChange={tapStateEvent}>{...}</TapGestureHandler>

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:9
  • Comments:6

github_iconTop GitHub Comments

144reactions
mnmaraescommented, Nov 8, 2019

For future reference I was able to solve my problem by having the GestureHandler’s immediate child changed to a reanimated Animated.View

25reactions
koktavycommented, Dec 9, 2020

In the event that using Animated.View does not fix this issue, double-check your imports. I was mistakenly importing Animated from react-native instead of react-native-reanimated.

Read more comments on GitHub >

github_iconTop Results From Across the Web

TapGestureHandler not triggering onHandlerStateChange
I have a onHandlerStateChange event in TapGestureHandler . When the onHandlerStateChange is triggered, i want to change the opacity of a ...
Read more >
Using Animated.event with TapGestureHandler ...
Using Animated.event with TapGestureHandler onHandlerStateChange doesn't work ... This is usage with react-native-reanimated . I get this error:
Read more >
About Gesture Handlers | React Native ... - Software Mansion
Gesture handler components do not instantiate a native view in the view hierarchy. ... two gesture handlers using Animated.event is not currently supported....
Read more >
Animated - React Native
The Animated library is designed to make animations fluid, powerful, and painless to build and maintain. Animated focuses on declarative ...
Read more >
React Native Gesture Handler: Swipe, long-press, and more
dont 't forget to import Animated from react native ... Single-tap gesture with TapGestureHandler using React Native Gesture Handler.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found