rive-react-native
rive-react-native copied to clipboard
feat: support custom onPress as well as prop to disable default behaviour for clicking on animation
Adding in this PR based on a requirement we had.
Sometimes wrapping the Rive component with a TouchableOpacity or other Touchable (Other than TouchableWithoutFeedback) would not work. Because the inner TouchableWithoutFeedback is taking priority.
Therefore adding a custom onPress prop which can be called when the animation is clicked, as well as an option to disable the default handling
Our Use Case:
- Animation has an onClick trigger
- We want to trigger another side effect when animation is clicked
- We cannot use a Touchable because it does not work
- So using the new onPress to call
riveRef.current?.setInputState
to trigger the animation as well as our side effect
The example Podfile.lock also seems to be using an older version of Rive, so this updated it.
Hi @ridwansameer thank you for the PR. We'll take a look at it, as it is helpful to be able to disable the touch inputs.
As a side note, you may find events more helpful for this use case if you want to trigger some side effect from an event that occurs in an animation (communication from animation to code). See here: https://help.rive.app/runtimes/rive-events
Yes we considered events, but we felt React native telling Rive what state to change to instead of RN doing its thing based on an event from Rive to be a bit more of a better event direction. Not sure if everyone would agree.
With regards to this PR, I noticed that the touch event still does go through on a different rive file even though I was using the updated code (With patch package). Wondering if there's some lower level onClick (maybe from the native side) that is triggering it