Questions tagged [react-native-reanimated-v2]
242 questions
4
votes
1 answer
Should I be using useEffect to animate on prop value change with React Native Reanimated?
I need a view to animate in to place when the value of some props change using Reanimated in React Native
I've only been able to find animating on, for example, a user tap using an onPress function to change the value of useSharedValue values. But I…
Kieron McKenna
- 75
- 6
4
votes
2 answers
How do i trigger a useEffect based on a sharedValue from the Reanimated libary
How do i trigger a useEffect based on a sharedValue from the Reanimated libary?
const sharedValue = useSharedValue(0);
useEffect(() => {
console.log("exectue functions");
}, [sharedValue.value]);
Is there a best practice for this. Or is…
dan_boy
- 1,735
- 4
- 19
- 50
4
votes
0 answers
Reanimated 2 compatibility with SDK 44
SDK Version: Expo 44.0.6
Platforms(Android/iOS/web/all): Android / iOS
Tested versions of react-native-reanimated : 2.2.4, 2.3.1, 2.4.1, 2.5.0
I recently upgraded my expo bare native workflow app from SDK41 to 44 (following all blog guidelines)…
David Fabreguette
- 972
- 1
- 8
- 14
4
votes
2 answers
TypeError: undefined is not an object (evaluating 'InnerNativeModule.installCoreFunctions')
my react-native project was running, but today i tired to run it on andorid it gived the the abouve Error TypeError: undefined is not an object (evaluating 'InnerNativeModule.installCoreFunctions'). tried alot of thing gradlew clean node modules…
Engr.Aftab Ufaq
- 3,356
- 3
- 21
- 47
4
votes
0 answers
Tried to synchronously call function from a different thread
When I try to formate date using dayjs or when I try to format currency using Intl.NumberFormat()
I've got the following error
Code sample
Could anyone help with this?
LikeJavaSCript
- 51
- 3
4
votes
3 answers
React Native App crashes when trying to debug remotely and does not work again unless re-installed
The Application was working fine until the installation of React-native-Reanimated library but has started to crash post installation when trying to debug remotely. It wouldn't even start again unless re-installed and shows this error:
Attempt to…
Anubhav Saxena
- 43
- 4
4
votes
1 answer
Reanimated 2 can't use withSequence with direct value
I want to use withSequence with a direct value as the first value, using the code bellow caused the app to crash.
animatedValue.value = withSequence(startValue, withTiming(endValue));
The bellow code seems to work perfectly but in my case, it…
LHDi
- 319
- 1
- 8
4
votes
1 answer
Smooth transitions with the new "Pressable" component?
I've been using TouchableOpacity for ease of use in my react native project, but I'm interested in trying the new Pressable component instead - given how flexible its API is.
However, while the new Pressable API gives me the ability to change things…
idolize
- 6,455
- 4
- 24
- 34
4
votes
2 answers
Call React Native code when reanimated SharedValue changes
I have a reanimated ReadOnly> that is derived from another SharedValue:
const solidHeader = useDerivedValue(() => {
return top.value <= -(height / 2);
});
I would like to call a RN function (non-reanimated) when…
Richard
- 828
- 1
- 8
- 28
4
votes
1 answer
React-native-reanimated 2: How do I update Text in response to PanGestureHandler?
Here is my component. It's a simple PanGestureHandler with some svg.
import React from 'react'
import { StyleSheet, View, Text } from 'react-native'
import Svg, { Circle, Line } from 'react-native-svg'
import Layout from '../constants/Layout'
import…
stkvtflw
- 12,092
- 26
- 78
- 155
4
votes
0 answers
Custom Drawer using Reanimated 2 useSharedValue and useAnimatedStyle
I am trying to implement drawing navigation like in the image above using react native reanimated 2.
import React, { useState } from 'react'
import { Text } from 'react-native'
import { createDrawerNavigator } from '@react-navigation/drawer'
import…
Khim Bahadur Gurung
- 626
- 9
- 19
4
votes
3 answers
How to create a dynamic array of React hooks for an array of components
const AnimatedText = Animated.createAnimatedComponent(Text);
function Component({ texts }) {
const [visitIndex, setVisitIndex] = React.useState(0);
// can't create an array of shared value for each text
// since useSharedValue is a hook, and…
mohsinulhaq
- 1,059
- 1
- 18
- 31
3
votes
1 answer
Set duration and delay when using withSpring in reanimated
I am very new to reanimated and have it working to a certain extent but I can not seem to add the duration of the animation. I would also like to add a delay but that is not as important as the duration. I am trying to change the opacity and its Y…
JulesUK
- 359
- 2
- 11
3
votes
1 answer
Issues ussing headerTransparet on Android
What I have
I'm trying to create a header animation with Native Stack Navigator. The animation consists of changing the background color from transparent to light gray when the user scrolls down.
The problem
Although the animation works as expected…
Cristian Flórez
- 2,277
- 5
- 29
- 51
3
votes
1 answer
I'm trying to animate a circle expanding, staying at maximum width and height for 4 seconds, then shrink again to original size, then repeat again
I'm trying to animate a 50px circle to expand to 100px over 2 seconds, then stay at 100px for 2 seconds before starting to shrink down to 50px over 2 seconds. Then repeat this indefinitely.
Currently I've nailed the expanding part, but I can't…
Onyx
- 5,186
- 8
- 39
- 86