pan/pixelheros
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(talents): 重构驻场技能页面为天赋图鉴页面

Browse Source 
- 调整天赋预制体布局参数，包含容器宽度、边距和间距
- 移除旧的驻场技能相关UI节点引用
- 替换数据来源为卡牌池技能卡，重构列表渲染与排序逻辑
- 更新UI展示逻辑，显示天赋名称、描述、图标和对应品质背景
- 优化组件注释与属性描述，统一代码风格
This commit is contained in:
pan
2026-06-09 10:01:44 +08:00
parent dfbac61ed9
commit 12449c8d1d
4 changed files with 496 additions and 2427 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2742
assets/resources/gui/element/prefab_talent_item.prefab
View File

File diff suppressed because it is too large Load Diff

35
assets/resources/gui/element/talents.prefab
View File

@@ -1110,7 +1110,7 @@
},
"_contentSize": {
"__type__": "cc.Size",
"width": 660,
"width": 720,
"height": 1000
},
"_anchorPoint": {
@@ -1138,8 +1138,8 @@
},
"_alignFlags": 41,
"_target": null,
"_left": 30,
"_right": 30,
"_left": 0,
"_right": 0,
"_top": 0,
"_bottom": 615,
"_horizontalCenter": 0,
@@ -1180,12 +1180,12 @@
"height": 40
},
"_startAxis": 0,
"_paddingLeft": 10,
"_paddingRight": 10,
"_paddingLeft": 15,
"_paddingRight": 15,
"_paddingTop": 0,
"_paddingBottom": 0,
"_spacingX": 20,
"_spacingY": 20,
"_spacingX": 15,
"_spacingY": 15,
"_verticalDirection": 1,
"_horizontalDirection": 0,
"_constraint": 2,
@@ -3915,21 +3915,6 @@
"__prefab": {
"__id__": 170
},
"title_node": {
"__id__": 12
},
"lbl_level": {
"__id__": 78
},
"lbl_exp": {
"__id__": 93
},
"pb_exp": {
"__id__": 108
},
"lbl_points": {
"__id__": 120
},
"talents_content": {
"__id__": 36
},
@@ -3937,12 +3922,6 @@
"__uuid__": "a0cdb31c-0abb-4e12-9dfe-0bd9e8cd7272",
"__expectedType__": "cc.Prefab"
},
"btn_reset": {
"__id__": 134
},
"btn_close": {
"__id__": 159
},
"_id": ""
},
{

90
assets/script/game/map/TalentItemComp.ts
View File

@@ -1,61 +1,85 @@
/**
* @file TalentItemComp.ts
* @description 驻场技能项组件（UI 视图层）
* @description 天赋图鉴项组件（UI 视图层）
*
* 职责：
* 1. 接收 TalentsComp 下发的 FieldSkillConfig 与当前场上总加成值。
* 2. 渲染名称 / 基础值 / 当前值 / 描述四段信息。
* 3. 兼容旧的 `@ecs.register('TalentItem')` 资源引用。
* 1. 接收 TalentsComp 下发的天赋卡配置（技能卡）。
* 2. 渲染名称、描述、图标和背景。
* 3. 背景颜色根据 wave 映射为对应的 poolLv。
*
* 依赖：
* - SkillSet.FieldSkillConfig —— 单条驻场技能配置
* - CardSet.CardConfig —— 单条卡牌配置
* - SkillSet —— 获取技能图标
*/
import { _decorator, Label } from "cc";
import { _decorator, Label, 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 { FieldSkillConfig } from "../common/config/SkillSet";
import { CardConfig } from "../common/config/CardSet";
import { SkillSet } from "../common/config/SkillSet";
import { CardBgComp } from "./CardBgComp";
import { smc } from "../common/SingletonModuleComp";
import { oops } from "db://oops-framework/core/Oops";
const { ccclass, property } = _decorator;
/**
* 将驻场配置值统一格式化为可读字符串。
* 兼容"小数"（0.1 表示 10%）与"整数百分点"（10 表示 10%）两种口径。
*/
function formatBuffValue(value: number): string {
if (Math.abs(value) < 1) {
return `${(value * 100).toFixed(0)}%`;
}
return value.toString();
}
/** TalentItemComp —— 驻场技能项组件 */
/** TalentItemComp —— 天赋图鉴项组件 */
@ccclass('TalentItemComp')
@ecs.register('TalentItem', false)
export class TalentItemComp extends CCComp {
@property({ type: Label, tooltip: "驻场技能名称" })
@property({ type: Label, tooltip: "天赋名称" })
lbl_name: Label = null!;
@property({ type: Label, tooltip: "基础值（来自配置）" })
lbl_base: Label = null!;
@property({ type: Label, tooltip: "当前场上总加成（实时聚合）" })
lbl_current: Label = null!;
@property({ type: Label, tooltip: "驻场技能描述" })
@property({ type: Label, tooltip: "天赋说明" })
lbl_info: Label = null!;
@property({ type: Sprite, tooltip: "天赋图标" })
icon: Sprite = null!;
@property({ type: CardBgComp, tooltip: "卡牌背景组件" })
bg: CardBgComp = null!;
/**
* 刷新单条驻场技能展示
* @param config FieldSkillSet 中的单条配置
* @param currentTotal 当前场上同 type 累加值（实时聚合）
* 刷新单条天赋展示
* @param config CardPoolList 中的天赋卡（技能卡）配置
*/
public updateItem(config: FieldSkillConfig, currentTotal: number): void {
public updateItem(config: CardConfig): void {
if (!config) return;
if (this.lbl_name) this.lbl_name.string = config.name ?? "";
if (this.lbl_base) this.lbl_base.string = `基础 +${formatBuffValue(config.value)}`;
if (this.lbl_current) this.lbl_current.string = `当前 +${formatBuffValue(currentTotal)}`;
if (this.lbl_info) this.lbl_info.string = config.info ?? "";
// 根据 wave 映射背景颜色
// 1=绿色(poolLv=1) 5=蓝色(poolLv=2) 10=紫色(poolLv=3) 15=黄色(poolLv=4) 20=红色(poolLv=5)
if (this.bg) {
let poolLv = 1;
const wave = config.wave || 1;
if (wave >= 20) poolLv = 5;
else if (wave >= 15) poolLv = 4;
else if (wave >= 10) poolLv = 3;
else if (wave >= 5) poolLv = 2;
else poolLv = 1;
this.bg.apply(poolLv);
}
// 设置图标
if (this.icon && config.skill) {
const skillData = SkillSet[config.skill];
if (skillData && skillData.icon) {
if (smc.uiconsAtlas) {
const frame = smc.uiconsAtlas.getSpriteFrame(skillData.icon);
if (frame) {
this.icon.spriteFrame = frame;
}
} else {
const sf = oops.res.get("game/heros/cards/" + skillData.icon, SpriteFrame) as SpriteFrame;
if (sf) {
this.icon.spriteFrame = sf;
}
}
}
}
}
/** ECS 组件移除时销毁节点（CCComp 抽象方法实现） */

56
assets/script/game/map/TalentsComp.ts
View File

@@ -1,36 +1,34 @@
/**
* @file TalentsComp.ts
* @description 驻场技能信息展示页组件（UI 视图层）
* @description 天赋图鉴页组件（UI 视图层）
*
* 职责：
* 1. 展示当前所有 FieldSkillSet 配置项的名称、基础值、当前场上总加成。
* 2. 通过 FieldSkillHelper 实时聚合英雄驻场数据并下发给每个 TalentItemComp。
* 1. 展示当前所有天赋卡（技能卡）的图鉴。
* 2. 从 CardPoolList 获取所有的 type=Skill 卡牌。
* 3. 兼容旧的 `@ecs.register('Talents')` 资源引用。
*
* 依赖：
* - SkillSet（FieldSkillSet / FieldSkillConfig）—— 驻场技能配置
* - FieldSkillHelper —— 场上英雄驻场技能聚合
* - TalentItemComp —— 单条驻场技能项视图
* - CardPoolList（CardSet）—— 获取技能卡配置
* - TalentItemComp —— 单条天赋图鉴项视图
*/
import { _decorator, instantiate, Node, Prefab } 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 { mLogger } from "../common/Logger";
import { FieldSkillSet, FieldSkillConfig } from "../common/config/SkillSet";
import { FieldSkillHelper } from "../hero/FieldSkillHelper";
import { CardPoolList, CardType, CardConfig } from "../common/config/CardSet";
import { TalentItemComp } from "./TalentItemComp";
const { ccclass, property } = _decorator;
/** TalentsComp —— 驻场技能信息页组件 */
/** TalentsComp —— 天赋图鉴信息页组件 */
@ccclass('TalentsComp')
@ecs.register('Talents', false)
export class TalentsComp extends CCComp {
@property({ type: Node, tooltip: "驻场技能列表容器" })
@property({ type: Node, tooltip: "天赋技能列表容器" })
talents_content: Node = null!;
@property({ type: Prefab, tooltip: "单条驻场技能项预制" })
@property({ type: Prefab, tooltip: "单条天赋项预制" })
prefab_talent_item: Prefab = null!;
/** 调试日志开关 */
@@ -40,7 +38,7 @@ export class TalentsComp extends CCComp {
private rendered: boolean = false;
/** 缓存的稳定配置顺序，避免重复渲染时列表抖动 */
private cachedConfigs: FieldSkillConfig[] = [];
private cachedConfigs: CardConfig[] = [];
protected onEnable(): void {
this.refreshUI();
@@ -50,30 +48,36 @@ export class TalentsComp extends CCComp {
public refreshUI(): void {
if (!this.talents_content || !this.prefab_talent_item) return;
// 第一次：实例化所有子节点；之后只更新数据
// 第一次：实例化所有子节点
if (!this.rendered) {
this.cachedConfigs = Object.values(FieldSkillSet)
.sort((a, b) => a.uuid - b.uuid);
// 获取所有天赋（技能卡）并按 wave 和 uuid 排序
this.cachedConfigs = CardPoolList.filter(card => card.type === CardType.Skill)
.sort((a, b) => {
const waveA = a.wave || 1;
const waveB = b.wave || 1;
if (waveA !== waveB) return waveA - waveB;
return a.uuid - b.uuid;
});
this.cachedConfigs.forEach((cfg) => {
const itemNode = instantiate(this.prefab_talent_item);
this.talents_content.addChild(itemNode);
const comp = itemNode.getComponent(TalentItemComp);
if (comp) {
comp.updateItem(cfg, 0);
comp.updateItem(cfg);
}
});
this.rendered = true;
} else {
// 如果已渲染，则仅更新数据（图鉴一般不会变动，这里做个兜底更新）
this.cachedConfigs.forEach((cfg, index) => {
const child = this.talents_content.children[index];
if (!child) return;
const comp = child.getComponent(TalentItemComp);
if (!comp) return;
comp.updateItem(cfg);
});
}
// 按相同顺序回填最新场上聚合值
this.cachedConfigs.forEach((cfg, index) => {
const child = this.talents_content.children[index];
if (!child) return;
const comp = child.getComponent(TalentItemComp);
if (!comp) return;
const total = FieldSkillHelper.getFieldSkillTotalValue(cfg.type);
comp.updateItem(cfg, total);
});
}
/** ECS 组件移除时销毁节点 */