Родной элемент Fading React через 5 секунд - PullRequest
Новая
       12

Родной элемент Fading React через 5 секунд

0 голосов
/ 21 февраля 2020

У меня на экране 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,
            });
          });
        },
      );
    }
  };

Это не работает. Представление отображается и исчезает, как и ожидалось, но оно не исчезает; он просто исчезает без анимации. Что я делаю не так?

...