fix

src/component/Canvas/CanvasEditor/managers/CanvasManager.js

@@ -74,6 +74,7 @@ export class CanvasManager {
 	this.props = options.props || {};
 	this.emit = options.emit || (() => {});
 	this.awaitCanvasRun = null;
+	this.canvasChangeing = false;
     // 初始化画布
     this.initializeCanvas();
   }
@@ -338,6 +339,7 @@ export class CanvasManager {
   setupCanvasEvents(activeElementId, layerManager) {
     // 创建画布事件管理器
     this.eventManager = new CanvasEventManager(this.canvas, {
+      canvasManager: this,
       toolManager: this.toolManager,
       animationManager: this.animationManager,
       thumbnailManager: this.thumbnailManager,
@@ -1220,8 +1222,8 @@ backgroundObject.scaleY,'CanvasManager resetCanvasSizeByFixedLayer')
 			let scaleY = scale * 5 * v.fill_.height / flHeight;
 			let scaleXY = flWidth > flHeight ? scaleX : scaleY;
 
-			let left = fill.offsetX - v.fill_.width * scale / 2;
-			let top = fill.offsetY - v.fill_.height * scale / 2;
+			let left = fill.offsetX + v.fill_.width * scale / 2;
+			let top = fill.offsetY + v.fill_.height * scale / 2;
 
 			obj.scale = [scaleXY, scaleXY];
 			obj.angle = angle;
@@ -1670,7 +1672,7 @@ backgroundObject.scaleY,'CanvasManager resetCanvasSizeByFixedLayer')
 	  let flipX = false;
 	  let flipY = false;
 	  let blendMode = BlendMode.MULTIPLY;
-	  if(item.type === "trims") blendMode = BlendMode.NORMAL;// 元素正常
+	//   if(item.type === "trims") blendMode = BlendMode.NORMAL;// 元素正常
 	  if(item.object){
 		opacity = item.object.opacity
 		flipX = item.object.flipX
@@ -1730,8 +1732,8 @@ backgroundObject.scaleY,'CanvasManager resetCanvasSizeByFixedLayer')
 	  let scaleX_ = flWidth / image.width * (item.scale?.[0] || 1) / 5;
 	  let scaleY_ = flHeight / image.height * (item.scale?.[1] || 1) / 5;
 	  let scale = flWidth > flHeight ? scaleX_ : scaleY_;
-      let offsetX = (item.location?.[0] || 0) + image.width * scale / 2
-      let offsetY = (item.location?.[1] || 0) + image.height * scale / 2
+      let offsetX = (item.location?.[0] || 0) - image.width * scale / 2
+      let offsetY = (item.location?.[1] || 0) - image.height * scale / 2
 	  let top = flTop - flHeight * flScaleY / 2
 	  let left = flLeft - flWidth * flScaleX / 2
 	  let scaleX = flScaleX
@@ -1743,7 +1745,7 @@ backgroundObject.scaleY,'CanvasManager resetCanvasSizeByFixedLayer')
 	  let fillSource = image
 	  let flipX = false;
 	  let flipY = false;
-	  let blendMode = BlendMode.MULTIPLY;
+	  let blendMode = BlendMode.NORMAL;
 	  let fill_repeat = "repeat"
 	  if(item.object){
 	    top += item.object.top * flScaleY
@@ -1754,7 +1756,7 @@ backgroundObject.scaleY,'CanvasManager resetCanvasSizeByFixedLayer')
 		angle = item.object.angle
 		flipX = item.object.flipX
 		flipY = item.object.flipY
-		blendMode = item.object.blendMode || BlendMode.MULTIPLY;
+		if(item.object.blendMode) blendMode = item.object.blendMode;
 		gapX = item.object.gapX
 		gapY = item.object.gapY
 		fillSource = imageAddGapToCanvas(image, gapX, gapY);
@@ -1797,10 +1799,10 @@ backgroundObject.scaleY,'CanvasManager resetCanvasSizeByFixedLayer')
 	    name: name,
 	    type: LayerType.BITMAP,
 	    visible: true,
-	    locked: true,
+	    locked: false,
 	    opacity: opacity,
 		isPrintTrims: true,
-		blendMode: BlendMode.MULTIPLY,
+		blendMode: blendMode,
 	    fabricObjects: [rect.toObject(["id", "layerId", "layerName"])],
 		metadata: {sourceData: item},
 	  })
@@ -1841,12 +1843,13 @@ backgroundObject.scaleY,'CanvasManager resetCanvasSizeByFixedLayer')
   /**
    * 画布事件变更后
   */
-  async changeCanvas(){
+  async changeCanvas(fids = [], isBeforeChange = false){
+	if(!isBeforeChange) this.canvasChangeing = false;
 	const fixedLayerObj = this.getFixedLayerObject();
 	if(!fixedLayerObj) return console.warn("固定图层对象不存在", fixedLayerObj)
 	const colorObject = this.getLayerObjectById(SpecialLayerId.COLOR);
 	if(colorObject){
-		const ids = this.layerManager.getBlendModeLayerIds(SpecialLayerId.SPECIAL_GROUP);
+		const ids = this.layerManager.getBlendModeLayerIds(SpecialLayerId.SPECIAL_GROUP).filter(id => !fids.includes(id));
 		if(ids.length === 0){
 			ids.unshift(SpecialLayerId.SPECIAL_GROUP);
 			await this.setObjecCliptInfo(colorObject);
@@ -1866,6 +1869,24 @@ backgroundObject.scaleY,'CanvasManager resetCanvasSizeByFixedLayer')
 		this.canvas.renderAll();
 	}
   }
+  /** 画布变更之前 */
+  async beforeChangeCanvas(objects){
+	if(this.canvasChangeing) return;
+	const ids = objects.filter(v => {
+		return v.isPrintTrims && v.globalCompositeOperation && v.globalCompositeOperation !== BlendMode.NORMAL
+	}).map(v => v.layerId);
+	if(ids.length > 0){
+		this.canvasChangeing = true;
+		this.canvas.getObjects().forEach(v => {
+			if(ids.includes(v.layerId)){
+				v.globalCompositeOperation_ = v.globalCompositeOperation;
+				v.globalCompositeOperation = BlendMode.NORMAL;
+			}
+		})
+		this.canvas.renderAll();
+		await this.changeCanvas(ids, true);
+	}
+  }
 
   /**
    * 缩放红绿图模式内容以适应当前画布大小