From 8857680dc1ac2b4b8cba2018e5c07056eda6f981 Mon Sep 17 00:00:00 2001 From: toddtarsi Date: Wed, 15 Mar 2017 22:33:37 -0500 Subject: [PATCH] Allow for rubber band overscrolling on iOS Untested Resolution for follow up by @maxsalven on #566 --- source/Grid/Grid.js | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/source/Grid/Grid.js b/source/Grid/Grid.js index 2d80a010d..80e62923e 100644 --- a/source/Grid/Grid.js +++ b/source/Grid/Grid.js @@ -1037,15 +1037,6 @@ export default class Grid extends PureComponent { return } - // On iOS, we can arrive at negative offsets by swiping past the start - // To prevent flicker here, we make playing in the negative offset zone cause nothing to happen. - if (event.target.scrollTop < 0) { - return - } - - // Prevent pointer events from interrupting a smooth scroll - this._debounceScrollEnded() - // When this component is shrunk drastically, React dispatches a series of back-to-back scroll events, // Gradually converging on a scrollTop that is within the bounds of the new, smaller height. // This causes a series of rapid renders that is slow for long lists. @@ -1057,6 +1048,16 @@ export default class Grid extends PureComponent { const scrollLeft = Math.min(Math.max(0, totalColumnsWidth - width + scrollbarSize), event.target.scrollLeft) const scrollTop = Math.min(Math.max(0, totalRowsHeight - height + scrollbarSize), event.target.scrollTop) + // On iOS, we can arrive at negative offsets by swiping past the start or past the end + // Luckily for us, scrollTop above already models these constraints + // So, if scrollTop !== event.target.scrollTop, then we're scrolling outside the constraints and don't need rerenders + if (event.target.scrollTop !== scrollTop) { + return + } + + // Prevent pointer events from interrupting a smooth scroll + this._debounceScrollEnded() + // Certain devices (like Apple touchpad) rapid-fire duplicate events. // Don't force a re-render if this is the case. // The mouse may move faster then the animation frame does.