smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix resizing: dynamic pointer offset for better UX (#1560)

Browse source
This commit is contained in:
Daishi Kato 2020-05-09 17:57:00 +09:00 • committed by GitHub
parent 8c8458ceb0
commit 3b1d6910aa
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 455 additions and 418 deletions
Download patch file Download diff file Expand all files Collapse all files

38
src/components/App.tsx
View file

@ -24,6 +24,7 @@ import {
resizeElements,
getElementWithResizeHandler,
canResizeMutlipleElements,
getResizeOffsetXY,
getResizeHandlerFromCoords,
isNonDeletedElement,
} from "../element";
@ -1845,6 +1846,7 @@ class App extends React.Component<any, AppState> {
const setResizeHandle = (nextResizeHandle: ResizeTestType) => {
resizeHandle = nextResizeHandle;
};
let resizeOffsetXY: [number, number] = [0, 0];
let isResizingElements = false;
let draggingOccurred = false;
let hitElement: ExcalidrawElement | null = null;
@ -1891,6 +1893,14 @@ class App extends React.Component<any, AppState> {
}
}
}
if (isResizingElements) {
resizeOffsetXY = getResizeOffsetXY(
resizeHandle,
selectedElements,
x,
y,
);
}
if (!isResizingElements) {
hitElement = getElementAtPosition(
elements,
@ -2123,25 +2133,34 @@ class App extends React.Component<any, AppState> {
}
}
const resized =
isResizingElements &&
resizeElements(
if (isResizingElements) {
const selectedElements = getSelectedElements(
globalSceneState.getElements(),
this.state,
);
this.setState({
isResizing: resizeHandle && resizeHandle !== "rotation",
isRotating: resizeHandle === "rotation",
});
const resized = resizeElements(
resizeHandle,
setResizeHandle,
this.state,
this.setAppState,
selectedElements,
resizeArrowFn,
setResizeArrowFn,
event,
x,
y,
resizeOffsetXY[0],
resizeOffsetXY[1],
lastX,
lastY,
);
if (resized) {
lastX = x;
lastY = y;
return;
if (resized) {
lastX = x;
lastY = y;
return;
}
}
if (hitElement && this.state.selectedElementIds[hitElement.id]) {
@ -2310,6 +2329,7 @@ class App extends React.Component<any, AppState> {
this.savePointer(childEvent.clientX, childEvent.clientY, "up");
resizeArrowFn = null;
resizeOffsetXY = [0, 0];
lastPointerUp = null;
window.removeEventListener(EVENT.POINTER_MOVE, onPointerMove);