feat(gui): 在技能信息框中显示技能类型图标并调整布局
- 扩展 IBoxComp 以支持技能类型数据,为近战、远程、支援技能显示对应图标 - 重构 applyLineTexts 为 applyLineData,接收包含文本和类型的对象数组 - 调整 ibox.prefab 中节点位置、尺寸和间距,优化视觉布局 - 默认隐藏未使用的行节点以减少初始渲染开销
This commit is contained in:
@@ -2,7 +2,7 @@ import { _decorator, Label, Node, NodeEventType, UITransform } 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 { HeroInfo } from "../common/config/heroSet";
|
||||
import { SkillSet } from "../common/config/SkillSet";
|
||||
import { IType, SkillSet } from "../common/config/SkillSet";
|
||||
import { oops } from "db://oops-framework/core/Oops";
|
||||
const { ccclass, property } = _decorator;
|
||||
|
||||
@@ -52,37 +52,42 @@ export class IBoxComp extends CCComp {
|
||||
const hero = HeroInfo[heroUuid];
|
||||
if (!hero) {
|
||||
this.setHeroName("");
|
||||
this.applyLineTexts(["暂无技能信息"]);
|
||||
this.applyLineData([{ text: "暂无技能信息" }]);
|
||||
return;
|
||||
}
|
||||
this.setHeroName(hero.name);
|
||||
const runtimeSkills = args?.skills ? Object.values(args.skills) : [];
|
||||
const sourceSkills = runtimeSkills.length > 0 ? runtimeSkills : Object.values(hero.skills ?? {});
|
||||
const skillTexts = sourceSkills.map(skill => {
|
||||
const lineData = sourceSkills.map(skill => {
|
||||
const skillId = Math.floor(skill?.uuid ?? 0);
|
||||
if (!skillId) return "";
|
||||
if (!skillId) return null;
|
||||
const config = SkillSet[skillId];
|
||||
if (!config) return "";
|
||||
if (!config) return null;
|
||||
const runtimeLv = runtimeSkills.length > 0 ? Math.max(0, Math.floor(skill.lv ?? 0)) : Math.max(0, Math.floor((skill.lv ?? 1) + heroLv - 2));
|
||||
const cd = Number(skill?.cd ?? 0);
|
||||
return `${config.name} Lv.${runtimeLv} CD:${cd}s ${config.info}`;
|
||||
}).filter(Boolean);
|
||||
this.applyLineTexts(skillTexts.length > 0 ? skillTexts : ["暂无技能信息"]);
|
||||
return {
|
||||
text: `${config.name} Lv.${runtimeLv} CD:${cd}s ${config.info}`,
|
||||
iType: config.IType
|
||||
};
|
||||
}).filter(item => !!item) as Array<{ text: string; iType: IType }>;
|
||||
this.applyLineData(lineData.length > 0 ? lineData : [{ text: "暂无技能信息" }]);
|
||||
}
|
||||
|
||||
private applyLineTexts(skillTexts: string[]) {
|
||||
private applyLineData(skillLines: Array<{ text: string; iType?: IType }>) {
|
||||
const lines = [this.Line1, this.Line2, this.Line3, this.Line4, this.Line5];
|
||||
const showCount = Math.max(1, Math.min(lines.length, skillTexts.length));
|
||||
const showCount = Math.max(1, Math.min(lines.length, skillLines.length));
|
||||
for (let i = 0; i < lines.length; i++) {
|
||||
const line = lines[i];
|
||||
if (!line) continue;
|
||||
const active = i < showCount;
|
||||
line.active = active;
|
||||
if (!active) continue;
|
||||
const text = skillTexts[i] ?? "";
|
||||
const data = skillLines[i];
|
||||
const text = data?.text ?? "";
|
||||
const noteNode = line.getChildByName("note");
|
||||
const label = noteNode?.getComponent(Label) || noteNode?.getComponentInChildren(Label) || line.getComponentInChildren(Label);
|
||||
if (label) label.string = text;
|
||||
this.updateLineTypeIcon(line, data?.iType);
|
||||
}
|
||||
const targetHeight = this.baseHeight + Math.max(0, showCount - 1) * this.extraLineHeight;
|
||||
this.updateIBoxHeight(targetHeight);
|
||||
@@ -106,6 +111,15 @@ export class IBoxComp extends CCComp {
|
||||
}
|
||||
}
|
||||
|
||||
private updateLineTypeIcon(line: Node, iType?: IType) {
|
||||
const meleeNode = line.getChildByName("Melee");
|
||||
const remoteNode = line.getChildByName("remote");
|
||||
const supportNode = line.getChildByName("support");
|
||||
if (meleeNode) meleeNode.active = iType === IType.Melee;
|
||||
if (remoteNode) remoteNode.active = iType === IType.remote;
|
||||
if (supportNode) supportNode.active = iType === IType.support;
|
||||
}
|
||||
|
||||
private onTapClose() {
|
||||
oops.gui.removeByNode(this.node);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user