feat(hero list): add hero upgrade animation effect

新增英雄升级成功时的播放动画特效,包括:
1. 新增动画节点绑定属性与初始化隐藏逻辑
2. 添加升级动画播放与播放完成自动隐藏的方法
3. 新增升级动画资源文件与配置元数据
This commit is contained in:
panFD
2026-08-24 22:25:42 +08:00
parent 62b6f83fbe
commit 61e33ff754
4 changed files with 1557 additions and 1216 deletions

View File

@@ -87,6 +87,10 @@ export class HerosListComp extends CCComp {
@property(Node)
chip_node = null!
/** 升级特效动画节点(内含升级效果 Animation,点击升级时从头播放) */
@property(Node)
upgrade_anim_node = null!
// ======================== 运行时状态 ========================
huuid: number = 0
@@ -97,6 +101,8 @@ export class HerosListComp extends CCComp {
start() {
this.bindUpgradeBtn()
this.initCardList()
// 升级特效动画初始隐藏,点击升级时才显示播放
if (this.upgrade_anim_node) this.upgrade_anim_node.active = false
if (HeroList.length > 0) {
this.onCardSelect(HeroList[0])
}
@@ -171,6 +177,7 @@ export class HerosListComp extends CCComp {
const success = smc.upgradeHero(uuid)
if (success) {
mLogger.log(this.debugMode, "HerosListComp", `英雄 ${uuid} 升级成功`)
this.playUpgradeAnim()
this.updateHeroDetail(uuid)
} else {
const growth = smc.getHeroGrowth(uuid)
@@ -204,6 +211,44 @@ export class HerosListComp extends CCComp {
.start()
}
/**
* 播放升级特效动画
* 每次升级成功均从头播放;动画未播完时再次升级,立即重新开始
*/
private playUpgradeAnim() {
if (!this.upgrade_anim_node) {
mLogger.log(this.debugMode, "HerosListComp", "playUpgradeAnim: upgrade_anim_node 未绑定")
return
}
const anim = this.upgrade_anim_node.getComponent(Animation)
const clip = anim?.clips?.[0]
if (!anim || !clip) {
mLogger.log(this.debugMode, "HerosListComp", "playUpgradeAnim: 缺少 Animation 组件或动画剪辑")
return
}
this.upgrade_anim_node.active = true
// 停止当前播放(如有),保证从头开始
anim.stop()
const animState = anim.getState(clip.name)
if (animState) {
// 防止重复注册,播放结束后自动隐藏特效节点
animState.off('finished', this.onUpgradeAnimFinished, this)
animState.once('finished', this.onUpgradeAnimFinished, this)
}
anim.play(clip.name)
}
/**
* 升级特效动画播放结束回调:隐藏特效节点
*/
private onUpgradeAnimFinished() {
if (this.upgrade_anim_node && this.upgrade_anim_node.isValid) {
this.upgrade_anim_node.active = false
}
}
/**
* 在升级按钮附近弹出 smalltip 气泡提示
* @param text 提示文案