title: React Native Animated interpolate opacity based on multiple values
body: <p>I have a React Native Animated.view component whose opacity I would like to interpolate based on the scrollview position. However, I want to interpolate the opacity using two values (x and y) instead of one.</p>
  
  <pre><code>      &lt;Animated.View
          style={[
            {
              opacity: this.state.scrollX.interpolate({
                inputRange: [0, 414, 828],
                outputRange: [0, 1, 1]
              })
            },
            {
              opacity: this.state.scrollY.interpolate({
                inputRange: [-168, -167, -166, -85, -84],
                outputRange: [1, 1, 1, 0, 0]
              })
            }
          ]}
        &gt;
          &lt;Text&gt;Content....&lt;/Text&gt;
        &lt;/Animated.View&gt;
  </code></pre>
  
  <p>This doesn't work of course because one opacity value overwrites the other, but it makes clear what I want to achieve.</p>