feat(talent-ui): 优化天赋界面展示逻辑与数据显示
1. 天赋总览页新增各层已投入点数展示
2. 天赋详情弹窗重构前置与层位校验UI:
- 拆分层位需求与软前置展示模块
- 优化进度显示逻辑,避免数值歧义
- 修正前置等级展示为当前/需求格式
3. 更新相关注释与文档说明
This commit is contained in:
@@ -4,10 +4,11 @@
|
||||
*
|
||||
* 职责:
|
||||
* 1. 展示天赋图标 / 名称 / 当前等级 / 条幅说明(getTalentDisplayText)。
|
||||
* 2. 展示软前置行:前置天赋名称、需求等级、前置已达成勾图标(达成亮 On,未达成亮 Off)。
|
||||
* 3. 加点按钮:仅在可加点(层位已解锁 + 前置满足 + 未满级 + 点数足够)时显示;
|
||||
* 2. 展示层位需求行:前置层位名称(如:1 级天赋)、投入进度(如:5/5)、解锁勾图标(解锁亮 On,未解锁亮 Off)。
|
||||
* 3. 展示软前置行:前置天赋名称、等级进度(当前/需求,如:0/5)、前置已达成勾图标(达成亮 On,未达成亮 Off)。
|
||||
* 4. 加点按钮:仅在可加点(层位已解锁 + 前置满足 + 未满级 + 点数足够)时显示;
|
||||
* 不满足条件或已满级时隐藏,弹窗仍可正常打开查看。
|
||||
* 4. 加点成功后通过 TALENT_UPDATE 事件驱动 TalentsComp 全量刷新,并同步刷新本弹窗。
|
||||
* 5. 加点成功后通过 TALENT_UPDATE 事件驱动 TalentsComp 全量刷新,并同步刷新本弹窗。
|
||||
*
|
||||
* 使用(oops.gui 模块):
|
||||
* oops.gui.open(UIID.TIBox, { uuid: 9001 });
|
||||
@@ -20,7 +21,7 @@
|
||||
import { _decorator, EventTouch, Label, Node, NodeEventType, RichText, Sprite, SpriteFrame } from "cc";
|
||||
import { ecs } from "../../../../extensions/oops-plugin-framework/assets/libs/ecs/ECS";
|
||||
import { CCComp } from "../../../../extensions/oops-plugin-framework/assets/module/common/CCComp";
|
||||
import { TalentSet, TalentConfig, getTalentUpgradeCost, isTalentPrereqMet, isTalentTierUnlocked } from "../common/config/TalentSet";
|
||||
import { TalentSet, TalentConfig, TalentTier, TALENT_TIER_UNLOCK_THRESHOLD, getTalentTierInvestedPoints, getTalentUpgradeCost, isTalentPrereqMet, isTalentTierUnlocked } from "../common/config/TalentSet";
|
||||
import { GameEvent } from "../common/config/GameEvent";
|
||||
import { HRoleName } from "../common/config/heroSet";
|
||||
import { outlineRich } from "../common/RichOutline";
|
||||
@@ -52,7 +53,7 @@ export class TIBoxComp extends CCComp {
|
||||
@property({ type: Label, tooltip: "前置天赋名称(无前置时隐藏前置行)" })
|
||||
lbl_prereq_name: Label = null!;
|
||||
|
||||
@property({ type: Label, tooltip: "前置天赋需求等级" })
|
||||
@property({ type: Label, tooltip: "前置天赋等级进度(当前/需求,如:0/5)" })
|
||||
lbl_prereq_lv: Label = null!;
|
||||
|
||||
@property({ type: Node, tooltip: "前置已达成勾图标(On)" })
|
||||
@@ -64,6 +65,21 @@ export class TIBoxComp extends CCComp {
|
||||
@property({ type: Node, tooltip: "前置行容器(无前置天赋时整体隐藏)" })
|
||||
node_prereq: Node = null!;
|
||||
|
||||
@property({ type: Node, tooltip: "层位需求行容器(第 1 层天赋无层位需求,整体隐藏)" })
|
||||
node_tier: Node = null!;
|
||||
|
||||
@property({ type: Label, tooltip: "前置层位名称(如:1 级天赋)" })
|
||||
lbl_tier_name: Label = null!;
|
||||
|
||||
@property({ type: Label, tooltip: "前一层投入进度(已投入/门槛,如:5/5)" })
|
||||
lbl_tier_progress: Label = null!;
|
||||
|
||||
@property({ type: Node, tooltip: "层位已解锁勾图标(On)" })
|
||||
node_tier_check_on: Node = null!;
|
||||
|
||||
@property({ type: Node, tooltip: "层位未解锁勾图标(Off)" })
|
||||
node_tier_check_off: Node = null!;
|
||||
|
||||
@property({ type: RichText, tooltip: "条幅说明(当前已生效数值 / 每级引导)" })
|
||||
richtext_info: RichText = null!;
|
||||
|
||||
@@ -122,6 +138,21 @@ export class TIBoxComp extends CCComp {
|
||||
// 条幅说明:已加点显示当前生效数值,未加点显示每级引导
|
||||
if (this.richtext_info) this.richtext_info.string = outlineRich(this.buildDetailText(cfg, lv));
|
||||
|
||||
// 层位需求行:第 1 层恒解锁无需求,整体隐藏;其余层展示前一层名称与投入进度(如:1 级天赋 5/5)
|
||||
const hasTierNeed = cfg.tier > TalentTier.L1;
|
||||
if (this.node_tier) this.node_tier.active = hasTierNeed;
|
||||
if (hasTierNeed) {
|
||||
const prevTier = (cfg.tier - 1) as TalentTier;
|
||||
const invested = getTalentTierInvestedPoints(levels, prevTier);
|
||||
const tierMet = isTalentTierUnlocked(levels, cfg.tier);
|
||||
if (this.lbl_tier_name) this.lbl_tier_name.string = `${prevTier} 级天赋`;
|
||||
// 进度超门槛时截断显示(如已投入 7 点仍显示 5/5,避免 7/5 的歧义观感)
|
||||
const shown = Math.min(invested, TALENT_TIER_UNLOCK_THRESHOLD);
|
||||
if (this.lbl_tier_progress) this.lbl_tier_progress.string = `${shown}/${TALENT_TIER_UNLOCK_THRESHOLD}`;
|
||||
if (this.node_tier_check_on) this.node_tier_check_on.active = tierMet;
|
||||
if (this.node_tier_check_off) this.node_tier_check_off.active = !tierMet;
|
||||
}
|
||||
|
||||
// 软前置行:无前置整体隐藏;有前置展示名称/需求等级/达成勾
|
||||
const hasPrereq = !!(cfg.prereq_uuid && cfg.prereq_lv);
|
||||
if (this.node_prereq) this.node_prereq.active = hasPrereq;
|
||||
@@ -129,7 +160,9 @@ export class TIBoxComp extends CCComp {
|
||||
const preCfg = TalentSet[cfg.prereq_uuid!];
|
||||
const preMet = isTalentPrereqMet(levels, cfg);
|
||||
if (this.lbl_prereq_name) this.lbl_prereq_name.string = preCfg ? preCfg.name : `天赋${cfg.prereq_uuid}`;
|
||||
if (this.lbl_prereq_lv) this.lbl_prereq_lv.string = `${cfg.prereq_lv}`;
|
||||
// 前置等级进度(当前/需求,如:0/5);超需求时截断显示,避免 7/5 的歧义观感
|
||||
const preLv = Math.min(levels?.[cfg.prereq_uuid!] ?? 0, cfg.prereq_lv!);
|
||||
if (this.lbl_prereq_lv) this.lbl_prereq_lv.string = `${preLv}/${cfg.prereq_lv}`;
|
||||
if (this.node_prereq_check_on) this.node_prereq_check_on.active = preMet;
|
||||
if (this.node_prereq_check_off) this.node_prereq_check_off.active = !preMet;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user