title: react native animation : screen shaking when scrolling slowing
body: <p>I am using <code>Animated.View</code> to change the header height. </p>
  
  <p>It works well in ios but in android, when I scroll slowly the entire view is shaking. </p>
  
  <p>1) First I set the state </p>
  
  <pre><code> this.state = {
        scrollY:new Animated.Value(0)
     }
  </code></pre>
  
  <p>2) Inside the <code>render()</code> I render the height of the view I want to animate.</p>
  
  <pre><code>const HeaderHeight = this.state.scrollY.interpolate({
        inputRange: [0, 100],
        outputRange: [100, 0],
        extrapolate: 'clamp'
      })
  </code></pre>
  
  <p>3) I set my Header like this:</p>
  
  <pre><code>  &lt;Animated.View style={{width:'100%', height:HeaderHeight, backgroundColor:'transparent', justifyContent:'flex-end'}}&gt;
   ...
    &lt;/Animated.View&gt;
  </code></pre>
  
  <p>4) Inside the scrollview:</p>
  
  <pre><code>&lt;ScrollView
            scrollEventThrottle={16}
            onScroll={Animated.event([{ nativeEvent: { contentOffset: { y: this.state.scrollY } } }])}
            &gt;
  </code></pre>
  
  <p></p>
  
  <p>As you could see from the gif file when I <code>slowly scroll the view</code> the screen is shaking. This is happening in android. On ios it works fine.</p>
  
  <p>Any idea how to fix this?</p>
  
  <p>Any comments or advice would be really helpful :)</p>
  
  <p><a href="https://i.stack.imgur.com/HbhEF.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/HbhEF.gif" alt="enter image description here"></a></p>