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

1.  新增getLvColor工具函数，根据等级返回对应颜色
2.  为英雄信息面板和卡牌添加等级文本颜色设置
3.  重构卡池等级节点命名和显示逻辑，修复prefab布局
4.  新增英雄自身等级显示组件到卡牌预制件

assets/resources/gui/element/card.prefab

@@ -68,19 +68,22 @@
       },
       {
         "__id__": 529
+      },
+      {
+        "__id__": 557
       }
     ],
     "_active": true,
     "_components": [
       {
-        "__id__": 557
+        "__id__": 563
       },
       {
-        "__id__": 559
+        "__id__": 565
       }
     ],
     "_prefab": {
-      "__id__": 561
+      "__id__": 567
     },
     "_lpos": {
       "__type__": "cc.Vec3",
@@ -12587,6 +12590,165 @@
     "targetOverrides": null,
     "nestedPrefabInstanceRoots": null
   },
+  {
+    "__type__": "cc.Node",
+    "_name": "lvl",
+    "_objFlags": 0,
+    "__editorExtras__": {},
+    "_parent": {
+      "__id__": 1
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 558
+      },
+      {
+        "__id__": 560
+      }
+    ],
+    "_prefab": {
+      "__id__": 562
+    },
+    "_lpos": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": -43.506,
+      "z": 0
+    },
+    "_lrot": {
+      "__type__": "cc.Quat",
+      "x": 0,
+      "y": 0,
+      "z": 0,
+      "w": 1
+    },
+    "_lscale": {
+      "__type__": "cc.Vec3",
+      "x": 1,
+      "y": 1,
+      "z": 1
+    },
+    "_mobility": 0,
+    "_layer": 1073741824,
+    "_euler": {
+      "__type__": "cc.Vec3",
+      "x": 0,
+      "y": 0,
+      "z": 0
+    },
+    "_id": ""
+  },
+  {
+    "__type__": "cc.UITransform",
+    "_name": "",
+    "_objFlags": 0,
+    "__editorExtras__": {},
+    "node": {
+      "__id__": 557
+    },
+    "_enabled": true,
+    "__prefab": {
+      "__id__": 559
+    },
+    "_contentSize": {
+      "__type__": "cc.Size",
+      "width": 42.53515625,
+      "height": 54.4
+    },
+    "_anchorPoint": {
+      "__type__": "cc.Vec2",
+      "x": 0.5,
+      "y": 0.5
+    },
+    "_id": ""
+  },
+  {
+    "__type__": "cc.CompPrefabInfo",
+    "fileId": "4dqU3tFDtGbatoXWgLFpJA"
+  },
+  {
+    "__type__": "cc.Label",
+    "_name": "",
+    "_objFlags": 0,
+    "__editorExtras__": {},
+    "node": {
+      "__id__": 557
+    },
+    "_enabled": true,
+    "__prefab": {
+      "__id__": 561
+    },
+    "_customMaterial": null,
+    "_srcBlendFactor": 2,
+    "_dstBlendFactor": 4,
+    "_color": {
+      "__type__": "cc.Color",
+      "r": 255,
+      "g": 255,
+      "b": 255,
+      "a": 255
+    },
+    "_string": "Lv.1",
+    "_horizontalAlign": 1,
+    "_verticalAlign": 1,
+    "_actualFontSize": 20,
+    "_fontSize": 20,
+    "_fontFamily": "Arial",
+    "_lineHeight": 40,
+    "_overflow": 0,
+    "_enableWrapText": true,
+    "_font": null,
+    "_isSystemFontUsed": true,
+    "_spacingX": 0,
+    "_isItalic": false,
+    "_isBold": true,
+    "_isUnderline": false,
+    "_underlineHeight": 2,
+    "_cacheMode": 0,
+    "_enableOutline": true,
+    "_outlineColor": {
+      "__type__": "cc.Color",
+      "r": 0,
+      "g": 0,
+      "b": 0,
+      "a": 255
+    },
+    "_outlineWidth": 2,
+    "_enableShadow": false,
+    "_shadowColor": {
+      "__type__": "cc.Color",
+      "r": 0,
+      "g": 0,
+      "b": 0,
+      "a": 255
+    },
+    "_shadowOffset": {
+      "__type__": "cc.Vec2",
+      "x": 2,
+      "y": 2
+    },
+    "_shadowBlur": 2,
+    "_id": ""
+  },
+  {
+    "__type__": "cc.CompPrefabInfo",
+    "fileId": "eccX4h4XFHYICC7LZQu1sK"
+  },
+  {
+    "__type__": "cc.PrefabInfo",
+    "root": {
+      "__id__": 1
+    },
+    "asset": {
+      "__id__": 0
+    },
+    "fileId": "b3jvDRk1NNjL5FE2pyUByW",
+    "instance": null,
+    "targetOverrides": null,
+    "nestedPrefabInstanceRoots": null
+  },
   {
     "__type__": "cc.UITransform",
     "_name": "",
@@ -12597,7 +12759,7 @@
     },
     "_enabled": true,
     "__prefab": {
-      "__id__": 558
+      "__id__": 564
     },
     "_contentSize": {
       "__type__": "cc.Size",
@@ -12625,7 +12787,7 @@
     },
     "_enabled": true,
     "__prefab": {
-      "__id__": 560
+      "__id__": 566
     },
     "Lock": null,
     "unLock": null,
@@ -12653,9 +12815,12 @@
     "HF_node": {
       "__id__": 290
     },
-    "lv_node": {
+    "pool_lv_node": {
       "__id__": 491
     },
+    "lvl_node": {
+      "__id__": 560
+    },
     "ap_node": {
       "__id__": 529
     },

assets/resources/gui/element/pool_lv.prefab

@@ -90,7 +90,7 @@
       "__id__": 1
     },
     "_children": [],
-    "_active": true,
+    "_active": false,
     "_components": [
       {
         "__id__": 3
@@ -230,7 +230,7 @@
         "__id__": 9
       }
     ],
-    "_active": false,
+    "_active": true,
     "_components": [
       {
         "__id__": 15
@@ -461,7 +461,7 @@
         "__id__": 25
       }
     ],
-    "_active": false,
+    "_active": true,
     "_components": [
       {
         "__id__": 31
@@ -472,8 +472,8 @@
     },
     "_lpos": {
       "__type__": "cc.Vec3",
-      "x": 0,
+      "x": 12.84,
-      "y": 9.508,
+      "y": 4.69,
       "z": 0
     },
     "_lrot": {
@@ -831,7 +831,7 @@
         "__id__": 47
       }
     ],
-    "_active": false,
+    "_active": true,
     "_components": [
       {
         "__id__": 53
@@ -842,8 +842,8 @@
     },
     "_lpos": {
       "__type__": "cc.Vec3",
-      "x": 0,
+      "x": 13.803,
-      "y": 9.508,
+      "y": 4.931,
       "z": 0
     },
     "_lrot": {
@@ -1340,7 +1340,7 @@
         "__id__": 75
       }
     ],
-    "_active": false,
+    "_active": true,
     "_components": [
       {
         "__id__": 81
@@ -1351,8 +1351,8 @@
     },
     "_lpos": {
       "__type__": "cc.Vec3",
-      "x": 0,
+      "x": 14.526,
-      "y": 9.508,
+      "y": 5.654,
       "z": 0
     },
     "_lrot": {
@@ -1988,7 +1988,7 @@
         "__id__": 109
       }
     ],
-    "_active": false,
+    "_active": true,
     "_components": [
       {
         "__id__": 115
@@ -1999,8 +1999,8 @@
     },
     "_lpos": {
       "__type__": "cc.Vec3",
-      "x": 0,
+      "x": 15.249,
-      "y": 9.508,
+      "y": 6.376,
       "z": 0
     },
     "_lrot": {
@@ -2775,7 +2775,7 @@
         "__id__": 149
       }
     ],
-    "_active": false,
+    "_active": true,
     "_components": [
       {
         "__id__": 155
@@ -2786,8 +2786,8 @@
     },
     "_lpos": {
       "__type__": "cc.Vec3",
-      "x": 0,
+      "x": 14.285,
-      "y": 9.508,
+      "y": 5.654,
       "z": 0
     },
     "_lrot": {

assets/script/game/common/config/GameSet.ts

@@ -1,3 +1,5 @@
+import { Color } from "cc";
+
 /** 碰撞分组 */
 export enum BoxSet {
      //物理碰撞tag
@@ -121,3 +123,14 @@ export class NumberFormatter {
         }
     }
 }
+
+export function getLvColor(lv: number): Color {
+    switch (lv) {
+        case 2: return new Color("#2ECC71");
+        case 3: return new Color("#3498DB");
+        case 4: return new Color("#9B59B6");
+        case 5: return new Color("#F1C40F");
+        case 6: return new Color("#E74C3C");
+        default: return Color.WHITE;
+    }
+}

assets/script/game/map/CardComp.ts

@@ -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) {
+        if (this.pool_lv_node) {
-            this.lv_node.children.forEach(child => {
+            this.pool_lv_node.children.forEach(child => {
-                if (child.name === "light") {
+                // if (child.name === "light") {
-                    child.active = false;
+                //     child.active = false;
-                } else if (child.name === "bg") {
+                // } else if (child.name === "bg") {
-                    child.active = true;
+                //     child.active = true;
-                } else {
+                // } else {
                     child.active = (child.name === cardLvStr);
-                }
+                // }
             });
         }
 
@@ -743,11 +748,11 @@ export class CardComp extends CCComp {
             });
         }
         
-        if (this.lv_node) {
+        if (this.pool_lv_node) {
-            const widget = this.lv_node.getComponent(Widget);
+            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 heroLv = Math.max(1,  hero?.lv);
-            const suffix = heroLv >= 2 ? "★".repeat(heroLv - 1) : "";
+            this.setLabel(this.name_node, `${hero?.name || ""}`);
-            this.setLabel(this.name_node, `${suffix}${hero?.name || ""}${suffix}`);
+            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) {
+        if (this.pool_lv_node) {
-            const widget = this.lv_node.getComponent(Widget);
+            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) {
+        // if (this.pool_lv_node) {
-        //     this.lv_node.children.forEach(child => child.active = false);
+        //     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));

assets/script/game/map/HInfoComp.ts

@@ -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 => {
+            this.pool_lvnode.children.forEach(child => {
-                if (child.name === "light") {
+                // if (child.name === "light") {
-                    child.active = false;
+                //     child.active = false;
-                } else if (child.name === "bg") {
+                // } else if (child.name === "bg") {
-                    child.active = true;
+                //     child.active = true;
-                } else {
+                // } else {
                     child.active = (child.name === poolLvStr);
-                }
+                // }
             });
         }