111
This commit is contained in:
@@ -0,0 +1,65 @@
|
||||
import { fabric } from 'fabric-with-all'
|
||||
/** 智能框选工具管理器 */
|
||||
export class AISelectboxToolManager {
|
||||
// 管理器
|
||||
canvasManager: any
|
||||
stateManager: any
|
||||
layerManager: any
|
||||
|
||||
isDragging: boolean = false
|
||||
startX: number = 0
|
||||
startY: number = 0
|
||||
demoObject: any
|
||||
constructor(options) {
|
||||
this.canvasManager = options.canvasManager
|
||||
this.stateManager = options.stateManager
|
||||
this.layerManager = options.layerManager
|
||||
}
|
||||
mouseDownEvent(e) {
|
||||
this.isDragging = true
|
||||
this.startX = e.absolutePointer.x
|
||||
this.startY = e.absolutePointer.y
|
||||
const rect = new fabric.Rect({
|
||||
left: this.startX,
|
||||
top: this.startY,
|
||||
width: 0,
|
||||
height: 0,
|
||||
fill: 'transparent',
|
||||
stroke: '#000',
|
||||
strokeWidth: 1,
|
||||
evented: false,
|
||||
})
|
||||
this.demoObject = rect
|
||||
this.canvasManager.canvas.add(rect)
|
||||
this.canvasManager.canvas.renderAll()
|
||||
}
|
||||
mouseMoveEvent(e) {
|
||||
if (!this.isDragging) return;
|
||||
var width = e.absolutePointer.x - this.startX
|
||||
var height = e.absolutePointer.y - this.startY
|
||||
var left = this.startX
|
||||
var top = this.startY
|
||||
if(width < 0) {
|
||||
left += width
|
||||
width = -width
|
||||
}
|
||||
if(height < 0) {
|
||||
top += height
|
||||
height = -height
|
||||
}
|
||||
this.demoObject.set({ width, height, left, top })
|
||||
this.canvasManager.canvas.renderAll()
|
||||
}
|
||||
mouseUpEvent(e) {
|
||||
if (!this.isDragging) return;
|
||||
this.isDragging = false;
|
||||
const object = this.demoObject.toJSON("evented")
|
||||
if (object.width === 0) object.width = 100
|
||||
if (object.height === 0) object.height = 100
|
||||
// console.log(object)
|
||||
this.canvasManager.canvas.remove(this.demoObject)
|
||||
this.canvasManager.canvas.renderAll()
|
||||
|
||||
}
|
||||
dispose() { }
|
||||
}
|
||||
Reference in New Issue
Block a user