add stroke/pressure sensitivity to freedraw

This commit is contained in:
Ryan Di
2025-06-02 16:39:42 +10:00
parent 6c0ff7fc5c
commit 15dfe0cc7c
4 changed files with 9 additions and 2 deletions

View File

@ -445,6 +445,7 @@ export const newFreeDrawElement = (
points?: ExcalidrawFreeDrawElement["points"];
simulatePressure: boolean;
pressures?: ExcalidrawFreeDrawElement["pressures"];
pressureSensitivity?: ExcalidrawFreeDrawElement["pressureSensitivity"];
} & ElementConstructorOpts,
): NonDeleted<ExcalidrawFreeDrawElement> => {
return {
@ -453,6 +454,7 @@ export const newFreeDrawElement = (
pressures: opts.pressures || [],
simulatePressure: opts.simulatePressure,
lastCommittedPoint: null,
pressureSensitivity: opts.pressureSensitivity ?? 1,
};
};

View File

@ -1041,11 +1041,14 @@ export function getFreeDrawSvgPath(element: ExcalidrawFreeDrawElement) {
? element.points.map(([x, y], i) => [x, y, element.pressures[i]])
: [[0, 0, 0.5]];
const sensitivity = element.pressureSensitivity;
// Consider changing the options for simulated pressure vs real pressure
const options: StrokeOptions = {
simulatePressure: element.simulatePressure,
size: element.strokeWidth * 4.25,
thinning: 0.6,
// if sensitivity is not set, times 4.25 for backwards compatibility
size: element.strokeWidth * (sensitivity !== null ? 1 : 4.25),
thinning: 0.6 * (sensitivity ?? 1),
smoothing: 0.5,
streamline: 0.5,
easing: (t) => Math.sin((t * Math.PI) / 2), // https://easings.net/#easeOutSine

View File

@ -377,6 +377,7 @@ export type ExcalidrawFreeDrawElement = _ExcalidrawElementBase &
type: "freedraw";
points: readonly LocalPoint[];
pressures: readonly number[];
pressureSensitivity: number | null;
simulatePressure: boolean;
lastCommittedPoint: LocalPoint | null;
}>;

View File

@ -302,6 +302,7 @@ const restoreElement = (
lastCommittedPoint: null,
simulatePressure: element.simulatePressure,
pressures: element.pressures,
pressureSensitivity: element.pressureSensitivity ?? null,
});
}
case "image":