вызвать обратный вызов на Animated.event - реагировать на нативную анимацию - PullRequest
0 голосов
/ 28 августа 2018

Итак, у меня есть родительский компонент и дочерний компонент, а дочерний компонент имеет ScrollView. Я хочу анимировать элемент в родительском компоненте с помощью прокрутки дочернего компонента, но анимированное значение не меняется ??? Вот мой код:

const Child = ({ handleScroll }) => {
    return {
        <ScrollView
          style={styles.view}
          scrollEventThrottle={16},
          onScroll={handleScroll}
        >
        {/*
        list of items here
        */}
        </ScrollView>
    };
}

class Parent extends Component {
    constructor(props) {
        super(props);
        this.state = {
            scrollY: (new Animated.Value(0)).interpolate({
                inputRange: [0, 1],
                outputRange: [200, 50],
                extrapolate: 'clamp'
            })
        };
        this.handleScroll = this.handleScroll.bind(this);
    }

    handleScroll(event) {
        return Animated.event([{
            nativeEvent: {
                contentOffset: {
                    y: this.state.scrollY
                }
            }
        }]);
    }

    render() {
        return (
            <Animated.Image
              style={[
                styles.imageStyle,
                height: this.state.scrollY
              ]}
            />
            <Child handleScroll={this.handleScroll} />
        );
    }
}
...