status-im/react-native
2
0
Fork 0
mirror of https://github.com/status-im/react-native.git synced 2025-02-26 16:10:58 +00:00
Code Issues Projects Releases Wiki Activity

Slower bounce

Browse Source 
Summary: Slower bounce during mount and right swipe, so it feels less jarring to users.

Reviewed By: hedgerwang

Differential Revision: D3420169

fbshipit-source-id: d5da87c4a64eecf478edd626c96f5541ab94b56e
This commit is contained in:
Fred Liu 2016-06-10 17:26:02 -07:00 committed by Facebook Github Bot 7
parent 402e7eaac2
commit 78485a36ba
1 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
Libraries/Experimental/SwipeableRow/SwipeableRow.js
View File

@ -52,10 +52,11 @@ const SWIPE_DURATION = 200;
* possible to swipe
*/
const ON_MOUNT_BOUNCE_DELAY = 700;
const ON_MOUNT_BOUNCE_DURATION = 200;
const ON_MOUNT_BOUNCE_DURATION = 400;
// Distance left of closed position to bounce back when right-swiping from closed
const RIGHT_SWIPE_BOUNCE_BACK_DISTANCE = 50;
const RIGHT_SWIPE_BOUNCE_BACK_DURATION = 400;
/**
* Max distance of right swipe to allow (right swipes do functionally nothing).
* Must be multiplied by SLOW_SPEED_SWIPE_FACTOR because gestureState.dx tracks
@ -293,11 +294,15 @@ const SwipeableRow = React.createClass({
this._animateTo(-this.props.maxSwipeDistance);
},
_animateToClosedPosition(): void {
this._animateTo(CLOSED_LEFT_POSITION);
_animateToClosedPosition(duration: number = SWIPE_DURATION): void {
this._animateTo(CLOSED_LEFT_POSITION, duration);
},
_animateBounceBack(duration: number = SWIPE_DURATION): void {
_animateToClosedPositionDuringBounce(): void {
this._animateToClosedPosition(RIGHT_SWIPE_BOUNCE_BACK_DURATION);
},
_animateBounceBack(duration: number): void {
/**
* When swiping right, we want to bounce back past closed position on release
* so users know they should swipe right to get content.
@ -305,7 +310,7 @@ const SwipeableRow = React.createClass({
this._animateTo(
-RIGHT_SWIPE_BOUNCE_BACK_DISTANCE,
duration,
this._animateToClosedPosition,
this._animateToClosedPositionDuringBounce,
);
},
@ -330,7 +335,7 @@ const SwipeableRow = React.createClass({
if (this._isSwipingRightFromClosed(gestureState)) {
this.props.onOpen();
this._animateBounceBack();
this._animateBounceBack(RIGHT_SWIPE_BOUNCE_BACK_DURATION);
} else if (this._shouldAnimateRemainder(gestureState)) {
if (horizontalDistance < 0) {
// Swiped left