React Reanimated - Change Predefined Exiting Animation

Question

Is there a way that I can a conditionally use predefined animations in React Native Reanimated? I'm using RNRA 3.

Example

const wasChosen = useSharedValue(false)

const onExit = () => {
   wasChosen.value ? ZoomIn : ZoomOut
}

// Panresponder code that changes wasChosen.value to true when moved to a certain position

<Animated.View exiting={onExit} />

Answer 1

In the onExit function, you're not actually calling the ZoomIn or ZoomOut functions. You need to add parentheses after each function name to call them.

The exiting prop on the <Animated.View> component should be set to the result of calling the onExit function, not the function itself.

const wasChosen = useSharedValue(false);

const onExit = () => {
  return wasChosen.value ? ZoomIn() : ZoomOut();
};

// Panresponder code that changes wasChosen.value to true when moved to a certain position

<Animated.View exiting={onExit()} />;