प्रतिक्रिया-मूल सूचीदृश्य/स्क्रॉलव्यू में स्क्रॉल दिशा ढूँढना

Question

क्या प्रतिक्रिया-मूल के सूचीदृश्य/स्क्रॉलव्यू घटकों की स्क्रॉल दिशा जानने का कोई तरीका है?

मूल आईओएस घटक scrollViewWillBeginDragging और scrollViewDidScroll से ऑफ़सेट की गणना करके ऐसा करने में सक्षम प्रतीत होते हैं, लेकिन इनके लिए कोई बाध्यता नहीं है।

Answer 1

आप एक scrollview की Onscroll घटना का उपयोग करें और घटना कॉलबैक में contentOffset जाँच कर सकते हैं:

https://rnplay.org/apps/FltwOg

'use strict'; 

var React = require('react-native'); 
var { 
    AppRegistry, 
    StyleSheet, 
    ScrollView, 
    Text, 
    View, 
} = React; 

var SampleApp = React.createClass({ 
    offset: 0, 
    onScroll: function(event) { 
    var currentOffset = event.nativeEvent.contentOffset.y; 
     var direction = currentOffset > this.offset ? 'down' : 'up'; 
    this.offset = currentOffset; 
    console.log(direction); 
    }, 
    render: function() { 
    return (
     <View style={styles.container}> 
     <ScrollView style={styles.scroller} onScroll={this.onScroll}> 
      <Text>Scrollable content here</Text> 
     </ScrollView> 
     </View> 
    ) 
    } 
}); 

var styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    marginTop: 50, 
    }, 
    scroller: { 
    height: 5000, 
    }, 
}); 

AppRegistry.registerComponent('SampleApp',() => SampleApp); 

Answer 2

मैं alexp के समाधान सही ढंग से दिशा निर्दिष्ट करने के लिए के साथ समस्याओं था जब के बीच का अंतर पुराना और नया ऑफ़सेट बहुत छोटा था। तो मैंने उन्हें बाहर फ़िल्टर किया।

_onScroll = event => { 
    const currentOffset = event.nativeEvent.contentOffset.y; 
    const dif = currentOffset - (this.offset || 0); 

    if (Math.abs(dif) < 3) { 
     console.log('unclear'); 
    } else if (dif < 0) { 
     console.log('up'); 
    } else { 
     console.log('down'); 
    } 

    this.offset = currentOffset; 
    };