导出印花等所有信息
This commit is contained in:
李志鹏
@@ -30,7 +30,9 @@ import {
|
||||
palletToFill,
|
||||
fillToCssStyle,
|
||||
calculateRotatedTopLeftDeg,
|
||||
calculateCenterPoint,
|
||||
createPatternTransform,
|
||||
getTransformScaleAngle,
|
||||
base64ToCanvas,
|
||||
} from "../utils/helper";
|
||||
import { ChangeFixedImageCommand } from "../commands/ObjectLayerCommands";
|
||||
@@ -566,10 +568,10 @@ export class CanvasManager {
|
||||
}
|
||||
|
||||
// 更新颜色层信息
|
||||
// const colorObject = this.getLayerObjectById(SpecialLayerId.COLOR);
|
||||
// if(colorObject){
|
||||
// await this.setObjecCliptInfo(colorObject);
|
||||
// }
|
||||
const colorObject = this.getLayerObjectById(SpecialLayerId.COLOR);
|
||||
if(colorObject){
|
||||
await this.setObjecCliptInfo(colorObject);
|
||||
}
|
||||
const groupLayer = this.layerManager.getLayerById(SpecialLayerId.SPECIAL_GROUP);
|
||||
if(groupLayer){
|
||||
const groupRect = new fabric.Rect({});
|
||||
@@ -808,6 +810,13 @@ export class CanvasManager {
|
||||
|
||||
return layerObjectByLayerId;
|
||||
}
|
||||
getObjectsByIds(ids){
|
||||
const objects = this.canvas.getObjects().filter((obj) => {
|
||||
return ids.includes(obj.id);
|
||||
});
|
||||
return objects;
|
||||
}
|
||||
|
||||
/**
|
||||
* 更新蒙层位置
|
||||
* @param {Object} backgroundLayerObject 背景层对象
|
||||
@@ -936,6 +945,7 @@ export class CanvasManager {
|
||||
options.restoreOpacityInRedGreen !== undefined
|
||||
? options.restoreOpacityInRedGreen
|
||||
: false, // 默认在红绿图模式下恢复透明度
|
||||
excludedLayers: [SpecialLayerId.SPECIAL_GROUP],
|
||||
};
|
||||
|
||||
// 如果在红绿图模式下且没有指定具体的图层，自动包含所有普通图层
|
||||
@@ -966,6 +976,22 @@ export class CanvasManager {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 导出所有信息
|
||||
* @returns {Object} 包含所有图层信息的对象
|
||||
*/
|
||||
async exportAllInfo() {
|
||||
// 导出颜色图层信息
|
||||
const color = await this.exportColorLayer().catch(() => (null));
|
||||
// 导出印花和元素图层信息
|
||||
const printTrimsData = await this.exportPrintTrimsLayers().catch(() => ({prints: null, trims: null}));
|
||||
|
||||
return {
|
||||
color,
|
||||
...printTrimsData,
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* 导出颜色图层
|
||||
* @returns {Object} 导出的颜色图层数据URL
|
||||
@@ -980,13 +1006,12 @@ export class CanvasManager {
|
||||
console.warn("颜色图层不存在，请确保已添加颜色图层");
|
||||
return Promise.reject("颜色图层不存在");
|
||||
}
|
||||
const color = fillToCssStyle(object.fill)
|
||||
const css = fillToCssStyle(object.fill)
|
||||
const canvas = new fabric.StaticCanvas();
|
||||
canvas.setDimensions({
|
||||
width: object.width,
|
||||
height: object.height,
|
||||
backgroundColor: null,
|
||||
// enableRetinaScaling: true,
|
||||
imageSmoothingEnabled: true,
|
||||
});
|
||||
const cloneObject = await new Promise((resolve, reject) => {
|
||||
@@ -1007,9 +1032,75 @@ export class CanvasManager {
|
||||
quality: 1,
|
||||
});
|
||||
canvas.clear();
|
||||
return {color, base64};
|
||||
const color = object.originColor;
|
||||
return {css, base64, color};
|
||||
}
|
||||
|
||||
/**
|
||||
* 导出印花和元素图层
|
||||
*/
|
||||
async exportPrintTrimsLayers() {
|
||||
const object = this.layerManager.getLayerById(SpecialLayerId.SPECIAL_GROUP);
|
||||
if(!object) return Promise.reject("印花和元素图层组不存在");
|
||||
const ids = object.children.map((v) => v.id);
|
||||
const objects = this.getObjectsByIds(ids).filter((v) => !!v.sourceData);
|
||||
const fixedLayerObj = this.getFixedLayerObject();
|
||||
if(!fixedLayerObj) return Promise.reject("固定图层不存在");
|
||||
const flWidth = fixedLayerObj.width
|
||||
const flHeight = fixedLayerObj.height
|
||||
const flTop = fixedLayerObj.top
|
||||
const flLeft = fixedLayerObj.left
|
||||
const flScaleX = fixedLayerObj.scaleX
|
||||
const flScaleY = fixedLayerObj.scaleY
|
||||
const prints = [];
|
||||
const trims = [];
|
||||
objects.forEach((v) => {
|
||||
const obj = {
|
||||
ifSingle: v.sourceData.ifSingle,
|
||||
level2Type: v.sourceData.level2Type,
|
||||
designType: v.sourceData.designType,
|
||||
path: v.sourceData.path,
|
||||
location: [0, 0],
|
||||
scale: [0, 0],
|
||||
angle: v.angle,
|
||||
name: v.sourceData.name,
|
||||
}
|
||||
if(obj.ifSingle){
|
||||
let left = (v.left - (flLeft - flWidth * flScaleX / 2));
|
||||
let top = (v.top - (flTop - flHeight * flScaleY / 2));
|
||||
let width = (v.width * v.scaleX);
|
||||
let height = (v.height * v.scaleY);
|
||||
let {x:cx, y:cy} = calculateCenterPoint(width, height, left, top, v.angle);
|
||||
let x = (cx-width/2) / flScaleX;
|
||||
let y = (cy-height/2) / flScaleY;
|
||||
obj.location = [x, y];
|
||||
obj.scale = [(v.width * v.scaleX) / (flWidth * flScaleX), (v.height * v.scaleY) / (flHeight * flScaleY)];
|
||||
}else{
|
||||
let fill = v.fill;
|
||||
let fill_ = v.fill_;
|
||||
if(!fill || !fill_) return;
|
||||
let {scale, angle} = getTransformScaleAngle(fill.patternTransform);
|
||||
let scaleX = scale * 5 * v.fill_.width / flWidth;
|
||||
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;
|
||||
|
||||
obj.scale = [scaleXY, scaleXY];
|
||||
obj.angle = angle;
|
||||
obj.location = [left, top];
|
||||
}
|
||||
if(obj.level2Type === "Pattern"){
|
||||
prints.push(obj);
|
||||
}else if(obj.level2Type === "Embroidery"){
|
||||
trims.push(obj);
|
||||
}
|
||||
})
|
||||
return {prints, trims};
|
||||
}
|
||||
|
||||
|
||||
dispose() {
|
||||
// 释放导出管理器资源
|
||||
if (this.exportManager) {
|
||||
@@ -1126,6 +1217,12 @@ export class CanvasManager {
|
||||
"erasable",
|
||||
"customType",
|
||||
"fill_",
|
||||
"scaleX",
|
||||
"scaleY",
|
||||
"top",
|
||||
"left",
|
||||
"width",
|
||||
"height",
|
||||
]),
|
||||
layers: simplifyLayersData, // 简化图层数据
|
||||
// layers: JSON.stringify(JSON.parse(JSON.stringify(this.layers.value))), // 全数据
|
||||
@@ -1300,9 +1397,9 @@ export class CanvasManager {
|
||||
singleLayers.unshift({...print});
|
||||
}
|
||||
})
|
||||
otherData_?.trims?.prints?.forEach((print, index) => {
|
||||
print.name = t("Canvas.Elements") + (index + 1);
|
||||
printTrimsLayers.unshift({...print});
|
||||
otherData_?.trims?.prints?.forEach((trims, index) => {
|
||||
trims.name = t("Canvas.Elements") + (index + 1);
|
||||
printTrimsLayers.unshift({...trims});
|
||||
})
|
||||
await this.createPrintTrimsLayers(printTrimsLayers, singleLayers);
|
||||
}
|
||||
@@ -1350,7 +1447,6 @@ export class CanvasManager {
|
||||
if(!color) return console.warn("颜色为空不需要添加");
|
||||
if(findLayer(this.layers.value, SpecialLayerId.COLOR)) return console.warn("画布中已存在颜色图层");
|
||||
console.log("==========添加颜色图层", color, this.layers.value.length)
|
||||
const fixedLayerObj = this.getFixedLayerObject();
|
||||
// 创建颜色图层对象
|
||||
const colorRect = new fabric.Rect({
|
||||
id: SpecialLayerId.COLOR,
|
||||
@@ -1359,8 +1455,9 @@ export class CanvasManager {
|
||||
isVisible: true,
|
||||
isLocked: true,
|
||||
globalCompositeOperation: BlendMode.MULTIPLY,
|
||||
originColor: color,
|
||||
});
|
||||
// await this.setObjecCliptInfo(colorRect);
|
||||
await this.setObjecCliptInfo(colorRect);
|
||||
const gradientObj = palletToFill(color);
|
||||
const gradient = new fabric.Gradient({
|
||||
type: 'linear',
|
||||
@@ -1398,24 +1495,24 @@ export class CanvasManager {
|
||||
const children = [];
|
||||
// 添加印花和元素图层
|
||||
for(let index = 0; index < printTrimsLayers.length; index++){
|
||||
let print = printTrimsLayers[index];
|
||||
let item = printTrimsLayers[index];
|
||||
let id = generateId("layer_image_");
|
||||
let name = print.name;
|
||||
let name = item.name;
|
||||
let image = await new Promise(resolve => {
|
||||
fabric.Image.fromURL(print.path, (fabricImage)=>{
|
||||
const left = flLeft - flWidth * flScaleX / 2 + (print.location?.[0] || 0) * flScaleX
|
||||
const top = flTop - flHeight * flScaleY / 2 + (print.location?.[1] || 0) * flScaleY
|
||||
const scaleX = flWidth * (print.scale?.[0] || 1) / fabricImage.width * flScaleX
|
||||
const scaleY = flHeight * (print.scale?.[1] || 1) / fabricImage.height * flScaleY
|
||||
fabric.Image.fromURL(item.path, (fabricImage)=>{
|
||||
const left = flLeft - flWidth * flScaleX / 2 + (item.location?.[0] || 0) * flScaleX
|
||||
const top = flTop - flHeight * flScaleY / 2 + (item.location?.[1] || 0) * flScaleY
|
||||
const scaleX = flWidth * (item.scale?.[0] || 1) / fabricImage.width * flScaleX
|
||||
const scaleY = flHeight * (item.scale?.[1] || 1) / fabricImage.height * flScaleY
|
||||
const {x, y} = calculateRotatedTopLeftDeg(
|
||||
fabricImage.width * scaleX,
|
||||
fabricImage.height * scaleY,
|
||||
left,
|
||||
top,
|
||||
0,
|
||||
print.angle || 0
|
||||
item.angle || 0
|
||||
)
|
||||
const angle = print.angle || 0
|
||||
const angle = item.angle || 0
|
||||
fabricImage.set({
|
||||
left: x,
|
||||
top: y,
|
||||
@@ -1428,6 +1525,7 @@ export class CanvasManager {
|
||||
selectable: true,
|
||||
hasControls: true,
|
||||
hasBorders: true,
|
||||
sourceData: item,
|
||||
});
|
||||
resolve(fabricImage);
|
||||
}, { crossOrigin: "anonymous" });
|
||||
@@ -1446,11 +1544,11 @@ export class CanvasManager {
|
||||
};
|
||||
// 添加平铺图层
|
||||
for(let index = 0; index < singleLayers.length; index++){
|
||||
let print = singleLayers[index];
|
||||
let item = singleLayers[index];
|
||||
let id = generateId("layer_image_");
|
||||
let name = print.name;
|
||||
let name = item.name;
|
||||
let image = await new Promise(resolve => {
|
||||
fabric.Image.fromURL(print.path, (fabricImage)=>{
|
||||
fabric.Image.fromURL(item.path, (fabricImage)=>{
|
||||
const imgElement = fabricImage.getElement();
|
||||
const tcanvas = document.createElement('canvas');
|
||||
tcanvas.width = imgElement.width;
|
||||
@@ -1461,12 +1559,11 @@ export class CanvasManager {
|
||||
resolve(tcanvas);
|
||||
}, { crossOrigin: "anonymous" });
|
||||
})
|
||||
console.log("==========添加平铺图层", fixedLayerObj.width,image.width)
|
||||
let scaleX = fixedLayerObj.width / image.width * (print.scale?.[0] || 1) / 5;
|
||||
let scaleY = fixedLayerObj.height / image.height * (print.scale?.[1] || 1) / 5;
|
||||
let scaleX = fixedLayerObj.width / image.width * (item.scale?.[0] || 1) / 5;
|
||||
let scaleY = fixedLayerObj.height / image.height * (item.scale?.[1] || 1) / 5;
|
||||
let scale = fixedLayerObj.width > fixedLayerObj.height ? scaleX : scaleY;
|
||||
let left = (print.location?.[0] || 0) - image.width * scale / 2
|
||||
let top = (print.location?.[1] || 0) - image.height * scale / 2
|
||||
let left = (item.location?.[0] || 0) - image.width * scale / 2
|
||||
let top = (item.location?.[1] || 0) - image.height * scale / 2
|
||||
let rect = new fabric.Rect({
|
||||
id: id,
|
||||
layerId: id,
|
||||
@@ -1479,13 +1576,21 @@ export class CanvasManager {
|
||||
scaleY: fixedLayerObj.scaleY,
|
||||
originX: fixedLayerObj.originX,
|
||||
originY: fixedLayerObj.originY,
|
||||
sourceData: item,
|
||||
fill: new fabric.Pattern({
|
||||
source: image,
|
||||
repeat: "repeat",
|
||||
patternTransform: createPatternTransform(scale, print.angle || 0),
|
||||
patternTransform: createPatternTransform(scale, item.angle || 0),
|
||||
offsetX: left, // 水平偏移
|
||||
offsetY: top, // 垂直偏移
|
||||
}),
|
||||
fill_ : {
|
||||
source: item.path,
|
||||
gapX: 0,
|
||||
gapY: 0,
|
||||
width: image.width,
|
||||
height: image.height,
|
||||
}
|
||||
});
|
||||
this.canvas.add(rect);
|
||||
let layer = createLayer({
|
||||
@@ -1531,31 +1636,32 @@ export class CanvasManager {
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* 画布事件变更后
|
||||
*/
|
||||
async changeCanvas(){
|
||||
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);
|
||||
if(ids.length === 0){
|
||||
ids.unshift(SpecialLayerId.SPECIAL_GROUP);
|
||||
await this.setObjecCliptInfo(colorObject);
|
||||
return;
|
||||
}
|
||||
const base64 = await this.exportManager.exportImage({layerIdArray2: ids, isEnhanceImg: true});
|
||||
if(!base64) return console.warn("导出图片失败", base64)
|
||||
const canvas = await base64ToCanvas(base64, fixedLayerObj.scaleX * 2, true);
|
||||
const ctx = canvas.getContext('2d');
|
||||
const width = fixedLayerObj.width;
|
||||
const height = fixedLayerObj.height;
|
||||
const x = (canvas.width - width) / 2;
|
||||
const y = (canvas.height - height) / 2;
|
||||
const data = ctx.getImageData(x, y, width, height);
|
||||
await this.setObjecCliptInfo(colorObject, data);
|
||||
this.canvas.renderAll();
|
||||
}
|
||||
// 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);
|
||||
// if(ids.length === 0){
|
||||
// ids.unshift(SpecialLayerId.SPECIAL_GROUP);
|
||||
// await this.setObjecCliptInfo(colorObject);
|
||||
// this.canvas.renderAll();
|
||||
// return;
|
||||
// }
|
||||
// const base64 = await this.exportManager.exportImage({layerIdArray2: ids, isEnhanceImg: true});
|
||||
// if(!base64) return console.warn("导出图片失败", base64)
|
||||
// const canvas = await base64ToCanvas(base64, fixedLayerObj.scaleX * 2, true);
|
||||
// const ctx = canvas.getContext('2d');
|
||||
// const width = fixedLayerObj.width;
|
||||
// const height = fixedLayerObj.height;
|
||||
// const x = (canvas.width - width) / 2;
|
||||
// const y = (canvas.height - height) / 2;
|
||||
// const data = ctx.getImageData(x, y, width, height);
|
||||
// await this.setObjecCliptInfo(colorObject, data);
|
||||
// this.canvas.renderAll();
|
||||
// }
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { fabric } from "fabric-with-all";
|
||||
import { findObjectById } from "../utils/helper";
|
||||
import { createRasterizedImage } from "../utils/selectionToImage";
|
||||
import { OperationType, SpecialLayerId } from "../utils/layerHelper";
|
||||
import { OperationType, SpecialLayerId } from "../utils/layerHelper";
|
||||
|
||||
/**
|
||||
* 图片导出管理器
|
||||
@@ -26,7 +26,8 @@ export class ExportManager {
|
||||
* @param {Array} options.layerIdArray2 导出多个图层ID数组2
|
||||
* @param {String} options.expPicType 导出图片类型 (png/jpg/svg)
|
||||
* @param {Boolean} options.restoreOpacityInRedGreen 红绿图模式下是否恢复透明度为1
|
||||
* @param {Boolean} options.isEnhanceImg 是否是增强图片
|
||||
* @param {Boolean} options.isEnhanceImg 是否是增强图片
|
||||
* @param {Array} options.excludedLayers 排除的图层ID数组
|
||||
* @returns {String} 导出的图片数据URL
|
||||
*/
|
||||
async exportImage(options = {}) {
|
||||
@@ -41,6 +42,7 @@ export class ExportManager {
|
||||
expPicType = "png",
|
||||
restoreOpacityInRedGreen = true,
|
||||
isEnhanceImg, // 是否是增强图片
|
||||
excludedLayers = [], // 排除的图层ID数组
|
||||
} = options;
|
||||
try {
|
||||
// 查找颜色图层并隐藏
|
||||
@@ -90,6 +92,7 @@ export class ExportManager {
|
||||
isCropByBg,
|
||||
isEnhanceImg, // 是否是增强图片
|
||||
layerIdArray2,
|
||||
excludedLayers, // 排除的图层ID数组
|
||||
);
|
||||
} catch (error) {
|
||||
console.error("导出图片失败:", error);
|
||||
@@ -240,7 +243,8 @@ export class ExportManager {
|
||||
restoreOpacityInRedGreen,
|
||||
isCropByBg, // 是否使用背景大小裁剪
|
||||
isEnhanceImg, // 是否是增强图片
|
||||
layerIdArray,
|
||||
layerIdArray, // 导出所有图层
|
||||
excludedLayers, // 排除的图层ID数组
|
||||
) {
|
||||
// 按图层顺序收集对象（从底到顶）
|
||||
const objectsToExport = this._collectObjectsByLayerOrder(
|
||||
@@ -248,6 +252,7 @@ export class ExportManager {
|
||||
isContainBg,
|
||||
isContainFixed,
|
||||
isContainFixedOther, // 是否包含其他固定图层
|
||||
excludedLayers,
|
||||
);
|
||||
|
||||
if (objectsToExport.length === 0) {
|
||||
@@ -303,10 +308,11 @@ export class ExportManager {
|
||||
/**
|
||||
* 从图层收集对象（优化版本 - 通过ID查找画布中的真实对象）
|
||||
* @param {Object} layer 图层对象
|
||||
* @param {Boolean} isChildren 是否递归收集子图层的对象
|
||||
* @returns {Array} 画布中的真实对象数组
|
||||
* @private
|
||||
*/
|
||||
_collectObjectsFromLayer(layer) {
|
||||
_collectObjectsFromLayer(layer, isChildren = true) {
|
||||
if (!layer) {
|
||||
return [];
|
||||
}
|
||||
@@ -335,10 +341,10 @@ export class ExportManager {
|
||||
}
|
||||
|
||||
// 递归收集子图层的对象
|
||||
if (layer.children && layer.children.length > 0) {
|
||||
if (isChildren && layer.children && layer.children.length > 0) {
|
||||
for (let i = layer.children.length - 1; i >= 0; i--) {
|
||||
const childLayer = layer.children[i];
|
||||
const childObjects = this._collectObjectsFromLayer(childLayer);
|
||||
const childObjects = this._collectObjectsFromLayer(childLayer, isChildren);
|
||||
realObjects.push(...childObjects);
|
||||
}
|
||||
}
|
||||
@@ -405,12 +411,13 @@ export class ExportManager {
|
||||
* @param {Boolean} isContainBg 是否包含背景图层
|
||||
* @param {Boolean} isContainFixed 是否包含固定图层
|
||||
* @param {Boolean} isContainFixedOther 是否包含其他固定图层
|
||||
* @param {Array} excludedLayers 排除的图层ID数组
|
||||
* @returns {Array} 按正确顺序排列的真实对象数组
|
||||
* @private
|
||||
*/
|
||||
_collectObjectsByLayerOrder(layerIdArray, isContainBg, isContainFixed, isContainFixedOther) {
|
||||
_collectObjectsByLayerOrder(layerIdArray, isContainBg, isContainFixed, isContainFixedOther, excludedLayers) {
|
||||
const objectsToExport = [];
|
||||
const allLayers = this._getAllLayersFlattened(); // 获取扁平化的图层列表
|
||||
const allLayers = this._getAllLayersFlattened(excludedLayers); // 获取扁平化的图层列表
|
||||
|
||||
// 图层数组是从顶到底的顺序，需要反向遍历以获得从底到顶的渲染顺序
|
||||
for (let i = allLayers.length - 1; i >= 0; i--) {
|
||||
@@ -424,7 +431,7 @@ export class ExportManager {
|
||||
continue;
|
||||
|
||||
if (layer.visible) {
|
||||
const layerObjects = this._collectObjectsFromLayer(layer);
|
||||
const layerObjects = this._collectObjectsFromLayer(layer, false);
|
||||
objectsToExport.push(...layerObjects);
|
||||
}
|
||||
}
|
||||
@@ -433,15 +440,19 @@ export class ExportManager {
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取扁平化的图层列表（包含子图层）
|
||||
* 获取扁平化的图层列表（包含子图层），排除指定的图层
|
||||
* @param {Array} excludedLayers 排除的图层ID数组
|
||||
* @returns {Array} 扁平化的图层数组
|
||||
* @private
|
||||
*/
|
||||
_getAllLayersFlattened() {
|
||||
_getAllLayersFlattened(excludedLayers) {
|
||||
const flattenedLayers = [];
|
||||
const rootLayers = this._getAllLayers();
|
||||
|
||||
const flattenLayer = (layer) => {
|
||||
// 检查是否在排除列表中
|
||||
if (excludedLayers && excludedLayers.includes(layer.id)) return;
|
||||
|
||||
flattenedLayers.push(layer);
|
||||
|
||||
// 递归处理子图层
|
||||
@@ -456,7 +467,6 @@ export class ExportManager {
|
||||
for (const layer of rootLayers) {
|
||||
flattenLayer(layer);
|
||||
}
|
||||
|
||||
return flattenedLayers;
|
||||
}
|
||||
|
||||
|
||||
@@ -524,15 +524,16 @@ export class LayerManager {
|
||||
* @param {string} name 图层名称
|
||||
* @param {string} type 图层类型
|
||||
* @param {Object} options 额外选项
|
||||
* @param {boolean} isCmd 是否创建命令
|
||||
* @returns {string} 新创建的图层ID
|
||||
*/
|
||||
async createLayer(name = null, type = LayerType.EMPTY, options = {}) {
|
||||
async createLayer(name = null, type = LayerType.EMPTY, options = {}, isCmd = true) {
|
||||
// 生成唯一ID
|
||||
const layerId = options.id || options.layerId || generateId("layer_");
|
||||
|
||||
// 计算普通图层数量（非背景、非固定）
|
||||
const normalLayersCount = this.layers.value.filter(
|
||||
(layer) => !layer.isBackground && !layer.isFixed
|
||||
(layer) => !layer.isBackground && !layer.isFixed && !layer.isFixedOther
|
||||
).length;
|
||||
// 计算插入位置，如果没有指定insertIndex，则根据当前选中图层决定插入位置
|
||||
// 添加到图层列表
|
||||
@@ -544,7 +545,7 @@ export class LayerManager {
|
||||
// 创建新图层
|
||||
const newLayer = createLayer({
|
||||
id: layerId,
|
||||
name: name || `图层 ${normalLayersCount + 1}`,
|
||||
name: name || this.t("Canvas.EmptyLayer"),
|
||||
type: type,
|
||||
visible: true,
|
||||
locked: false,
|
||||
@@ -573,13 +574,13 @@ export class LayerManager {
|
||||
}
|
||||
|
||||
// 执行命令
|
||||
if (this.commandManager) {
|
||||
if (isCmd && this.commandManager) {
|
||||
await this.commandManager.execute(command);
|
||||
} else {
|
||||
} else{
|
||||
await command.execute();
|
||||
}
|
||||
|
||||
return layerId;
|
||||
return isCmd ? layerId : command;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -973,7 +974,7 @@ export class LayerManager {
|
||||
})
|
||||
// const normalLayers = this.layers.value.filter((l) => !l.isBackground && !l.isFixed && !l.isFixedOther);
|
||||
console.log("普通图层:", normalLayers)
|
||||
if (isChild ? parentLength <= 1 : normalLayers.length <= 1) {
|
||||
if (isChild ? parentLength <= 1 : false) {//normalLayers.length <= 1
|
||||
console.warn("不能删除唯一的普通图层");
|
||||
message.warning(this.t("Canvas.cannotDeleteOnlyLayer"));
|
||||
return false;
|
||||
@@ -3446,7 +3447,7 @@ export class LayerManager {
|
||||
this.layers.value.forEach(layer => {
|
||||
if(layer.id === SpecialLayerId.SPECIAL_GROUP){
|
||||
layer.children.forEach(child => {
|
||||
if(child.blendMode && child.blendMode !== BlendMode.NORMAL){
|
||||
if(child.visible && child.blendMode && child.blendMode !== BlendMode.NORMAL){
|
||||
blendModeLayerIds.push(child.id);
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user