react-native - 只有第一个动画在动画视图中有效

Question

我在 React Native 中为我的登录（启动画面动画）做我的第一个动画，但只有我的第一个动画作品（startAnimation），之前都没有。

如果我删除 startAnimation，middleAnimation 就可以了。只有第一个 Animate.sequence 有效。

const login: React.FC = ({ navigation }: any) => {

  const edges = useSafeAreaInsets();
  const startAnimation = useRef(new Animated.Value(0)).current;
  const middleAnimation = useRef(new Animated.Value(0)).current; 
  const finalAnimation = useRef(new Animated.Value(0)).current;
  const [animation, SetAnimation] = useState<any>(false);

  useEffect(() => {
    animationLogin();
  }, []);

function animationLogin() {
    SetAnimation(true);
    setTimeout(() => {
      Animated.sequence([
        Animated.delay(500),
        Animated.timing(startAnimation, {
          toValue: -Dimensions.get('window').height + (edges.bottom + 270),
          useNativeDriver: true,
        }),
        Animated.delay(1000),
        Animated.timing(middleAnimation, {
          toValue: -Dimensions.get('window').height + (edges.bottom + 290),
          useNativeDriver: true,
        }),
        Animated.delay(500),
        Animated.timing(finalAnimation, {
          toValue: -Dimensions.get('window').height + (edges.bottom + -845),
          useNativeDriver: true,
        }),
      ]).start();
    }, 1000);
  }

 return (
        <View
          style={{
            position: 'absolute',
            top: 845,
            bottom: 0,
            left: 0,
            right: 0,
          }}
        >
          <Animated.View
            style={{
              flex: 1,
              zIndex: 1,
              transform: [{ translateY: startAnimation }],
            }}
          >
            <Animated.View
              style={{
                flex: 1,
                alignItems: 'center',
                justifyContent: 'center',
              }}
            >
              <Image source={Logo}></Image>
            </Animated.View>
          </Animated.View>
        </View>
      )

标签： react-nativeandroid-animation