diff --git a/src/assets/json/events.json b/src/assets/json/events.json index 647059e9..85c53e11 100644 --- a/src/assets/json/events.json +++ b/src/assets/json/events.json @@ -25,7 +25,7 @@ { "paragraph": [ { - "text": "Scan the QR code for more information and to join the competition! The AiDA Global Design Award 2026 is an international design competition hosted by Code‑Create, a globally leading AI fashion solutions provider, celebrating the future of creativity powered by artificial intelligence. Open to designers from Hong Kong, China, Singapore, South Korea, and beyond, the competition brings together global talent, empowering AI as a creative partner—pushing fashion beyond traditional boundaries and unlocking new possibilities where technology amplifies human imagination." + "text": "Click the “View Details” button for more information and to join the competition! The AiDA Global Design Award 2026 is an international design competition hosted by Code‑Create, a globally leading AI fashion solutions provider, celebrating the future of creativity powered by artificial intelligence. Open to designers from Hong Kong, China, Singapore, South Korea, and beyond, the competition brings together global talent, empowering AI as a creative partner—pushing fashion beyond traditional boundaries and unlocking new possibilities where technology amplifies human imagination." } ] }, diff --git a/src/assets/json/events_cn.json b/src/assets/json/events_cn.json index cc704db1..a3589714 100644 --- a/src/assets/json/events_cn.json +++ b/src/assets/json/events_cn.json @@ -25,7 +25,7 @@ { "paragraph": [ { - "text": "秉承推动 AI 赋能创意设计的初衷,Code‑Create 举办了「AiDA 全球设计大奖 2026」,面向来自香港、中国、新加坡、韩国及全球的设计师,鼓励大家探索 AI 与时尚设计的无限可能,突破传统界限,释放科技与想象力的创新潜能。扫描二维码获取更多比赛信息,抓住成为 AI 时尚先锋的机会吧!" + "text": "秉承推动 AI 赋能创意设计的初衷,Code‑Create 举办了「AiDA 全球设计大奖 2026」,面向来自香港、中国、新加坡、韩国及全球的设计师,鼓励大家探索 AI 与时尚设计的无限可能,突破传统界限,释放科技与想象力的创新潜能。点击“查看详情”按钮获取更多比赛信息,抓住成为 AI 时尚先锋的机会吧!" } ] }, diff --git a/src/component/Canvas/CanvasEditor/managers/CanvasManager.js b/src/component/Canvas/CanvasEditor/managers/CanvasManager.js index b7583264..3ef78c99 100644 --- a/src/component/Canvas/CanvasEditor/managers/CanvasManager.js +++ b/src/component/Canvas/CanvasEditor/managers/CanvasManager.js @@ -9,7 +9,6 @@ import { isGroupLayer, OperationType, OperationTypes, - findLayer, createLayer, LayerType, SpecialLayerId, @@ -20,7 +19,6 @@ import { AnimationManager } from "./animation/AnimationManager"; import { createCanvas } from "../utils/canvasFactory"; import { CanvasEventManager } from "./events/CanvasEventManager"; import CanvasConfig from "../config/canvasConfig"; -import { RedGreenModeManager } from "./RedGreenModeManager"; import { EraserStateManager } from "./EraserStateManager"; import { deepClone, diff --git a/src/component/Canvas/CanvasEditor/managers/PartManager.js b/src/component/Canvas/CanvasEditor/managers/PartManager.js index 8e4208b7..2cf19608 100644 --- a/src/component/Canvas/CanvasEditor/managers/PartManager.js +++ b/src/component/Canvas/CanvasEditor/managers/PartManager.js @@ -90,16 +90,17 @@ export class PartManager { if (toolId === OperationType.PART_ERASER) { this.setEraserTool(); - } else if (toolId === OperationType.PART || toolId === OperationType.PART_RECTANGLE) { - this.clearPointData(); - this.resetPartObject(); - } - if (toolId === OperationType.PART_ERASER || toolId === OperationType.PART_BRUSH) { - if (this.pointList.length > 0) { - this.clearPointData(); - this.resetPartObject(); - } - } + } + // else if (toolId === OperationType.PART || toolId === OperationType.PART_RECTANGLE) { + // this.clearPointData(); + // this.resetPartObject(); + // } + // if (toolId === OperationType.PART_ERASER || toolId === OperationType.PART_BRUSH) { + // if (this.pointList.length > 0) { + // this.clearPointData(); + // this.resetPartObject(); + // } + // } // 如果从非选区工具切换到选区工具,初始化事件 if (!wasActive && this.isActive) { @@ -380,7 +381,8 @@ export class PartManager { box: [...this.pointList], }); const image = await this.loadImageToObject(url); - const canvas = getObjectAlphaToCanvas(image, null, 0, this.rgba); + const data = this.partCanvas?.getContext("2d")?.getImageData(0, 0, this.partCanvas.width, this.partCanvas.height); + const canvas = getObjectAlphaToCanvas(image, data, 0, this.rgba, !!data); this.partDrawCommand(canvas); } /** 获取分隔后图片 */ diff --git a/src/component/Canvas/CanvasEditor/utils/objectHelper.js b/src/component/Canvas/CanvasEditor/utils/objectHelper.js index d52d02fc..7caa973d 100644 --- a/src/component/Canvas/CanvasEditor/utils/objectHelper.js +++ b/src/component/Canvas/CanvasEditor/utils/objectHelper.js @@ -65,9 +65,10 @@ export async function restoreFabricObject(serializedObject, canvas) { * @param {ImageData} revData - 相反的ImageData,白通道的相同位置是否为透明,revData为白色为透明,黑色为不透明 * @param {number} diff - 差值,默认 25 * @param {Object} rgba - 自定义 rgba 值,默认 { r: 255, g: 255, b: 255, a: 255 } + * @param {boolean} isMerge - 是否合并,true=合并revData,false=反转revData * @returns {HTMLCanvasElement|null} 包含黑白通道的画布,或 null 如果失败 */ -export function getObjectAlphaToCanvas(object, revData, diff = 30, rgba = { r: 255, g: 255, b: 255, a: 255 }) { +export function getObjectAlphaToCanvas(object, revData, diff = 30, rgba = { r: 255, g: 255, b: 255, a: 255 }, isMerge = false) { const image = object.getElement(); if (image.nodeName !== "IMG" && image.nodeName !== "CANVAS") { console.warn("对象不是图片"); @@ -93,18 +94,20 @@ export function getObjectAlphaToCanvas(object, revData, diff = 30, rgba = { r: 2 const revG = revData?.data[i + 1] || 0; const revB = revData?.data[i + 2] || 0; const revA = revData?.data[i + 3] || 0; + let isHave = false; if (r || g || b || a) { if (revR > diff || revG > diff || revB > diff || revA > diff) { - data.data[i + 0] = 0; - data.data[i + 1] = 0; - data.data[i + 2] = 0; - data.data[i + 3] = 0; + isHave = false; } else { - data.data[i + 0] = rgba.r; - data.data[i + 1] = rgba.g; - data.data[i + 2] = rgba.b; - data.data[i + 3] = rgba.a; + isHave = true; } + } + if (isMerge && (revR || revG || revB || revA)) isHave = true; + if (isHave) { + data.data[i + 0] = rgba.r; + data.data[i + 1] = rgba.g; + data.data[i + 2] = rgba.b; + data.data[i + 3] = rgba.a; } else { data.data[i + 0] = 0; data.data[i + 1] = 0; diff --git a/src/component/Canvas/canvasExample.vue b/src/component/Canvas/canvasExample.vue index 7a961666..513e2778 100644 --- a/src/component/Canvas/canvasExample.vue +++ b/src/component/Canvas/canvasExample.vue @@ -333,6 +333,7 @@ ]); const canvasLoadJsonSuccess = () => { console.log("画布加载JSON成功"); + return; canvasEditor.value?.updateOtherLayers({ color: { rgba: { r: 255, g: 0, b: 0, a: 1 } }, printObject: { diff --git a/src/component/Events/eventsDetail.vue b/src/component/Events/eventsDetail.vue index aaccbc03..a1339e17 100644 --- a/src/component/Events/eventsDetail.vue +++ b/src/component/Events/eventsDetail.vue @@ -1,142 +1,171 @@ \ No newline at end of file +.detail-btn { + // width: 11rem; + padding: 0 1.4rem; + height: 4rem; + line-height: 4rem; + text-align: center; + color: #fff; + border-radius: 2rem; + background-color: #000; + font-size: 1.4rem; + white-space: nowrap; + cursor: pointer; +} + diff --git a/src/lang/cn.ts b/src/lang/cn.ts index 0e3f6d61..413486ec 100644 --- a/src/lang/cn.ts +++ b/src/lang/cn.ts @@ -1529,7 +1529,8 @@ export default { LiquefactionTool: '液化工具' }, event: { - back: '返回' + back: '返回', + detail:'查看详情' }, admin: { allUser: '所有用户', diff --git a/src/lang/en.ts b/src/lang/en.ts index 420c3f95..3ec78bec 100644 --- a/src/lang/en.ts +++ b/src/lang/en.ts @@ -1586,7 +1586,8 @@ export default { LiquefactionTool: 'Liquefaction Tool' }, event: { - back: 'Back' + back: 'Back', + detail:'View Details' }, admin: { allUser: 'All User',