0

我的 React Native 屏幕中有一个View我想显示的,然后在 5 秒后淡出。这是方法内部的视图render()

{this.state.showView (
  <Animated.View style={{ opacity: this.state.fadeAnim }}>
  </Animated.View>
)}

屏幕上有一个按钮,当我点击按钮时,我想在显示和隐藏视图之间切换。这里没有任何动画,但是在视图显示 5 秒后,我想将其淡出。这是我在onPress()按钮事件中所拥有的。

  onPress = () => {
    if (this.state.showView) {
      this.setState({
        ...this.state,
        fadeAnim: new Animated.Value(0),
        showView: false,
      });
    } else {
      this.setState(
        {
          ...this.state,
          fadeAnim: new Animated.Value(1),
          showView: true,
        },
        () => {
          Animated.timing(this.state.fadeAnim, {
            toValue: 0,
            duration: 2000,
            delay: 5000,
          }).start(() => {
            this.setState({
              ...this.state,
              fadeAnim: new Animated.Value(0),
              showView: false,
            });
          });
        },
      );
    }
  };

这行不通。视图按预期显示和消失,但不会淡出;它只是在没有动画的情况下消失。我究竟做错了什么?

4

0 回答 0