title: onScroll is not a function error with useNatveDriver and ScrollView
body: <p>I want to add a collapsable header in my Application.
  I created a separated component for the Header view.</p>
  <pre><code>interface Props{
      userData: UserDetails | null
      scrollY: Animated.Value
  }
      
  const HEADER_EXPANDED_HEIGHT = sizeProportionHeight(320)
  const HEADER_COLLAPSED_HEIGHT = sizeProportionHeight(142)
  
  const CollapsableHeader : React.FC&lt;Props&gt; = ({userData, scrollY}) =&gt; {
      
     const headerHeight = scrollY.interpolate({
          inputRange: [0, HEADER_EXPANDED_HEIGHT-HEADER_COLLAPSED_HEIGHT],
          outputRange: [HEADER_EXPANDED_HEIGHT, HEADER_COLLAPSED_HEIGHT],
          extrapolate: 'clamp'
      })
  
      return(
          &lt;Animated.View style={{height: headerHeight, width: SCREEN_WIDTH, position:'absolute', top:0, left: 0}}/&gt;
      )
  }
  
  export default CollapsableHeader
  </code></pre>
  <p>I my main page I added the header as such:</p>
  <pre><code>interface Props{
      navigation: StackNavigationProp&lt;MainParamList,'HomeScreen'&gt;
      route: RouteProp&lt;MainParamList,'HomeScreen'&gt;
  }
  
  interface HeaderState {
      scrollY: Animated.Value   
  }
  
  interface HomeScreenState {
      header: HeaderState
  }
  
  const HomeScreen : React.FC&lt;Props&gt; = ({ navigation, route }) =&gt; {
  
      const [state, setState] = React.useState&lt;HomeScreenState&gt;({header: {scrollY: new Animated.Value(0)}})
  
      return (
          &lt;View  style={styles.container}&gt;
              &lt;CollapsableHeader userData={null} 
                                 scrollY={state.header.scrollY}/&gt;
              &lt;ScrollView contentContainerStyle={[styles.scrollContainer]}
                          onScroll={Animated.event(
                              [{
                                  nativeEvent: {
                                      contentOffset: {
                                          y: state.header.scrollY
                                      }
                                      
                                  },
                              }],
                              {
                                  useNativeDriver:true
                              }
                              
                          )}
                          scrollEventThrottle={16}&gt;
  /// Scrollable content
                  &lt;/ScrollView&gt;
              &lt;/View&gt;
          )
      }
  </code></pre>
  <p>However if I try to scroll I get an error stating</p>
  <pre><code>this.props.onScroll is not a function. (In 'this.props.onScroll(e)', 'this.props.onScroll' is an instance of AnimatedEvent)
  </code></pre>
  <p>If I remove the <code>useNativeDriver: true</code> the error disappears, but instead I get a warning saying that I'm missing <code>useNativeDriver</code>.</p>
  <p>How can I correctly use this collapsable animation?</p>