Skip to content

Commit

Permalink
Fix onStart callbacks of ReanimatedSwipeable being called every u…
Browse files Browse the repository at this point in the history
…pdate (#3151)

## Description

Fix `onStart` callbacks of `ReanimatedSwipeable` being called every
update.

Moved from #3149

## Test plan

- open `Swipeable Reanimation` example
- replace the `ReanimatedSwipeable` component with the following code:
```js
<ReanimatedSwipeable
  containerStyle={styles.swipeable}
  onSwipeableOpenStartDrag={(direction) => console.log(direction)}
  onSwipeableCloseStartDrag={(direction) => console.log(direction)}>
  <Text>Swipeable!</Text>
</ReanimatedSwipeable>
```
- see how only one update is sent to the console, while before this PR
new updates were constantly generated
  • Loading branch information
latekvo authored Oct 14, 2024
1 parent 9aef009 commit f05604c
Showing 1 changed file with 14 additions and 5 deletions.
19 changes: 14 additions & 5 deletions src/components/ReanimatedSwipeable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -570,6 +570,8 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
}
});

const dragStarted = useSharedValue<boolean>(false);

const panGesture = Gesture.Pan()
.onUpdate((event: GestureUpdateEvent<PanGestureHandlerEventPayload>) => {
userDrag.value = event.translationX;
Expand All @@ -583,18 +585,25 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
? 'left'
: 'right';

if (rowState.value === 0 && onSwipeableOpenStartDrag) {
runOnJS(onSwipeableOpenStartDrag)(direction);
} else if (rowState.value !== 0 && onSwipeableCloseStartDrag) {
runOnJS(onSwipeableCloseStartDrag)(direction);
if (!dragStarted.value) {
dragStarted.value = true;
if (rowState.value === 0 && onSwipeableOpenStartDrag) {
runOnJS(onSwipeableOpenStartDrag)(direction);
} else if (rowState.value !== 0 && onSwipeableCloseStartDrag) {
runOnJS(onSwipeableCloseStartDrag)(direction);
}
}

updateAnimatedEvent();
})
.onEnd(
(event: GestureStateChangeEvent<PanGestureHandlerEventPayload>) => {
handleRelease(event);
}
);
)
.onFinalize(() => {
dragStarted.value = false;
});

if (enableTrackpadTwoFingerGesture) {
panGesture.enableTrackpadTwoFingerGesture(enableTrackpadTwoFingerGesture);
Expand Down

0 comments on commit f05604c

Please sign in to comment.