反應原生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不能在設備上垂直滑動

回答

相關問題