How to do series/parallel animation in react-native-reanimated 2?

Viewed 661

I'm looking for the equivalent of Animated.sequence and Animated.parallel from react-native. So far from the docs for v2, I could only see the withSequence function that changes the value of only on value and therefore the style of only one component in series.

What I was looking for was to trigger animations in two different components, either in series or in parallel. For parallel, it seems changing values in statements one after another worked. Correct me if I'm wrong.

  // these will run in parallel
  val1Shared.value = withTiming(50);
  val2Shared.value = withTiming(100);

But for series, I need to have each animation inside a useTiming callback. Which leads to kind of callback hell.

  val1Shared.value = withTiming(50, undefined, () => {
    val2Shared.value = withTiming(100);
  });

Please help with the best practices in achieving this with reanimated 2. Thanks.

0 Answers
Related