feat: 添加等级颜色显示,优化卡池和英雄等级UI

1.  新增getLvColor工具函数,根据等级返回对应颜色
2.  为英雄信息面板和卡牌添加等级文本颜色设置
3.  重构卡池等级节点命名和显示逻辑,修复prefab布局
4.  新增英雄自身等级显示组件到卡牌预制件
This commit is contained in:
panw
2026-05-25 09:49:34 +08:00
parent 8d27a4bef3
commit 8026c2368e
5 changed files with 245 additions and 54 deletions

View File

@@ -33,6 +33,7 @@ import { smc } from "../common/SingletonModuleComp";
import { UIID } from "../common/config/GameUIConfig";
import { HeroAttrsComp } from "../hero/HeroAttrsComp";
import { TalentType } from "../common/config/TalentSet";
import { getLvColor } from "../common/config/GameSet";
import { MissionEconomy } from "./MissionEconomy";
@@ -88,7 +89,11 @@ export class CardComp extends CCComp {
HF_node=null!
@property(Node)
lv_node=null!
pool_lv_node=null! //英雄对应的卡池等级
@property(Label)
lvl_node: Label = null! //英雄本身的等级
@property(Node)
ap_node=null!
@property(Node)
@@ -705,15 +710,15 @@ export class CardComp extends CCComp {
// ---- 卡牌等级标识 ----
const cardLvStr = `lv${this.cardData.pool_lv}`;
if (this.lv_node) {
this.lv_node.children.forEach(child => {
if (child.name === "light") {
child.active = false;
} else if (child.name === "bg") {
child.active = true;
} else {
if (this.pool_lv_node) {
this.pool_lv_node.children.forEach(child => {
// if (child.name === "light") {
// child.active = false;
// } else if (child.name === "bg") {
// child.active = true;
// } else {
child.active = (child.name === cardLvStr);
}
// }
});
}
@@ -743,11 +748,11 @@ export class CardComp extends CCComp {
});
}
if (this.lv_node) {
const widget = this.lv_node.getComponent(Widget);
if (this.pool_lv_node) {
const widget = this.pool_lv_node.getComponent(Widget);
if (widget) widget.updateAlignment();
this.lv_node.children.forEach(child => {
this.pool_lv_node.children.forEach(child => {
const childWidget = child.getComponent(Widget);
if (childWidget) childWidget.updateAlignment();
});
@@ -817,11 +822,15 @@ export class CardComp extends CCComp {
}
if(this.card_type===CardType.Hero){
// 英雄卡:显示英雄名 + 星级 + AP/HP
// 英雄卡:显示英雄名 + AP/HP
const hero = HeroInfo[this.card_uuid];
const heroLv = Math.max(1, Math.floor(this.cardData.hero_lv ?? hero?.lv ?? 1));
const suffix = heroLv >= 2 ? "★".repeat(heroLv - 1) : "";
this.setLabel(this.name_node, `${suffix}${hero?.name || ""}${suffix}`);
const heroLv = Math.max(1, hero?.lv);
this.setLabel(this.name_node, `${hero?.name || ""}`);
if (this.lvl_node) {
this.lvl_node.string = `Lv.${heroLv}`;
this.lvl_node.color = getLvColor(heroLv);
this.lvl_node.node.active = true;
}
this.ap_node.getChildByName("val").getComponent(Label).string = `${(hero?.ap ?? 0) * heroLv}`;
this.hp_node.getChildByName("val").getComponent(Label).string = `${(hero?.hp ?? 0) * heroLv}`;
if (this.oinfo_node) {
@@ -838,6 +847,7 @@ export class CardComp extends CCComp {
this.oinfo_node.active = false;
}
}else if(this.card_type===CardType.Skill){
if (this.lvl_node) this.lvl_node.node.active = false;
// 技能卡:显示技能名 + 品质后缀 + 描述
const skill = SkillSet[this.card_uuid];
const skillCard = CardPoolList.find(c => c.uuid === this.card_uuid);
@@ -855,6 +865,7 @@ export class CardComp extends CCComp {
this.oinfo_node.active = false;
}
}else{
if (this.lvl_node) this.lvl_node.node.active = false;
// 特殊卡(升级 / 刷新):显示卡名 + 品质后缀 + 描述
const specialCard = this.card_type === CardType.SpecialUpgrade
? SpecialUpgradeCardList[this.card_uuid]
@@ -998,11 +1009,11 @@ export class CardComp extends CCComp {
}
});
}
if (this.lv_node) {
const widget = this.lv_node.getComponent(Widget);
if (this.pool_lv_node) {
const widget = this.pool_lv_node.getComponent(Widget);
if (widget) widget.updateAlignment();
this.lv_node.children.forEach(child => {
this.pool_lv_node.children.forEach(child => {
const childWidget = child.getComponent(Widget);
if (childWidget) childWidget.updateAlignment();
});
@@ -1073,6 +1084,7 @@ export class CardComp extends CCComp {
if (this.ap_node) this.ap_node.active = false;
if (this.hp_node) this.hp_node.active = false;
if (this.oinfo_node) this.oinfo_node.active = false;
if (this.lvl_node) this.lvl_node.node.active = false;
// if (this.Ckind_node) {
// this.Ckind_node.children.forEach(child => {
// child.active = false;
@@ -1086,8 +1098,8 @@ export class CardComp extends CCComp {
// this.HF_node.children.forEach(child => child.active = false);
// }
// if (this.NF_node) this.NF_node.active = false;
// if (this.lv_node) {
// this.lv_node.children.forEach(child => child.active = false);
// if (this.pool_lv_node) {
// this.pool_lv_node.children.forEach(child => child.active = false);
// }
if (this.cost_node) this.cost_node.active = false;
if (this.icon_node) (this.icon_node as Node).setScale(new Vec3(1, 1, 1));

View File

@@ -34,7 +34,7 @@ import { UIID } from "../common/config/GameUIConfig";
import { mLogger } from "../common/Logger";
import { MissionHeroComp } from "./MissionHeroComp";
import { MoveComp } from "../hero/MoveComp";
import { FacSet } from "../common/config/GameSet";
import { FacSet, getLvColor } from "../common/config/GameSet";
import { MissionEconomy } from "./MissionEconomy";
const {property, ccclass } = _decorator;
@@ -70,7 +70,7 @@ export class HInfoComp extends CCComp {
lv_node: Label = null!
@property(Node)
pool_lv_node: Node = null!
pool_lvnode: Node = null!
@property(Node)
ap_node=null!
@@ -165,19 +165,20 @@ export class HInfoComp extends CCComp {
if (this.lv_node) {
const currentLv = this.model.lv ?? 1;
this.lv_node.string = `Lv.${currentLv}`;
this.lv_node.color = getLvColor(currentLv);
}
// ---- 卡池等级标识 ----
if (this.pool_lv_node) {
if (this.pool_lvnode) {
const poolLvStr = `lv${this.model.pool_lv ?? 1}`;
this.pool_lv_node.children.forEach(child => {
if (child.name === "light") {
child.active = false;
} else if (child.name === "bg") {
child.active = true;
} else {
this.pool_lvnode.children.forEach(child => {
// if (child.name === "light") {
// child.active = false;
// } else if (child.name === "bg") {
// child.active = true;
// } else {
child.active = (child.name === poolLvStr);
}
// }
});
}