Skip to content

Commit

Permalink
Increase screen transition velocity (#5847)
Browse files Browse the repository at this point in the history
## Summary

This pull request enhances the screen transition speed after releasing
the finger. The velocity will depend on the distance from the final
position, with greater distances leading to increased velocity.

### `swipeLeft`


https://github.com/software-mansion/react-native-reanimated/assets/36106620/bfaa011a-1563-4fea-a1a2-4319276f20f2

### `swipeDown`


https://github.com/software-mansion/react-native-reanimated/assets/36106620/c6946415-9008-4280-81c5-19d1d79e07c4

### `twoDimensionalSwipe`


https://github.com/software-mansion/react-native-reanimated/assets/36106620/24064fc6-a940-4ee2-8f73-22424fc6c01d
  • Loading branch information
piaskowyk committed Apr 2, 2024
1 parent 1c12714 commit 12717cd
Showing 1 changed file with 21 additions and 5 deletions.
26 changes: 21 additions & 5 deletions src/reanimated2/screenTransition/swipeSimulator.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,10 @@ import type {
import { applyStyle, applyStyleForBelowTopScreen } from './styleUpdater';
import { RNScreensTurboModule } from './RNScreensTurboModule';

const BASE_VELOCITY = 300;
const BASE_VELOCITY = 400;
const ADDITIONAL_VELOCITY_FACTOR_X = 400;
const ADDITIONAL_VELOCITY_FACTOR_Y = 500;
const ADDITIONAL_VELOCITY_FACTOR_XY = 600;

function computeEasingProgress(
startingTimestamp: number,
Expand Down Expand Up @@ -100,17 +103,30 @@ export function getSwipeSimulator(
const velocity = { x: BASE_VELOCITY, y: BASE_VELOCITY };
if (lockAxis === 'x') {
velocity.y = 0;
velocity.x +=
(ADDITIONAL_VELOCITY_FACTOR_X * distance.x) / screenDimensions.width;
} else if (lockAxis === 'y') {
velocity.x = 0;
velocity.y +=
(ADDITIONAL_VELOCITY_FACTOR_Y * distance.y) / screenDimensions.height;
} else {
const euclideanDistance = Math.sqrt(distance.x ** 2 + distance.y ** 2);
const screenDiagonal = Math.sqrt(
screenDimensions.width ** 2 + screenDimensions.height ** 2
);
const velocityVectorLength =
BASE_VELOCITY +
(ADDITIONAL_VELOCITY_FACTOR_XY * euclideanDistance) / screenDiagonal;
if (Math.abs(startingPosition.x) > Math.abs(startingPosition.y)) {
velocity.x = BASE_VELOCITY;
velocity.x = velocityVectorLength;
velocity.y =
BASE_VELOCITY * Math.abs(startingPosition.y / startingPosition.x);
velocityVectorLength *
Math.abs(startingPosition.y / startingPosition.x);
} else {
velocity.x =
BASE_VELOCITY * Math.abs(startingPosition.x / startingPosition.y);
velocity.y = BASE_VELOCITY;
velocityVectorLength *
Math.abs(startingPosition.x / startingPosition.y);
velocity.y = velocityVectorLength;
}
}

Expand Down

0 comments on commit 12717cd

Please sign in to comment.