Merge pull request #443 from dburdan/master

Pass additional swipe data to the swipeGestureEnded callback

Author: jemise111

components/SwipeListView.js

@@ -82,9 +82,9 @@ class SwipeListView extends PureComponent {
         }
     }
 
-    rowSwipeGestureEnded(key) {
+    rowSwipeGestureEnded(key, data) {
         if (this.props.swipeGestureEnded) {
-            this.props.swipeGestureEnded(key);
+            this.props.swipeGestureEnded(key, data);
         }
     }
 
@@ -167,7 +167,8 @@ class SwipeListView extends PureComponent {
                 onRowPress: () => this.onRowPress(),
                 setScrollEnabled: enable => this.setScrollEnabled(enable),
                 swipeGestureBegan: () => this.rowSwipeGestureBegan(key),
-                swipeGestureEnded: () => this.rowSwipeGestureEnded(key),
+                swipeGestureEnded: (_, data) =>
+                    this.rowSwipeGestureEnded(key, data),
             });
         } else {
             return (
@@ -183,7 +184,9 @@ class SwipeListView extends PureComponent {
                     }
                     ref={row => (this._rows[key] = row)}
                     swipeGestureBegan={() => this.rowSwipeGestureBegan(key)}
-                    swipeGestureEnded={() => this.rowSwipeGestureEnded(key)}
+                    swipeGestureEnded={(_, data) =>
+                        this.rowSwipeGestureEnded(key, data)
+                    }
                     onRowOpen={toValue => this.onRowOpen(key, toValue)}
                     onRowDidOpen={toValue =>
                         this.props.onRowDidOpen &&

components/SwipeRow.js

@@ -72,7 +72,10 @@ class SwipeRow extends Component {
             this.currentTranslateX = value;
             if (this.props.onSwipeValueChange) {
                 let direction = this.previousTrackedDirection;
-                if (value !== this.previousTrackedTranslateX) {
+                if (
+                    value !== this.previousTrackedTranslateX &&
+                    Math.abs(value - this.previousTrackedTranslateX) > 0.5
+                ) {
                     direction =
                         value > this.previousTrackedTranslateX
                             ? 'right'
@@ -340,12 +343,22 @@ class SwipeRow extends Component {
     };
 
     handlePanResponderRelease(e, gestureState) {
-        this.props.swipeGestureEnded && this.props.swipeGestureEnded();
-        this.handlePanResponderEnd(e, gestureState);
+        this.props.swipeGestureEnded &&
+            this.props.swipeGestureEnded(this.props.swipeKey, {
+                translateX: this.currentTranslateX,
+                direction: this.previousTrackedDirection,
+                event: e,
+                gestureState,
+            });
+
+        // If preventDefault() called on the event, do not handle responder end.
+        if (!e.defaultPrevented) {
+            this.handlePanResponderEnd(e, gestureState);
+        }
     }
 
     handlePanResponderEnd(e, gestureState) {
-        /* PandEnd will reset the force-closing state when it's true. */
+        /* PanEnd will reset the force-closing state when it's true. */
         if (this.isForceClosing) {
             setTimeout(() => {
                 this.isForceClosing = false;

docs/SwipeListView.md

@@ -33,7 +33,7 @@ A List that renders `<SwipeRow />`s
 | `swipeToOpenVelocityContribution` | Describes how much the ending velocity of the gesture affects whether the swipe will result in the item being closed or open. A velocity factor of 0 (the default) means that the velocity will have no bearing on whether the swipe settles on a closed or open position and it'll just take into consideration the swipeToOpenPercent. Ideal values for this prop tend to be between 5 and 15. | `number` | | `0` |
 | `recalculateHiddenLayout` | Enable hidden row onLayout calculations to run always. By default, hidden row size calculations are only done on the first onLayout event for performance reasons. Passing ```true``` here will cause calculations to run on every onLayout event. You may want to do this if your rows' sizes can change. One case is a SwipeListView with rows of different heights and an options to delete rows. | `bool` | | `false` |
 | `swipeGestureBegan` | Called when a swipe row is animating swipe | `func` | `{ rowKey: string } : void` |
-| `swipeGestureEnded` | Called when user has ended their swipe gesture | `func` | `{ rowKey: string } : void` |
+| `swipeGestureEnded` | Called when user has ended their swipe gesture | `func` | `{ rowKey: string; data: { translateX: number; direction: 'left' \| 'right'; event: GestureResponderEvent; gestureState: PanResponderGestureState; } } : void` |
 | `onRowOpen` | Called when a swipe row is animating open. This has a param of `toValue` which is the new X value the row (after it has opened). This can be used to calculate which direction the row has been swiped open. | `func` | `{ rowKey: string, rowMap: { string: SwipeRowRef }, toValue: number } : void` |
 | `onRowDidOpen` | Called when a swipe row has animated open | `func` | `{ rowKey: string, rowMap: { string: SwipeRowRef }, toValue: number } : void` |
 | `onRowClose` | Called when a swipe row is animating closed | `func` | `{ rowKey: string, rowMap: { string: SwipeRowRef } } : void` |

docs/SwipeRow.md

@@ -54,7 +54,7 @@ e.g.
 | `previewOpenValue` | TranslateX value for the slide out preview animation | `number` | | 0.5 * props.rightOpenValue |
 | `onSwipeValueChange` | Callback invoked any time the translateX value of the row changes | `func` | <code>{ swipeData: { key: string, value: number, direction: 'left' &#124; 'right', isOpen: bool } } : void</code> |
 | `swipeGestureBegan` | Called when the row is animating swipe | `func` | `{ } : void` |
-| `swipeGestureEnded` | Called when user has ended their swipe gesture | `func` | `{ } : void`
+| `swipeGestureEnded` | Called when user has ended their swipe gesture | `func` | `{ rowKey: string; data: { translateX: number; direction: 'left' \| 'right'; event: GestureResponderEvent; gestureState: PanResponderGestureState; } } : void` |
 | `swipeToOpenVelocityContribution` | Describes how much the ending velocity of the gesture affects whether the swipe will result in the item being closed or open. A velocity factor of 0 (the default) means that the velocity will have no bearing on whether the swipe settles on a closed or open position and it'll just take into consideration the swipeToOpenPercent. Ideal values for this prop tend to be between 5 and 15. | `number` | | `0` |
 | `shouldItemUpdate` | Callback to determine whether component should update | `func` | `{ currentItem: any, newItem: any }` |
 | `forceCloseToLeftThreshold` | TranslateX amount(not value!) threshold that triggers force-closing the row to the Left End (positive number) | `number` |

types/index.d.ts

@@ -1,5 +1,12 @@
 import { Component } from 'react';
-import { StyleProp, ViewStyle, ListView, NativeSyntheticEvent, NativeScrollEvent, ListRenderItemInfo, ListViewDataSource, SectionListProps, FlatListProps } from 'react-native';
+import { StyleProp, ViewStyle, ListView, NativeSyntheticEvent, NativeScrollEvent, ListRenderItemInfo, ListViewDataSource, SectionListProps, FlatListProps, GestureResponderEvent, PanResponderGestureState } from 'react-native';
+
+type SwipeGestureEndedData = {
+	translateX: number;
+	direction: 'left' | 'right';
+	event: GestureResponderEvent;
+	gestureState: PanResponderGestureState;
+}
 
 interface IPropsSwipeRow<T> {
 	/**
@@ -14,7 +21,7 @@ interface IPropsSwipeRow<T> {
 	/**
 	 * Called when user has ended their swipe gesture
 	 */
-	swipeGestureEnded(): void;
+	swipeGestureEnded(swipeKey: string, data: SwipeGestureEndedData): void;
 	/**
 	 * Called when a swipe row is animating open. Used by the SwipeListView
 	 * to keep references to open rows.
@@ -327,7 +334,7 @@ interface IPropsSwipeListView<T> {
 	/**
 	 * Called when user has ended their swipe gesture
 	 */
-	swipeGestureEnded(rowKey: string): void;
+	swipeGestureEnded(rowKey: string, data: SwipeGestureEndedData): void;
 	/**
 	 * Called when a swipe row is animating open
 	 */