Animate from left to right and right to left with transform translateX in react native?

1.3k views Asked by At

i want to animate my component from right to left and left to right:

const CardCashout: FC<CardCashoutProps> = ({ openCard }) => {
 const left = new Animated.Value(0);
  useEffect(() => {
    if (openCard)
      Animated.timing(left, {
        toValue: 0,
        duration: 5000,
        easing: Easing.inOut(Easing.ease),
      }).start();
    else {
      Animated.timing(left, {
        toValue: 222,
        duration: 5000,
        easing: Easing.out(Easing.ease),
      }).start();
    }
  }, [openCard]);
  return (
    <Animated.View style={{ transform: [{ translateX: left }] }}>
      <Text>CardCashout</Text>
    </Animated.View>
  );
};

when opencard is false, going to right is animating but when i try to toggle it when opecard is true, there's no animation happening?

0

There are 0 answers