diff --git a/packages/webgal/src/Core/Modules/animationFunctions.ts b/packages/webgal/src/Core/Modules/animationFunctions.ts index a399013fc..bf9d167ae 100644 --- a/packages/webgal/src/Core/Modules/animationFunctions.ts +++ b/packages/webgal/src/Core/Modules/animationFunctions.ts @@ -29,7 +29,7 @@ export function getAnimationObject(animationName: string, target: string, durati newEffect = cloneDeep({ ...baseTransform, duration: 0, ease: '' }); } - PixiStage.assignTransform(newEffect, effect); + PixiStage.assignTransform(newEffect, effect, false); newEffect.duration = effect.duration; newEffect.ease = effect.ease; return newEffect; diff --git a/packages/webgal/src/Core/controller/stage/pixi/PixiController.ts b/packages/webgal/src/Core/controller/stage/pixi/PixiController.ts index 76ec7f3d6..cba8451d4 100644 --- a/packages/webgal/src/Core/controller/stage/pixi/PixiController.ts +++ b/packages/webgal/src/Core/controller/stage/pixi/PixiController.ts @@ -67,12 +67,19 @@ window.PIXI = PIXI; INSTALLED.push(GifResource); export default class PixiStage { - public static assignTransform(target: T, source?: ITransform) { + public static assignTransform(target: T, source?: ITransform, convertAlpha = true) { if (!source) return; const targetScale = target.scale; const targetPosition = target.position; if (target.scale) Object.assign(targetScale, source.scale); if (target.position) Object.assign(targetPosition, source.position); + if (convertAlpha) { + const sourceAlpha = source.alpha; + if (sourceAlpha !== undefined) { + source.alpha = 1; + (source as any).alphaFilterVal = sourceAlpha; + } + } Object.assign(target, source); target.scale = targetScale; target.position = targetPosition; diff --git a/packages/webgal/src/Core/controller/stage/pixi/WebGALPixiContainer.ts b/packages/webgal/src/Core/controller/stage/pixi/WebGALPixiContainer.ts index 3b435931f..c755f81c4 100644 --- a/packages/webgal/src/Core/controller/stage/pixi/WebGALPixiContainer.ts +++ b/packages/webgal/src/Core/controller/stage/pixi/WebGALPixiContainer.ts @@ -333,9 +333,18 @@ export class WebGALPixiContainer extends PIXI.Container { private baseX = 0; private baseY = 0; + private alphaFilter = new PIXI.filters.AlphaFilter(1); public constructor() { super(); + this.addInternalFilterInstance(this.alphaFilter); + } + + public get alphaFilterVal(): number { + return this.alphaFilter.alpha; + } + public set alphaFilterVal(v: number) { + this.alphaFilter.alpha = v; } public removeFilterByName(filterName: string) { @@ -622,6 +631,10 @@ export class WebGALPixiContainer extends PIXI.Container { let insertIndex = this.filters.length; for (let i = 0; i < this.filters.length; i++) { const currentFilter = this.filters[i]!; + if (currentFilter === this.alphaFilter) { + insertIndex = i; + break; + } const currentName = this.filterToName.get(currentFilter); if (currentName) { const currentPriority = FILTER_CONFIGS[currentName]?.priority ?? 0; @@ -651,4 +664,12 @@ export class WebGALPixiContainer extends PIXI.Container { this.insertFilterWithPriority(filterName, inst); return inst; } + + private addInternalFilterInstance(filter: PIXI.Filter): void { + if (!this.filters) { + this.filters = [filter]; + } else { + this.filters.push(filter); + } + } } diff --git a/packages/webgal/src/Core/controller/stage/pixi/animations/timeline.ts b/packages/webgal/src/Core/controller/stage/pixi/animations/timeline.ts index a49d55787..69ac9d5bc 100644 --- a/packages/webgal/src/Core/controller/stage/pixi/animations/timeline.ts +++ b/packages/webgal/src/Core/controller/stage/pixi/animations/timeline.ts @@ -19,9 +19,6 @@ export function generateTimelineObj( targetKey: string, duration: number, ): IAnimationObject { - for (const segment of timeline) { - // Alpha 现在直接使用原生属性,无需转换为 alphaFilterVal - } const target = WebGAL.gameplay.pixiStage!.getStageObjByKey(targetKey); let currentDelay = 0; const values = []; diff --git a/packages/webgal/src/Core/controller/stage/pixi/animations/universalSoftIn.ts b/packages/webgal/src/Core/controller/stage/pixi/animations/universalSoftIn.ts index 61f8a3d69..a4cbfc868 100644 --- a/packages/webgal/src/Core/controller/stage/pixi/animations/universalSoftIn.ts +++ b/packages/webgal/src/Core/controller/stage/pixi/animations/universalSoftIn.ts @@ -14,7 +14,7 @@ export function generateUniversalSoftInAnimationObj(targetKey: string, duration: elapsedTime = 0; // Reset timer when animation starts if (target?.pixiContainer) { // 修正:不再强制设为 0,而是记录当前的透明度 - startAlpha = target.pixiContainer.alpha; + startAlpha = target.pixiContainer.alphaFilterVal; } } @@ -24,7 +24,7 @@ export function generateUniversalSoftInAnimationObj(targetKey: string, duration: function setEndState() { if (target?.pixiContainer) { // 终态是完全不透明,这保持不变 - target.pixiContainer.alpha = 1; + target.pixiContainer.alphaFilterVal = 1; } } @@ -49,7 +49,7 @@ export function generateUniversalSoftInAnimationObj(targetKey: string, duration: // 公式:最终值 = 初始值 + (目标值 - 初始值) * 进度 // 在这里,目标值是 1,所以公式为: // alpha = startAlpha + (1 - startAlpha) * easedProgress - if (sprite) sprite.alpha = startAlpha + (1 - startAlpha) * easedProgress; + if (sprite) sprite.alphaFilterVal = startAlpha + (1 - startAlpha) * easedProgress; } } diff --git a/packages/webgal/src/Core/controller/stage/pixi/animations/universalSoftOff.ts b/packages/webgal/src/Core/controller/stage/pixi/animations/universalSoftOff.ts index 3f5477457..96b1c75fc 100644 --- a/packages/webgal/src/Core/controller/stage/pixi/animations/universalSoftOff.ts +++ b/packages/webgal/src/Core/controller/stage/pixi/animations/universalSoftOff.ts @@ -14,7 +14,7 @@ export function generateUniversalSoftOffAnimationObj(targetKey: string, duration elapsedTime = 0; // 重置计时器 if (target?.pixiContainer) { // 修正:不再强制设为1,而是记录当前的透明度 - startAlpha = target.pixiContainer.alpha; + startAlpha = target.pixiContainer.alphaFilterVal; } } @@ -24,7 +24,7 @@ export function generateUniversalSoftOffAnimationObj(targetKey: string, duration function setEndState() { if (target?.pixiContainer) { // 终态是完全透明,这保持不变 - target.pixiContainer.alpha = 0; + target.pixiContainer.alphaFilterVal = 0; } } @@ -50,7 +50,7 @@ export function generateUniversalSoftOffAnimationObj(targetKey: string, duration // 在这里,目标值是 0,所以公式简化为: // alpha = startAlpha + (0 - startAlpha) * easedProgress // alpha = startAlpha * (1 - easedProgress) - if (targetContainer) targetContainer.alpha = startAlpha * (1 - easedProgress); + if (targetContainer) targetContainer.alphaFilterVal = startAlpha * (1 - easedProgress); } }