Delay between infinite animations

user_13627814 0
Viewed 111

I have infinite animation, from react-animations library. Can you please tell me if there is a way to make a delay between animation cycles? As far as I know, it is not possible to do this with styles.

  import { rubberBand } from "react-animations";
  import Radium, { StyleRoot } from "radium";

...
   <StyleRoot style={styles.animation}>
      <Button />
   </StyleRoot>
...

  animation: {
    animationDuration: "1s",
    animationDelay: "0.5s",
    animationTimingFunction: "ease-in-out",
    animationIterationCount: "infinite",
    animationName: Radium.keyframes(rubberBand, "rubberBand"),
  },
reactjs javascript
1 Answers

You can set your own animations with the Animated component from react-native where delay is possible.

this._animatedValue = new Animated.Value(0);

Animated.timing(this._animatedValue, {
    toValue: 100,
    delay: 300,
    duration: 500
}).start()

https://animationbook.codedaily.io/introduction

user_102584450
Related