style(ui): 优化天赋道具项UI表现与逻辑

1. 移除未激活天赋的灰阶处理,仅保留锁遮罩
2. 重构applyTierBg方法,移除背景灰阶逻辑
3. 调整天赋预制体的尺寸、缩放、文本样式与图标资源
This commit is contained in:
panFD
2026-09-08 20:46:23 +08:00
parent 07f1646013
commit 57a50578fa
3 changed files with 1743 additions and 480 deletions

View File

@@ -6,7 +6,7 @@
* 1. 接收 TalentsComp 下发的天赋配置 + 当前等级 + 阶位解锁态,渲染迷你点选卡。
* 2. 卡面自包含:图标 / 名称 / 当前已生效数值(Lv0 显示每级数值引导)/ 右下「当前/满级」角标。
* 3. 阶位背景:普通背景节点下挂 blue / red / yellow 三个颜色子节点,按阶位激活其一(Ⅰ蓝 / Ⅱ红 / Ⅲ金)。
* 4. 状态机:满级(MAX 金角标)/ 未激活(左上锁角标 + 背景与图标灰阶 Grayscale)。
* 4. 状态机:满级(MAX 金角标)/ 未激活(左上锁角标,不再做灰阶处理)。
* 5. 点击回调上抛卡体点击,加点确认弹窗与升级校验统一由 TalentsComp 处理(单一决策点)。
*
* 依赖:
@@ -85,11 +85,11 @@ export class TalentItemComp extends CCComp {
if (this.lbl_info) this.lbl_info.string = getTalentDisplayText(cfg, lv);
if (this.lbl_lv) this.lbl_lv.string = `${lv}/${cfg.max_lv}`;
// 未激活(Lv0 或阶位未解锁):背景与图标灰阶
// 未激活(Lv0 或阶位未解锁):仅显示 node_lock 锁遮罩,不做灰阶处理
const inactive = lv <= 0 || !tierUnlocked;
// 阶位背景:激活对应颜色子节点(Ⅰ蓝 / Ⅱ红 / Ⅲ金)
if (this.bg) this.applyTierBg(cfg.tier, inactive);
if (this.bg) this.applyTierBg(cfg.tier);
// 图标:技能图标图集(gui/ui7)优先,资源目录回退(与 SCardComp 口径一致)
if (this.icon && cfg.icon) {
@@ -101,7 +101,6 @@ export class TalentItemComp extends CCComp {
frame = oops.res.get("game/heros/cards/" + cfg.icon, SpriteFrame) as SpriteFrame;
}
if (frame) this.icon.spriteFrame = frame;
this.icon.grayscale = inactive;
}
// 状态角标:满级 MAX / 未激活锁角标(未加点或阶位未解锁,置于左上角)
@@ -109,16 +108,13 @@ export class TalentItemComp extends CCComp {
if (this.node_lock) this.node_lock.active = inactive;
}
/** 按阶位激活 bg 下对应颜色子节点,其余隐藏;未激活时全部开启灰阶 */
private applyTierBg(tier: TalentTier, inactive: boolean): void {
/** 按阶位激活 bg 下对应颜色子节点,其余隐藏 */
private applyTierBg(tier: TalentTier): void {
const curName = TIER_BG_CHILD_NAMES[tier];
for (const [, name] of Object.entries(TIER_BG_CHILD_NAMES)) {
const child = this.bg.getChildByName(name);
if (!child) continue;
child.active = name === curName;
// Sprite 内置灰阶材质,未激活天赋的背景置灰
const render = child.getComponent(Sprite);
if (render) render.grayscale = inactive;
}
}