React Native:自定义可触摸不透明度动画速度

Question

根据TouchableOpacity文档，有一个activeOpacity道具可以更改结束不透明度级别，还有一个setOpacityTo函数可以将组件动画化到任何不透明度级别。似乎没有任何关于改变动画应该采取的速度。

我将如何更改动画速度？有道具吗？我需要制作自己的自定义Animated.View吗？

Answer 1

这将是该方法的持续时间部分...

setOpacityTo(value: number, duration: number)

React-native在后台使用setOpacityTo使用setNativeProps with TouchableOpacity对不透明度进行动画处理。

setOpacityTo(value) {
  // Redacted: animation related code
  this.refs[CHILD_REF].setNativeProps({
    opacity: value
  });
},

因此，如果您愿意，看起来您也可以创建自己的动画事件。以下是可触摸不透明度如何使用setOpacityTo，确保将useNativeDriver设置为true。

  setOpacityTo: function(value: number, duration: number) {
    Animated.timing(
      this.state.anim,
      {
        toValue: value,
        duration: duration,
        easing: Easing.inOut(Easing.quad),
        useNativeDriver: true,
      }
    ).start();
  },