aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 液化撤销问题修复+选取更改逻辑+右键删除组图层问题修复

Browse Source
This commit is contained in:
bighuixiang
2025-07-09 00:22:03 +08:00
parent 5cc93aeba4
commit 943b49c1d7
9 changed files with 1668 additions and 545 deletions
Download Patch File Download Diff File Expand all files Collapse all files

139
src/component/Canvas/CanvasEditor/commands/LiquifyCommands.js
View File

@@ -508,6 +508,9 @@ export class LiquifyStateCommand extends Command {
// 获取引用管理器实例
this.refManager = getLiquifyReferenceManager();
// 实时更新实例
this.realtimeUpdater = options.realtimeUpdater || null;
// 注册对象到引用管理器
this.objectRefId = this.refManager.registerObject(
this.targetObject,
@@ -587,17 +590,49 @@ export class LiquifyStateCommand extends Command {
this.initialSnapshotId
);
// 恢复液化管理器到初始状态
// 恢复液化管理器到初始状态 - 关键修复
if (this.liquifyManager) {
if (this.initialLiquifyState) {
this._restoreLiquifyManagerState(this.initialLiquifyState);
} else {
// 如果没有初始状态，重置液化管理器
this.liquifyManager.reset();
// 重新准备液化环境
// if (this.initialLiquifyState) {
// this._restoreLiquifyManagerState(this.initialLiquifyState);
// } else {
// 如果没有初始状态，重置液化管理器并重新初始化
this.liquifyManager.reset();
const currentTarget = this.refManager.getObjectRef(this.objectRefId);
if (currentTarget) {
// 重新准备液化环境，使用初始图像数据
await this.liquifyManager.prepareForLiquify(currentTarget);
// 强制设置原始图像数据为初始状态
if (this.liquifyManager.enhancedManager) {
this.liquifyManager.enhancedManager.originalImageData =
this.initialImageData;
this.liquifyManager.enhancedManager.currentImageData =
this._cloneImageData(this.initialImageData);
// 重置激活渲染器的数据
if (this.liquifyManager.enhancedManager.activeRenderer) {
const renderer = this.liquifyManager.enhancedManager.activeRenderer;
renderer.originalImageData = this.initialImageData;
renderer.currentImageData = this._cloneImageData(
this.initialImageData
);
// 重置CPU渲染器的网格和变形历史
if (renderer.reset) {
renderer.reset();
}
// }
}
}
}
// 确保实时更新器使用正确的目标对象和初始数据
if (this.realtimeUpdater) {
const currentTarget = this.refManager.getObjectRef(this.objectRefId);
if (currentTarget) {
await this.liquifyManager.prepareForLiquify(currentTarget);
this.realtimeUpdater.targetObject = currentTarget;
// 重置实时更新器的内部状态
if (this.realtimeUpdater.reset) {
this.realtimeUpdater.reset();
}
}
}
@@ -605,7 +640,7 @@ export class LiquifyStateCommand extends Command {
this.currentState = "initial";
this.canvas.renderAll();
console.log("🔄 液化命令撤销完成，恢复初始状态");
console.log("🔄 液化命令撤销完成，恢复初始状态（已重置所有内部状态）");
return true;
}
@@ -761,20 +796,22 @@ export class LiquifyStateCommand extends Command {
if (!this.liquifyManager) return null;
try {
const enhancedManager = this.liquifyManager.enhancedManager;
const state = {
// 捕获增强管理器状态
enhancedManagerState: null,
// 捕获当前渲染器状态
activeRendererState: null,
// 捕获目标对象引用
targetObjectRef: this.liquifyManager.targetObject,
targetObjectRef:
this.liquifyManager.targetObject ?? enhancedManager.targetObject,
// 捕获初始化状态
initialized: this.liquifyManager.initialized || false,
};
// 如果有增强管理器，捕获其状态
if (this.liquifyManager.enhancedManager) {
const enhancedManager = this.liquifyManager.enhancedManager;
state.enhancedManagerState = {
initialized: enhancedManager.initialized,
renderMode: enhancedManager.renderMode,
@@ -829,6 +866,17 @@ export class LiquifyStateCommand extends Command {
this.liquifyManager.targetObject = state.targetObjectRef;
}
// 确保实时更新器使用正确的目标对象
if (this.realtimeUpdater) {
this.realtimeUpdater.targetObject = this.liquifyManager.targetObject;
// 如果有setTargetObject方法，调用它
if (typeof this.realtimeUpdater.setTargetObject === "function") {
this.realtimeUpdater.setTargetObject(
this.liquifyManager.targetObject
);
}
}
// 恢复增强管理器状态
if (state.enhancedManagerState && this.liquifyManager.enhancedManager) {
const enhancedManager = this.liquifyManager.enhancedManager;
@@ -837,6 +885,8 @@ export class LiquifyStateCommand extends Command {
enhancedManager.initialized = enhancedState.initialized;
enhancedManager.renderMode = enhancedState.renderMode;
enhancedManager.targetObject = enhancedState.targetObject;
// 关键修复：确保图像数据被正确恢复
enhancedManager.originalImageData = enhancedState.originalImageData;
enhancedManager.currentImageData = enhancedState.currentImageData;
enhancedManager.params = { ...enhancedState.params };
@@ -848,6 +898,8 @@ export class LiquifyStateCommand extends Command {
const rendererState = state.activeRendererState;
renderer.initialized = rendererState.initialized;
// 关键修复：强制重置渲染器的图像数据
renderer.originalImageData = rendererState.originalImageData;
renderer.currentImageData = rendererState.currentImageData;
renderer.params = { ...rendererState.params };
@@ -856,16 +908,45 @@ export class LiquifyStateCommand extends Command {
// 恢复网格状态（如果是CPU渲染器）
if (rendererState.meshState && renderer.mesh) {
this._restoreMeshState(renderer.mesh, rendererState.meshState);
} else if (renderer.mesh && renderer._initMesh) {
// 如果没有保存的网格状态，重新初始化网格
renderer._initMesh(
rendererState.originalImageData?.width ||
renderer.originalImageData?.width,
rendererState.originalImageData?.height ||
renderer.originalImageData?.height
);
}
// 恢复变形历史
// 重置变形历史
if (rendererState.deformHistory) {
renderer.deformHistory = [...rendererState.deformHistory];
} else {
// 如果没有保存的历史，清空变形历史
renderer.deformHistory = [];
}
// 重置持续按压相关状态（如果存在）
if (renderer.isHolding !== undefined) {
renderer.isHolding = false;
renderer.pressStartTime = 0;
renderer.pressDuration = 0;
renderer.accumulatedRotation = 0;
renderer.accumulatedScale = 0;
renderer.lastApplyTime = 0;
}
// 重置拖拽状态（如果存在）
if (renderer.isDragging !== undefined) {
renderer.isDragging = false;
renderer.dragDistance = 0;
renderer.dragAngle = 0;
renderer.isFirstApply = true;
}
}
}
console.log(`🔄 液化管理器状态已恢复`);
console.log(`🔄 液化管理器状态已恢复（包含完整的数据重置）`);
} catch (error) {
console.error("恢复液化管理器状态失败:", error);
}
@@ -917,6 +998,36 @@ export class LiquifyStateCommand extends Command {
}
}
}
/**
* 克隆图像数据
* @param {ImageData} imageData 原始图像数据
* @returns {ImageData} 克隆的图像数据
* @private
*/
_cloneImageData(imageData) {
if (!imageData) return null;
try {
// 使用新的浏览器API直接复制
return new ImageData(
new Uint8ClampedArray(imageData.data),
imageData.width,
imageData.height
);
} catch (e) {
console.warn("使用备选方法克隆ImageData");
// 备选方法
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");
canvas.width = imageData.width;
canvas.height = imageData.height;
ctx.putImageData(imageData, 0, 0);
return ctx.getImageData(0, 0, imageData.width, imageData.height);
}
}
}
/**