Questions tagged [react-native-reanimated-v2]
242 questions
0
votes
0 answers
Optimizing a react-native-reanimated animation for low end devices
I'm looking for some advice optimizing this component. It's my first time working with react-native-reanimated (v 2.14.4).
Client wants this ID card to constantly move as a security measure. After a few loops, it seems to run really badly on a low…

warm__tape
- 250
- 4
- 19
0
votes
0 answers
I get error "TypeError: Cannot read property 'createNode' of null, js engine: hermes" and " Invariant Violation: "main" has not been registered."
The steps I have used
npm install react-native-reanimated-carousel
then installed
npm install react-native-gesture-handler and npx expo install react-native-reanimated
then I edited my App.js to add GestureHandlerRootView
const Stack =…

Pragyan
- 349
- 2
- 14
0
votes
0 answers
Create a Tab component with react-native-gesture-handler that can accept a list of Flatlist as childs
I wanted to create a generic and simple tab component that can accept a list of ReactNode and to be able to swipe horizontally through 3 full screen pages.
It worked well until I needed to pass 3 FlatList (one on each page) to this component.
The…

Thibaut
- 1
- 1
0
votes
0 answers
translateX and translateY defined multiple times in one transform style
Here is piece of animated style code for a pinch action with React Native gesture handler 2.x/React Native reanimated 2.x.
export default Swipe = ({route, navigation}) => {
const { width, height } = Dimensions.get("window");
const…

user938363
- 9,990
- 38
- 137
- 303
0
votes
0 answers
RN Reanimated: exisiting animation on element removed from list
I'm struggling with the existing prop of Layout Animations of react-native-reanimanted and removing an element from a list of components... The idea is easy, when you press the Remove button the element pressed is removed from the list using the…

Rendres
- 133
- 3
- 12
0
votes
0 answers
Animated Gesture Handler React Native update state
Im trying to create a state where I save my value whenever the Gesture is onActive.
I need the value so I can find the index of my snapPoints and then use that index to find my current value.
const usePanGestureHandler = (snapPoints) => {
const…

Strike
- 77
- 1
- 7
0
votes
0 answers
Logging values inside a gesture event listener in React Native Reanimated
I have a Gesture Pan handler that I'd like to log the values of into the console as I move it around. I wanted to know if there was a better way apart from using RunOnJS to console.log values out, or if there is a better practise to follow when…

Irfan S
- 267
- 5
- 14
0
votes
1 answer
How to set activeOffsetX of PanGestureHandler in react native
I have a list of messages and I'm making feature swipe to reply using PanGestureHandler, I want to limit area swipeable by props activeOffsetX, how can I achieve this?enter image description here
> enabled={!isInfoText}
>…

Hien
- 1
- 1
0
votes
0 answers
react native gesture handler example not rendering multiple balls + coordinate mismatch
React Native Gesture Handler has a tutorial here that describes a simple ball animation.
From their code on github, I modified the example slightly to allow multiple balls to spawn from a tap gesture at the top level. However, the balls are not…

septimir
- 41
- 2
0
votes
1 answer
React-Native Error: Tried to synchronously call function {withSpring} from a diffreent thread
there is small part of my code throwing error on some of devices with possible solutions:
a) If you want to synchronously execute, mark it as a Worklet
b) If you want to execute this method on JS thread, wrap it using runOnJS.
Error appear only on…

quietpinkpanther
- 1
- 1
0
votes
0 answers
React Native Reanimate~2.14.4 not working on new screen
I want the view to move to the left when the screen is loaded off the stack, however it does not do the animation; although it does do the translation. I have used almost identical code to the ones in the docs so I am lost for ideas. When I add a…

Jordan Shuhandler
- 21
- 3
0
votes
1 answer
withSpring doesn't work correctly when SharedValue is an object
I'm trying to use a SharedValue from react-native-reanimated2 to store an object (box positions). The object is of the following shape:
boxPositions.value = {
[boxId]: {x: 0, y: 0}
...
}
My goal is to update the object in the SharedValue so…

Shnick
- 1,199
- 1
- 13
- 32
0
votes
0 answers
test react-native reanimated with useDeriveValue
I have a component that gets a goBack function as a param
the component effector animation (with react-native-reanimated-2) when the user press on any button,
after the animation is finished I call to goBack function.
I track on isOpen value with…

Yoel
- 7,555
- 6
- 27
- 59
0
votes
0 answers
is useAnimatedGestureHandler still valid with react-native-gesture-handler in 2023
I am concerned about the proper way of using react-native-gesture-handler, the documentation says that Gesture Handlers are deprecated and I should be using GestureDetector, the context is that I need to combine gestures, and when I try to do it…

seven
- 1,183
- 14
- 33
0
votes
0 answers
View Manager Error during going back React Native Vision Camera
When users clicks a button, i am navigating user to new screen. In the new screen a camera opens by using react native vision camera. But when i am pressing back buttons "View Manager for tag" error is showing instead going back to previous screen.
…

Tanvir Rahman
- 651
- 1
- 11
- 31