whiteboard画矩形圆形菱形时增加按住shift时画正方形正圆或正菱形支持

This commit is contained in:
jingrow 2026-05-04 18:29:27 +08:00
parent 2a3d348cf1
commit 4d87590d4c

View File

@ -227,7 +227,7 @@ export class BoardInteractionManager {
this.updateRendererSelection()
} else if (this.state.isDrawing && this.state.drawingStartElement) {
// 更新正在绘制的形状大小
this.handleDrawingMove(worldPos)
this.handleDrawingMove(worldPos, e)
} else if (this.state.isFreehanding) {
this.handleFreehandMove(worldPos)
} else if (this.currentTool === 'select') {
@ -690,7 +690,7 @@ export class BoardInteractionManager {
}
/** 形状绘制 - 移动 */
private handleDrawingMove(worldPos: Point): void {
private handleDrawingMove(worldPos: Point, e: MouseEvent): void {
if (!this.state.drawingStartElement || !this.state.draggedElementId) return
const start = this.state.drawingStartElement
const el = this.board.getElement(this.state.draggedElementId)
@ -705,14 +705,25 @@ export class BoardInteractionManager {
arrow.y = Math.min(start.y, worldPos.y)
arrow.width = Math.max(Math.abs(worldPos.x - start.x), 1)
arrow.height = Math.max(Math.abs(worldPos.y - start.y), 1)
} else {
} else if (el.type === 'rectangle' || el.type === 'ellipse' || el.type === 'diamond' || el.type === 'sticky-note') {
// 矩形/椭圆/菱形/便利贴:标准包围盒绘制
const x = Math.min(start.x, worldPos.x)
const y = Math.min(start.y, worldPos.y)
const width = Math.abs(worldPos.x - start.x)
const height = Math.abs(worldPos.y - start.y)
let rawW = Math.abs(worldPos.x - start.x)
let rawH = Math.abs(worldPos.y - start.y)
let x = Math.min(start.x, worldPos.x)
let y = Math.min(start.y, worldPos.y)
if (e.shiftKey && rawW > 0 && rawH > 0) {
// Shift 约束长宽比 → 正方形/正圆
const size = Math.max(rawW, rawH)
rawW = size
rawH = size
// 保持起点为包围盒左上角
x = start.x <= worldPos.x ? start.x : start.x - size
y = start.y <= worldPos.y ? start.y : start.y - size
}
this.board.updateElementPosition(el.id, x, y)
this.board.updateElementSize(el.id, Math.max(width, 1), Math.max(height, 1))
this.board.updateElementSize(el.id, rawW, rawH)
}
this.renderer.forceRedraw()