refactor: 优化图层排序逻辑,调整代码格式,移除不可见图层的处理注释
This commit is contained in:
@@ -68,9 +68,9 @@ export class LayerSort {
|
|||||||
const layer = this.layers.value[i];
|
const layer = this.layers.value[i];
|
||||||
|
|
||||||
// 跳过不可见图层
|
// 跳过不可见图层
|
||||||
if (!layer.visible) {
|
// if (!layer.visible) {
|
||||||
continue;
|
// continue;
|
||||||
}
|
// }
|
||||||
|
|
||||||
// 处理不同类型的图层
|
// 处理不同类型的图层
|
||||||
if (layer.isBackground && layer.fabricObject) {
|
if (layer.isBackground && layer.fabricObject) {
|
||||||
@@ -81,7 +81,11 @@ export class LayerSort {
|
|||||||
zIndexMap.set(layer.fabricObject.id, currentZIndex++);
|
zIndexMap.set(layer.fabricObject.id, currentZIndex++);
|
||||||
} else if (!layer.isBackground && !layer.isFixed) {
|
} else if (!layer.isBackground && !layer.isFixed) {
|
||||||
// 普通图层
|
// 普通图层
|
||||||
currentZIndex = this.processLayerObjects(layer, currentZIndex, zIndexMap);
|
currentZIndex = this.processLayerObjects(
|
||||||
|
layer,
|
||||||
|
currentZIndex,
|
||||||
|
zIndexMap
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -108,9 +112,9 @@ export class LayerSort {
|
|||||||
const childLayer = layer.children[i];
|
const childLayer = layer.children[i];
|
||||||
|
|
||||||
// 跳过不可见图层
|
// 跳过不可见图层
|
||||||
if (!childLayer.visible) {
|
// if (!childLayer.visible) {
|
||||||
continue;
|
// continue;
|
||||||
}
|
// }
|
||||||
|
|
||||||
for (let j = childLayer.fabricObjects.length - 1; j >= 0; j--) {
|
for (let j = childLayer.fabricObjects.length - 1; j >= 0; j--) {
|
||||||
const obj = childLayer.fabricObjects[j];
|
const obj = childLayer.fabricObjects[j];
|
||||||
@@ -142,7 +146,8 @@ export class LayerSort {
|
|||||||
getChildLayersInOrder(parentLayerId) {
|
getChildLayersInOrder(parentLayerId) {
|
||||||
// 获取所有子图层
|
// 获取所有子图层
|
||||||
const childLayers =
|
const childLayers =
|
||||||
this.layers.value.filter((layer) => layer.id === parentLayerId)?.children || [];
|
this.layers.value.filter((layer) => layer.id === parentLayerId)
|
||||||
|
?.children || [];
|
||||||
|
|
||||||
return childLayers;
|
return childLayers;
|
||||||
}
|
}
|
||||||
@@ -193,7 +198,9 @@ export class LayerSort {
|
|||||||
|
|
||||||
for (let i = start; i < end; i++) {
|
for (let i = start; i < end; i++) {
|
||||||
const item = sortedObjects[i];
|
const item = sortedObjects[i];
|
||||||
const currentIndex = this.canvas.getObjects().indexOf(item.object);
|
const currentIndex = this.canvas
|
||||||
|
.getObjects()
|
||||||
|
.indexOf(item.object);
|
||||||
if (currentIndex !== i && currentIndex !== -1) {
|
if (currentIndex !== i && currentIndex !== -1) {
|
||||||
this.canvas.moveTo(item.object, i);
|
this.canvas.moveTo(item.object, i);
|
||||||
}
|
}
|
||||||
@@ -285,17 +292,23 @@ export class LayerSort {
|
|||||||
return this.layers.value.length; // 背景图层插入到最后
|
return this.layers.value.length; // 背景图层插入到最后
|
||||||
} else if (newLayer.isFixed) {
|
} else if (newLayer.isFixed) {
|
||||||
// 固定图层插入到背景图层之前
|
// 固定图层插入到背景图层之前
|
||||||
const bgIndex = this.layers.value.findIndex((layer) => layer.isBackground);
|
const bgIndex = this.layers.value.findIndex(
|
||||||
|
(layer) => layer.isBackground
|
||||||
|
);
|
||||||
return bgIndex !== -1 ? bgIndex : this.layers.value.length;
|
return bgIndex !== -1 ? bgIndex : this.layers.value.length;
|
||||||
} else {
|
} else {
|
||||||
// 普通图层插入到固定图层之前
|
// 普通图层插入到固定图层之前
|
||||||
const fixedIndex = this.layers.value.findIndex((layer) => layer.isFixed);
|
const fixedIndex = this.layers.value.findIndex(
|
||||||
|
(layer) => layer.isFixed
|
||||||
|
);
|
||||||
return fixedIndex !== -1 ? fixedIndex : this.layers.value.length;
|
return fixedIndex !== -1 ? fixedIndex : this.layers.value.length;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 如果指定了目标图层,插入到目标图层之前
|
// 如果指定了目标图层,插入到目标图层之前
|
||||||
const targetIndex = this.layers.value.findIndex((layer) => layer.id === targetLayerId);
|
const targetIndex = this.layers.value.findIndex(
|
||||||
|
(layer) => layer.id === targetLayerId
|
||||||
|
);
|
||||||
return targetIndex !== -1 ? targetIndex : this.layers.value.length;
|
return targetIndex !== -1 ? targetIndex : this.layers.value.length;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -523,7 +536,9 @@ export class LayerSort {
|
|||||||
async smartSort(targetLayerIds = null) {
|
async smartSort(targetLayerIds = null) {
|
||||||
const layersToSort = targetLayerIds
|
const layersToSort = targetLayerIds
|
||||||
? this.layers.value.filter((layer) => targetLayerIds.includes(layer.id))
|
? this.layers.value.filter((layer) => targetLayerIds.includes(layer.id))
|
||||||
: this.layers.value.filter((layer) => !layer.isBackground && !layer.isFixed);
|
: this.layers.value.filter(
|
||||||
|
(layer) => !layer.isBackground && !layer.isFixed
|
||||||
|
);
|
||||||
|
|
||||||
if (layersToSort.length <= 1) return true;
|
if (layersToSort.length <= 1) return true;
|
||||||
|
|
||||||
@@ -545,7 +560,9 @@ export class LayerSort {
|
|||||||
|
|
||||||
// 更新图层顺序
|
// 更新图层顺序
|
||||||
const sortedLayerIds = layersToSort.map((layer) => layer.id);
|
const sortedLayerIds = layersToSort.map((layer) => layer.id);
|
||||||
const otherLayers = this.layers.value.filter((layer) => !sortedLayerIds.includes(layer.id));
|
const otherLayers = this.layers.value.filter(
|
||||||
|
(layer) => !sortedLayerIds.includes(layer.id)
|
||||||
|
);
|
||||||
|
|
||||||
// 重新组织图层数组:保持背景层和固定层的位置
|
// 重新组织图层数组:保持背景层和固定层的位置
|
||||||
const newLayers = [];
|
const newLayers = [];
|
||||||
@@ -720,9 +737,12 @@ export const LayerSortUtils = {
|
|||||||
* @returns {number} 排序权重
|
* @returns {number} 排序权重
|
||||||
*/
|
*/
|
||||||
getLayerSortWeight(layer) {
|
getLayerSortWeight(layer) {
|
||||||
if (layer.isBackground) return LayerSortConstants.LAYER_PRIORITY[LayerType.BACKGROUND];
|
if (layer.isBackground)
|
||||||
if (layer.isFixed) return LayerSortConstants.LAYER_PRIORITY[LayerType.FIXED];
|
return LayerSortConstants.LAYER_PRIORITY[LayerType.BACKGROUND];
|
||||||
if (layer.children?.length > 0) return LayerSortConstants.LAYER_PRIORITY[LayerType.GROUP];
|
if (layer.isFixed)
|
||||||
|
return LayerSortConstants.LAYER_PRIORITY[LayerType.FIXED];
|
||||||
|
if (layer.children?.length > 0)
|
||||||
|
return LayerSortConstants.LAYER_PRIORITY[LayerType.GROUP];
|
||||||
return LayerSortConstants.LAYER_PRIORITY[LayerType.NORMAL];
|
return LayerSortConstants.LAYER_PRIORITY[LayerType.NORMAL];
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user