react-native - React Native アニメーションの長さが機能しない

Question

ログイン画面にアニメーションがあり、サインインボタンがクリックされたときにボタンを下にスライドし、同時に電子メールとパスワードの入力ボックスを上にスライドします.2000ミリ秒の期間がありますが、代わりに位置が即座に変わりますスムーズにスライドします。

アニメーションは機能コンポーネントにあるため、クリックして元に戻す前にアニメーションが元に戻らないようにするために、位置を保持するために useState() を使用しています (以前は useState() を使用する前に、テキストを変更したときに入力ボックス、アニメーションは元の位置にリセットされます)

アニメーションはこちら

  const [Buttons, setButtons] = useState(200);
  const [Input, setInput] = useState(800);
  const AnimatedButtons = new Animated.ValueXY({ x: 0, y: Buttons })
  const AnimatedInputs = new Animated.ValueXY({ x: 0, y: Input })

  const StartAnmation = () => {
  setButtons(800);
  Animated.timing(
  AnimatedButtons, {
  toValue: { x: AnimatedButtons.x, y: AnimatedButtons.y },
  duration: 2000,
  useNativeDriver: true,
}).start()

setInput(-100);
Animated.timing(AnimatedInputs, {
  toValue: { x: AnimatedInputs.x, y: AnimatedButtons.y },
  duration: 2000,
  useNativeDriver: true,
}).start()
}

 const ReverseAnimation = () => {
 setButtons(200)
 Animated.timing(
  AnimatedButtons, {
  toValue: { x: AnimatedButtons.x, y: AnimatedButtons.y },
  duration: 2000,
  useNativeDriver: true,
}).start()

setInput(800)
Animated.timing(AnimatedInputs, {
  toValue: { x: AnimatedInputs.x, y: AnimatedInputs.y },
  duration: 2000,
  useNativeDriver: true,
}).start()
}

アニメーションを呼び出す 2 つのボタン onPress() があり、位置を変更する 2 つのビューがあります。

ありがとう