Stack Overflow
Stack Overflow

Questions tagged [react-native-animatable]

For questions related to the react-native-animatable library that provides "declarative transitions and animations for React Native".

For questions related to the react-native-animatable library that provides "declarative transitions and animations for React Native".

120 questions
2
votes
1 answer

My Animated component doesn't run smoothly in react native

I am trying to add animation to my react native app. But it doesn't play smoothly on Android and IOS What should i do to solve this problem I already tried to run animation with Animated component. My react-native version is "0.57.8" And here is…
Mahdi
  • 1,355
  • 1
  • 12
  • 28
2
votes
1 answer

React Native - Filling background color with a transition

I have a view that i fill it with background color accordingly. For example if a user selects one item out of five components ,my view has to fill 20% with color. I have done the filling my view with color correctly. But as i cannot use transition…
CraZyDroiD
  • 6,622
  • 30
  • 95
  • 182
2
votes
0 answers

How to set click event of shape(ART) area in react native?

I need write click event of particular Shape which draw using react native ART. How can i achieve this ? can you please share your ideas or thought on this so can i worked on it. sectionAngles.map(section => ( …
Ap Android
  • 21
  • 3
2
votes
1 answer

Out/In animation on same element in React Native

I have a TextView which will fadeOutDown the old data and fadeInDown the new data on the next render. How do I accomplish this? I am using the react-native-animatable library and have managed to do one animation but don't know how to do…
khateeb
  • 5,265
  • 15
  • 58
  • 114
2
votes
0 answers

Warning: Failed prop type: Invalid prop `opacity` of type `object` supplied to `Image`, expected `number`

While running jest I am getting this strange warning stating console.error node_modules/fbjs/lib/warning.js:33 Warning: Failed prop type: Invalid prop `opacity` of type `object` supplied to `Image`, expected `number`. Bad object: { "position":…
Vinoth Kumar
  • 1,347
  • 1
  • 14
  • 23
2
votes
2 answers

React-native Animatable rotate view in onPress

I am trying to rotate my image when it's pressed using following: this.myView.transitionTo({ rotate: '180deg' }, 200); I get error: Invariant Violation: Transform with key of "rotate" must be a string: {"rotate":null} Using…
Niko
  • 8,093
  • 5
  • 49
  • 85
1
vote
0 answers

RN Animated.FlatList ScrollToIndex(0) causes Flashing Behaviour in Android

I'm trying to create a carousel with infinite looping on finite set of data using FlatList and am using ScrollToIndex to scroll to start when I reach the end and scroll to the end when I reach the start. However, scrollToIndex causes this weird…
tammi
  • 143
  • 2
  • 8
1
vote
1 answer

cannot read property of View & ScrollView while Wrapping component with R-N-animated

Im trying to implement someone code with my code and while implementing the code, I getting error about Animated.View and Animated.Scrollview is... I have already added react-native-animated library. you can see below code.. one thing I observered…
Jason0011
  • 444
  • 1
  • 6
  • 19
1
vote
1 answer

React naitve animation

1:I want to fill the image enter image description here with blue color animation inside the image jus like this enter image description here how can i do this?
Harsh Kumar
  • 29
  • 4
1
vote
0 answers

React Native Flatlist and 'react-native-animatable' - item's animation is triggered before the item is shown

I'm creating a carousel component that shows items one by one horizontally, using Flatlist. The items of Flatlist has their own animation that start automatically. My expectation is that the animation will start once the item is scrolled to. The…
Hoài Vũ Lê
  • 33
  • 3
1
vote
0 answers

Why does using Animated.createAnimatedComponent(Pressable) breaks my Pressable functionality?

I'm trying to animate a Pressable component which is why I'm trying to make it animatable like this: const AnimatedPressable = Animated.createAnimatedComponent(Pressable); And then use it instead of this:
Onyx
  • 5,186
  • 8
  • 39
  • 86
1
vote
0 answers

React native swipe animation not working and no error

I'm using a swipe animation, the same one that is being used in apps like tinder. The animation used to work in a Class component and in JSX but I had to change it to a function with hooks in TSX for a project. Now the animation Doensn't work…
RossePoeze
  • 31
  • 3
1
vote
2 answers

React Native Animation - Icon and App name

React Native: How do you animate the Image? i.e Image should Come from header and name should come from Bottom
Bhojani Asgar
  • 93
  • 1
  • 10
1
vote
0 answers

React Native: I want to make an animation, where I would like to move two lines consecutively around a button border. How do I do that using hooks?

I am a little new to the animation world of react-native. I am working on a react native application where I would like to show animation around a button. The animation should consist of two separate lines moving around the button border. How do we…
Jamal Butt
  • 73
  • 4
1
vote
0 answers

How to drag and drop images in the grid adjusting their positions in react native

I want to achieve the above drag and drop functionality in the grid, where images are also adjusting the position according to the sequence, images should be redraggable, so that they can be put in another column. I have explored a npm package…
Wahas Ali Mughal
  • 187
  • 2
  • 11
1 2
3
4 5 6 7 8