corkine/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw synced 2025-07-25 13:58:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

differentiate freedraw config based on input type

Browse Source
This commit is contained in:
dwelle
2025-06-27 14:07:12 +02:00
parent d9c85ff18f
commit 3c07ff358a
2 changed files with 28 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
packages/element/src/freedraw.ts
View File

@ -6,20 +6,38 @@ import getStroke from "perfect-freehand";
import type { StrokeOptions } from "perfect-freehand"; import type { StrokeOptions } from "perfect-freehand";
import type { ExcalidrawFreeDrawElement } from "./types"; import type { ExcalidrawFreeDrawElement, PointerType } from "./types";
export const DRAWING_CONFIGS = { export const DRAWING_CONFIGS: Record<
PointerType | "default",
{ streamline: number; simplify: number }
> = {
default: { default: {
streamline: 0.35, streamline: 0.35,
simplify: 0.1, simplify: 0.1,
}, },
// for optimal performance, we use a lower streamline and simplify mouse: {
stylus: { streamline: 0.6,
streamline: 0.35, simplify: 0.1,
},
pen: {
// for optimal performance, we use a lower streamline and simplify
streamline: 0.2,
simplify: 0.1,
},
touch: {
streamline: 0.65,
simplify: 0.1, simplify: 0.1,
}, },
} as const; } as const;
export const getFreedrawConfig = (eventType: string | null | undefined) => {
return (
DRAWING_CONFIGS[(eventType as PointerType | null) || "default"] ||
DRAWING_CONFIGS.default
);
};
/** /**
* Calculates simulated pressure based on velocity between consecutive points. * Calculates simulated pressure based on velocity between consecutive points.
* Fast movement (large distances) -> lower pressure * Fast movement (large distances) -> lower pressure

9
packages/excalidraw/components/App.tsx
View File

@ -233,6 +233,7 @@ import {
isLineElement, isLineElement,
isSimpleArrow, isSimpleArrow,
DRAWING_CONFIGS, DRAWING_CONFIGS,
getFreedrawConfig,
} from "@excalidraw/element"; } from "@excalidraw/element";
import type { LocalPoint, Radians } from "@excalidraw/math"; import type { LocalPoint, Radians } from "@excalidraw/math";
@ -7475,6 +7476,8 @@ class App extends React.Component<AppProps, AppState> {
const simulatePressure = event.pressure === 0.5 || event.pressure === 0; const simulatePressure = event.pressure === 0.5 || event.pressure === 0;
const freedrawConfig = getFreedrawConfig(event.pointerType);
const element = newFreeDrawElement({ const element = newFreeDrawElement({
type: elementType, type: elementType,
x: gridX, x: gridX,
@ -7491,10 +7494,8 @@ class App extends React.Component<AppProps, AppState> {
drawingConfigs: { drawingConfigs: {
fixedStrokeWidth: this.state.currentItemFixedStrokeWidth, fixedStrokeWidth: this.state.currentItemFixedStrokeWidth,
streamline: streamline:
window.h?.debugFreedraw?.streamline ?? window.h?.debugFreedraw?.streamline ?? freedrawConfig.streamline,
DRAWING_CONFIGS.default.streamline, simplify: window.h?.debugFreedraw?.simplify ?? freedrawConfig.simplify,
simplify:
window.h?.debugFreedraw?.simplify ?? DRAWING_CONFIGS.default.simplify,
}, },
locked: false, locked: false,
frameId: topLayerFrame ? topLayerFrame.id : null, frameId: topLayerFrame ? topLayerFrame.id : null,