diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx index b0293b781..294c0675d 100644 --- a/packages/excalidraw/components/App.tsx +++ b/packages/excalidraw/components/App.tsx @@ -534,6 +534,8 @@ const gesture: Gesture = { initialScale: null, }; +let velocityX = 0; + class App extends React.Component { canvas: AppClassProperties["canvas"]; interactiveCanvas: AppClassProperties["interactiveCanvas"] = null; @@ -739,6 +741,17 @@ class App extends React.Component { this.actionManager.registerAction( createRedoAction(this.history, this.store), ); + + setInterval(() => { + if (!this.device.isTouchScreen) { + return; + } + + this.translateCanvas((state) => ({ + scrollX: state.scrollX - velocityX / state.zoom.value, + })); + velocityX /= 1 + 1 / 64; + }); } private onWindowMessage(event: MessageEvent) { @@ -7967,6 +7980,15 @@ class App extends React.Component { points: [...points, [dx, dy]], pressures, }); + + if (visualViewport) { + const feedback = + (event.pageX - visualViewport.pageLeft) / visualViewport.width; + if (feedback >= 0.625) { + const delta = Math.abs(dy) * this.state.zoom.value; + velocityX += ((feedback - 0.625) * delta) / 64; + } + } } } else if (isLinearElement(newElement)) { pointerDownState.drag.hasOccurred = true;