Skip to content

Commit eec6cb2

Browse files
authored
Merge pull request #443 from dburdan/master
Pass additional swipe data to the swipeGestureEnded callback
2 parents 858fdd5 + d3bd9da commit eec6cb2

File tree

5 files changed

+36
-13
lines changed

5 files changed

+36
-13
lines changed

components/SwipeListView.js

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -82,9 +82,9 @@ class SwipeListView extends PureComponent {
8282
}
8383
}
8484

85-
rowSwipeGestureEnded(key) {
85+
rowSwipeGestureEnded(key, data) {
8686
if (this.props.swipeGestureEnded) {
87-
this.props.swipeGestureEnded(key);
87+
this.props.swipeGestureEnded(key, data);
8888
}
8989
}
9090

@@ -167,7 +167,8 @@ class SwipeListView extends PureComponent {
167167
onRowPress: () => this.onRowPress(),
168168
setScrollEnabled: enable => this.setScrollEnabled(enable),
169169
swipeGestureBegan: () => this.rowSwipeGestureBegan(key),
170-
swipeGestureEnded: () => this.rowSwipeGestureEnded(key),
170+
swipeGestureEnded: (_, data) =>
171+
this.rowSwipeGestureEnded(key, data),
171172
});
172173
} else {
173174
return (
@@ -183,7 +184,9 @@ class SwipeListView extends PureComponent {
183184
}
184185
ref={row => (this._rows[key] = row)}
185186
swipeGestureBegan={() => this.rowSwipeGestureBegan(key)}
186-
swipeGestureEnded={() => this.rowSwipeGestureEnded(key)}
187+
swipeGestureEnded={(_, data) =>
188+
this.rowSwipeGestureEnded(key, data)
189+
}
187190
onRowOpen={toValue => this.onRowOpen(key, toValue)}
188191
onRowDidOpen={toValue =>
189192
this.props.onRowDidOpen &&

components/SwipeRow.js

Lines changed: 17 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,10 @@ class SwipeRow extends Component {
7272
this.currentTranslateX = value;
7373
if (this.props.onSwipeValueChange) {
7474
let direction = this.previousTrackedDirection;
75-
if (value !== this.previousTrackedTranslateX) {
75+
if (
76+
value !== this.previousTrackedTranslateX &&
77+
Math.abs(value - this.previousTrackedTranslateX) > 0.5
78+
) {
7679
direction =
7780
value > this.previousTrackedTranslateX
7881
? 'right'
@@ -340,12 +343,22 @@ class SwipeRow extends Component {
340343
};
341344

342345
handlePanResponderRelease(e, gestureState) {
343-
this.props.swipeGestureEnded && this.props.swipeGestureEnded();
344-
this.handlePanResponderEnd(e, gestureState);
346+
this.props.swipeGestureEnded &&
347+
this.props.swipeGestureEnded(this.props.swipeKey, {
348+
translateX: this.currentTranslateX,
349+
direction: this.previousTrackedDirection,
350+
event: e,
351+
gestureState,
352+
});
353+
354+
// If preventDefault() called on the event, do not handle responder end.
355+
if (!e.defaultPrevented) {
356+
this.handlePanResponderEnd(e, gestureState);
357+
}
345358
}
346359

347360
handlePanResponderEnd(e, gestureState) {
348-
/* PandEnd will reset the force-closing state when it's true. */
361+
/* PanEnd will reset the force-closing state when it's true. */
349362
if (this.isForceClosing) {
350363
setTimeout(() => {
351364
this.isForceClosing = false;

docs/SwipeListView.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ A List that renders `<SwipeRow />`s
3333
| `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` |
3434
| `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` |
3535
| `swipeGestureBegan` | Called when a swipe row is animating swipe | `func` | `{ rowKey: string } : void` |
36-
| `swipeGestureEnded` | Called when user has ended their swipe gesture | `func` | `{ rowKey: string } : void` |
36+
| `swipeGestureEnded` | Called when user has ended their swipe gesture | `func` | `{ rowKey: string; data: { translateX: number; direction: 'left' \| 'right'; event: GestureResponderEvent; gestureState: PanResponderGestureState; } } : void` |
3737
| `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` |
3838
| `onRowDidOpen` | Called when a swipe row has animated open | `func` | `{ rowKey: string, rowMap: { string: SwipeRowRef }, toValue: number } : void` |
3939
| `onRowClose` | Called when a swipe row is animating closed | `func` | `{ rowKey: string, rowMap: { string: SwipeRowRef } } : void` |

docs/SwipeRow.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ e.g.
5454
| `previewOpenValue` | TranslateX value for the slide out preview animation | `number` | | 0.5 * props.rightOpenValue |
5555
| `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> |
5656
| `swipeGestureBegan` | Called when the row is animating swipe | `func` | `{ } : void` |
57-
| `swipeGestureEnded` | Called when user has ended their swipe gesture | `func` | `{ } : void`
57+
| `swipeGestureEnded` | Called when user has ended their swipe gesture | `func` | `{ rowKey: string; data: { translateX: number; direction: 'left' \| 'right'; event: GestureResponderEvent; gestureState: PanResponderGestureState; } } : void` |
5858
| `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` |
5959
| `shouldItemUpdate` | Callback to determine whether component should update | `func` | `{ currentItem: any, newItem: any }` |
6060
| `forceCloseToLeftThreshold` | TranslateX amount(not value!) threshold that triggers force-closing the row to the Left End (positive number) | `number` |

types/index.d.ts

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
import { Component } from 'react';
2-
import { StyleProp, ViewStyle, ListView, NativeSyntheticEvent, NativeScrollEvent, ListRenderItemInfo, ListViewDataSource, SectionListProps, FlatListProps } from 'react-native';
2+
import { StyleProp, ViewStyle, ListView, NativeSyntheticEvent, NativeScrollEvent, ListRenderItemInfo, ListViewDataSource, SectionListProps, FlatListProps, GestureResponderEvent, PanResponderGestureState } from 'react-native';
3+
4+
type SwipeGestureEndedData = {
5+
translateX: number;
6+
direction: 'left' | 'right';
7+
event: GestureResponderEvent;
8+
gestureState: PanResponderGestureState;
9+
}
310

411
interface IPropsSwipeRow<T> {
512
/**
@@ -14,7 +21,7 @@ interface IPropsSwipeRow<T> {
1421
/**
1522
* Called when user has ended their swipe gesture
1623
*/
17-
swipeGestureEnded(): void;
24+
swipeGestureEnded(swipeKey: string, data: SwipeGestureEndedData): void;
1825
/**
1926
* Called when a swipe row is animating open. Used by the SwipeListView
2027
* to keep references to open rows.
@@ -327,7 +334,7 @@ interface IPropsSwipeListView<T> {
327334
/**
328335
* Called when user has ended their swipe gesture
329336
*/
330-
swipeGestureEnded(rowKey: string): void;
337+
swipeGestureEnded(rowKey: string, data: SwipeGestureEndedData): void;
331338
/**
332339
* Called when a swipe row is animating open
333340
*/

0 commit comments

Comments
 (0)