React-Native:在动画中滚动时如何禁用TouchableHighlight?

时间:2018-08-23 16:57:48

标签: react-native touchablehighlight

在react-native中使用Animated.ScrollView滚动时,我需要禁用按钮。

我正在尝试应用以下内容:

disabled={this.state.scrollY._value <= 30 ? false : true}

在TouchableHighlight的道具中。

据我了解,不可能将值:this.state.scrollY._value直接应用于TouchableHighlight的“禁用”属性。但是我真的不知道如何进行-.-

我真的很感谢您的帮助。

我的按钮的格式如下:

<Animated.View>
 <TouchableHighlight>
  <Icon />
 </TouchableHighlight>
</Animated.View>

这是完整的代码:

<Animated.View style={{
        position: 'absolute',
        elevation: 5,
        justifyContent: 'center',
        flex: 1,
        height: 100,
        width: 100,
        opacity: 1,
        left: SCREEN_WIDTH / 2 - SIZE / 2,
        top: 120,
        opacity: buttonTopDisappearance,
      }}>
        <TouchableHighlight
          onPress={() => {
            this.toggleView(playBack);
            if (!playBack) {
              this.setState({ playBack: true })
            } else {
              this.setState({ playBack: false })
            }
          }}
          underlayColor="#2882D8"
          disabled={this.state.scrollY._value <= 30 ? false : true}
          style={{
            flex: 1,
            alignItems: 'center',
            justifyContent: 'center',
            width: null,
            height: null,
            borderRadius: SIZE / 2,
            backgroundColor: '#48A2F8',
            position: 'relative',
            elevation: 6,
          }}
        >
          <IconFontAwesome name="plus" size={24} color="#F8F8F8" />
        </TouchableHighlight>
      </Animated.View>

0 个答案:

没有答案