Added a property to disable swipe gesture. (#59)

* Added a property to disable swipe gesture Added a property to disable swipe gesture to only allow index change programmatically. * Cleanning code Cleanning code * Added missing proptype Added missing proptype * Update snapshot for test new property Update snapshot for test new property * Update snapshot test Update snapshot test * Updated docs Updated docs
gusgard · Oct 11, 2019 · a8c070d · a8c070d
1 parent 363b190
commit a8c070d
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -117,7 +117,8 @@ const styles = StyleSheet.create({
 | autoplay                |                       false                       |        `bool`         | Change index automatically                                           |
 | autoplayDelay           |                         3                         |       `number`        | Delay between every page in seconds                                  |
 | autoplayLoop            |                       false                       |        `bool`         | Continue playing after reach end                                     |
-| autoplayInvertDirection |                       false                       |        `bool`         | Invert auto play direction                                           |
+| autoplayInvertDirection |                       false                       |        `bool`         | Invert auto play direction        
+| disableGesture |                       false                       |        `bool`         | Disable swipe gesture                                          |
 
 **More props**
 

diff --git a/src/components/SwiperFlatList/SwiperFlatList.js b/src/components/SwiperFlatList/SwiperFlatList.js
@@ -34,6 +34,7 @@ const SwiperFlatList = React.forwardRef(
       onMomentumScrollEnd,
       onViewableItemsChanged,
       viewabilityConfig,
+      disableGesture,
       ...props
     },
     ref,
@@ -57,6 +58,7 @@ const SwiperFlatList = React.forwardRef(
     const [paginationIndexes, setPaginationIndexes] = React.useState({ index, prevIndex: index });
     const [ignoreOnMomentumScrollEnd, setIgnoreOnMomentumScrollEnd] = React.useState(false);
     const flatListElement = React.useRef(null);
+    const [scrollEnabled, setScrollEnabled] = React.useState(!disableGesture);
 
     const _onChangeIndex = React.useCallback(
       ({ index: _index, prevIndex: _prevIndex }) => {
@@ -105,15 +107,21 @@ const SwiperFlatList = React.forwardRef(
 
     React.useImperativeHandle(ref, () => ({
       scrollToIndex: (...args) => {
+        setScrollEnabled(true);
         _scrollToIndex(...args);
+        setScrollEnabled(!disableGesture);
       },
       getCurrentIndex: () => paginationIndex,
       getPrevIndex: () => prevIndex,
       goToLastIndex: () => {
+        setScrollEnabled(true);
         _scrollToIndex({ index: size - 1 });
+        setScrollEnabled(!disableGesture);
       },
       goToFirstIndex: () => {
+        setScrollEnabled(true);
         _scrollToIndex({ index: FIRST_INDEX });
+        setScrollEnabled(!disableGesture);
       },
     }));
 
@@ -170,6 +178,7 @@ const SwiperFlatList = React.forwardRef(
     );
 
     const flatListProps = {
+      scrollEnabled,
       ref: flatListElement,
       keyExtractor: (_item, _index) => _index.toString(),
       horizontal: !vertical,
@@ -250,6 +259,7 @@ SwiperFlatList.propTypes = {
   onMomentumScrollEnd: PropTypes.func,
   onViewableItemsChanged: PropTypes.func,
   viewabilityConfig: PropTypes.object,
+  disableGesture: PropTypes.bool,
 };
 
 SwiperFlatList.defaultProps = {
@@ -268,6 +278,7 @@ SwiperFlatList.defaultProps = {
   onMomentumScrollEnd: undefined,
   onViewableItemsChanged: undefined,
   viewabilityConfig: {},
+  disableGesture: false,
 };
 
 export default SwiperFlatList;
diff --git a/src/components/SwiperFlatList/__snapshots__/test.js.snap b/src/components/SwiperFlatList/__snapshots__/test.js.snap
@@ -41,6 +41,7 @@ exports[`swiper flatlist renders children 1`] = `
   pagingEnabled={true}
   removeClippedSubviews={false}
   renderItem={[Function]}
+  scrollEnabled={true}
   scrollEventThrottle={50}
   showsHorizontalScrollIndicator={false}
   showsVerticalScrollIndicator={false}
@@ -135,6 +136,7 @@ exports[`swiper flatlist renders correctly 1`] = `
   pagingEnabled={true}
   removeClippedSubviews={false}
   renderItem={[Function]}
+  scrollEnabled={true}
   scrollEventThrottle={50}
   showsHorizontalScrollIndicator={false}
   showsVerticalScrollIndicator={false}