Closed hesselberg closed 5 years ago
Hey @hesselberg,
Do any of the props change on the animateOnUpdate
prop will only trigger the animation if the component updates. If no props on the component change, then it's not updating, and the animation will not fire.
Could you post a small code sample of your work? Thanks.
Closed due to inactivity.
Just for everybody reference: what @joeyschroeder says is that you MUST CHANGE any prop on <SimpleAnimation />
, not its childs, to achieve replay animation effect.
For example, i've this component for an animating validation error:
import React from 'react';
import { Text } from 'native-base';
import { View } from 'react-native';
import { SimpleAnimation } from 'react-native-simple-animations';
const ValidationMessage = (props: any) => {
if (props.error) {
return (
<SimpleAnimation
key={props.counter}
delay={10}
duration={100}
fade
staticType="bounce">
<View
style={{
alignSelf: 'flex-start',
paddingTop: 10,
paddingBottom: 10
}}>
<Text
style={{
color: 'red',
marginLeft: 0,
fontSize: 14,
fontWeight: 'bold'
}}>
{props.error}
</Text>
</View>
</SimpleAnimation>
);
}
return null;
};
export default ValidationMessage;
Note that i receive props.counter
which is a simple number incrementing on each submit button click; i've put it on the key
prop which is valid on any react component. It works perfectly! 👌
Hi,
Loving the library, easy to use and understand.
Is it possible to call a method or something that reanimates the SimpleAnimation again? I'm using it to "bounce" a counter, and I would like the animation to re-run/re-bounce as a feedback to the user.
I have
animateOnUpdate
set totrue
, but it doesn't seem to have any effect.Any tips?