/**
*
初始化shader材质
*/
private async initShaderMaterials(): Promise {
if (!this.icon) {
console.warn(“
DragonScale: icon组件不存在,无法初始化shader”);
return;
}
// 保存原始材质
this.originalMaterial = this.icon.customMaterial;
// 加载闪白材质
try {
// 加载材质资源
const materialPath = "white";
const material = await bundleMgr.loadAssetAsync(Constants.BUNDLE_NAME.Material, materialPath, Material);
if (material) {
this.whiteMaterial = material;
} else {
console.warn("⚠️ 闪白材质加载失败");
}
} catch (error) {
console.error("❌ 加载闪白材质出错:", error);
}
}
// 播放受击动画
playHitAnimation() {
if (this.isPlayingHitAnimation || !this.icon) return;
this.isPlayingHitAnimation = true;
// 🎨 使用shader实现闪白效果
this.playWhiteShaderAnimation();
}
/**
* 🎨 使用shader播放闪白动画
*/
private playWhiteShaderAnimation(): void {
if (!this.whiteMaterial || !this.icon) {
// 如果shader不可用,回退到颜色动画
this.playColorHitAnimation();
return;
}
// 保存原始材质
const originalMaterial = this.icon.customMaterial;
// 应用闪白材质
this.icon.customMaterial = this.whiteMaterial;
this.isUsingWhiteShader = true;
// 🎨 创建平滑的闪白过渡动画
this.playSmoothWhiteTransition(originalMaterial);
}
/**
* 🎨 播放平滑的闪白过渡动画
*/
private playSmoothWhiteTransition(originalMaterial: Material): void {
// 动画参数
const fadeInDuration = 0.08; // 淡入时间
const holdDuration = 0.04; // 保持时间
const fadeOutDuration = 0.08; // 淡出时间
const maxIntensity = 1; // 最大闪白强度
const maxScale = 1.2; // 最大放大倍数
// 保存原始缩放
const originalScale = this.node.scale.clone();
// 创建动画目标对象
const animationTarget = {
intensity: 0.0,
scale: 1.0
};
// 第一阶段:从透明到半白(淡入)+ 放大
tween(animationTarget)
.to(fadeInDuration, {
intensity: maxIntensity,
scale: maxScale
}, {
onUpdate: () => {
// 更新shader参数
if (this.whiteMaterial && this.icon) {
this.whiteMaterial.setProperty('whiteIntensity', animationTarget.intensity);
}
// 更新缩放
if (this.node && this.node.isValid) {
this.node.scale = new Vec3(
originalScale.x * animationTarget.scale,
originalScale.y * animationTarget.scale,
originalScale.z
);
}
}
})
// 第二阶段:保持半白状态 + 保持放大
.delay(holdDuration)
// 第三阶段:从半白到透明(淡出)+ 缩小
.to(fadeOutDuration, {
intensity: 0.0,
scale: 1.0
}, {
onUpdate: () => {
// 更新shader参数
if (this.whiteMaterial && this.icon) {
this.whiteMaterial.setProperty('whiteIntensity', animationTarget.intensity);
}
// 更新缩放
if (this.node && this.node.isValid) {
this.node.scale = new Vec3(
originalScale.x * animationTarget.scale,
originalScale.y * animationTarget.scale,
originalScale.z
);
}
}
})
.call(() => {
// 动画完成,恢复原始材质和缩放
if (this.icon && this.icon.isValid) {
this.icon.customMaterial = originalMaterial;
}
if (this.node && this.node.isValid) {
this.node.scale = originalScale;
}
this.isUsingWhiteShader = false;
this.isPlayingHitAnimation = false;
})
.start();
}
3.8.7的7月31日社区版shader有bug,代码里面已经加载好闪白的shader,然后在敌人受击的时候暂停可以看到shader已经加载了,但是页面上看不到闪白的效果,同样的代码和shader在3.8.6里面是没问题


