反应原生Android Slider不能在设备上垂直滑动

我已使用 0.43上的Slider组件使用以下代码。它适用于iOS，因为它有一个很棒的“按钮”供用户持有和拖动。但在Android上它只是一个小点，我发现我无法垂直拖动它（1/10次尝试成功）。相反，我发现“drag”被ScrollView捕获。帮帮我？反应原生Android Slider不能在设备上垂直滑动

 <Slider 
     minimumValue={minValue} 
     maximumValue={maxValue} 
     step={step} 
     style={styles.slider} 
     value={parseInt(input.value)} 
     onSlidingComplete={onSlidingComplete} 
     onValueChange={onValueChange} 
     /> 

    slider: { 
    marginRight:-100, 
    marginLeft:-100, 
    width:250, 
    transform: [ 
     { rotateZ : '-90deg' }, 
    ], 
    },

来源

2017-06-02 Dan

为此，您需要覆盖Slider的PanResponder。出于某种原因，Android在垂直旋转时效果不佳。

componentWillMount() { 
    this._panResponder = PanResponder.create({ 
     // Ask to be the responder: 
     onStartShouldSetPanResponder: (evt, gestureState) => true, 
     onStartShouldSetPanResponderCapture: (evt, gestureState) => true, 
     onMoveShouldSetPanResponder: (evt, gestureState) => true, 
     onMoveShouldSetPanResponderCapture: (evt, gestureState) => true 
    }) 
}

然后简单地套用PanHandler到Slider：

<Slider 
    {...this._panResponder.panHandlers} 
    ... />

这使得它绝对优先于那个讨厌的ScrollView。

此外，最好的做法是在Slider正在使用时停止垂直平移ScrollView，这种情况在您快速连续拖动两个组件时会发生。

<ScrollView scrollEnabled={!this.state.sliding}> 

    <Slider 
     onValueChange={() => { 
      this.setState({ 
      sliding: true 
      }) 
     }} 
     onSlidingComplete={() => { 
      this.setState({ 
      sliding: false 
      }) 
     }} 
     ... /> 

</ScrollView>

来源

2017-06-09 08:54:50 G0dsquad

我曾与react-native的滑块组件表现真实iOS设备怪异的一些问题，所以我选择了使用react-native-slider代替。

来源

2017-06-08 16:49:46 MattyK14

反应原生Android Slider不能在设备上垂直滑动

回答

相关问题