React Native动画：根据多个值插值透明度

Question

我有一个React Native的Animated.view组件，我想根据scrollview的位置插值透明度。但是，我想使用两个值（x和y）来插值透明度，而不是一个值。

      <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]
            })
          }
        ]}
      >
        <Text>Content....</Text>
      </Animated.View>

当然，这不起作用，因为一个不透明度值会覆盖另一个，但它清楚地说明了我想要实现的目标。

- Daniel Janke

Answer 1

你可以使用 Animated.add() 来实现。

<Animated.View
  style={[
    {
      opacity: Animated.add(scrollX, scrollY).interpolate({
        inputRange: [],
        outputRange: []
      })
    },
  ]}
>

- Estevão Lucas

---

有没有办法将像“14度”和“23度”这样的字符串值相加？ - Danial_Abzadough