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

refactor(heroList): 替换卡牌选中高亮方式为显隐标记

Browse Source 
1.  重构英雄列表卡牌选中逻辑，移除缩放高亮，改用active子节点显隐标记选中状态
2.  重构CardLiteComp，新增setSelected方法统一处理选中态
3.  调整卡牌预制体尺寸与布局，新增选中标记节点
4.  优化英雄图标加载逻辑，改为静态首帧展示而非播放动画
5.  调整图集边框配置与精灵帧引用
This commit is contained in:
panFD
2026-08-23 23:40:54 +08:00
parent b3781f550d
commit bef521683c
9 changed files with 3414 additions and 4487 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3602
assets/resources/game/skill/buff/tooltip.prefab
View File

File diff suppressed because it is too large Load Diff

351
assets/resources/gui/element/cardlite.prefab
View File

@@ -29,19 +29,22 @@
}, },
{ {
"__id__": 223 "__id__": 223
},
{
"__id__": 229
} }
], ],
"_active": true, "_active": true,
"_components": [ "_components": [
{ {
"__id__": 229 "__id__": 237
}, },
{ {
"__id__": 231 "__id__": 239
} }
], ],
"_prefab": { "_prefab": {
"__id__": 233 "__id__": 241
}, },
"_lpos": { "_lpos": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
@@ -294,8 +297,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 150, "width": 120,
"height": 189.4 "height": 150
} }
}, },
{ {
@@ -314,8 +317,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 284, "width": 224,
"height": 362.8 "height": 284
} }
}, },
{ {
@@ -334,8 +337,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 370.8 "height": 292
} }
}, },
{ {
@@ -354,8 +357,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 300, "width": 240,
"height": 378.8 "height": 300
} }
}, },
{ {
@@ -374,8 +377,8 @@
], ],
"value": { "value": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": -66.75, "x": -51.75,
"y": 88.45, "y": 68.75,
"z": 0 "z": 0
} }
}, },
@@ -395,7 +398,7 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 44 "height": 44
} }
}, },
@@ -709,8 +712,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 150, "width": 120,
"height": 189.4 "height": 150
} }
}, },
{ {
@@ -729,8 +732,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 284, "width": 224,
"height": 362.8 "height": 284
} }
}, },
{ {
@@ -749,8 +752,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 370.8 "height": 292
} }
}, },
{ {
@@ -769,8 +772,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 300, "width": 240,
"height": 378.8 "height": 300
} }
}, },
{ {
@@ -789,8 +792,8 @@
], ],
"value": { "value": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": -66.75, "x": -51.75,
"y": 88.45, "y": 68.75,
"z": 0 "z": 0
} }
}, },
@@ -804,7 +807,7 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 44 "height": 44
} }
}, },
@@ -1118,8 +1121,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 150, "width": 120,
"height": 189.4 "height": 150
} }
}, },
{ {
@@ -1138,8 +1141,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 284, "width": 224,
"height": 362.8 "height": 284
} }
}, },
{ {
@@ -1158,8 +1161,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 370.8 "height": 292
} }
}, },
{ {
@@ -1178,8 +1181,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 300, "width": 240,
"height": 378.8 "height": 300
} }
}, },
{ {
@@ -1198,8 +1201,8 @@
], ],
"value": { "value": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": -66.75, "x": -51.75,
"y": 88.45, "y": 68.75,
"z": 0 "z": 0
} }
}, },
@@ -1213,7 +1216,7 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 44 "height": 44
} }
}, },
@@ -1527,8 +1530,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 150, "width": 120,
"height": 189.4 "height": 150
} }
}, },
{ {
@@ -1547,8 +1550,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 284, "width": 224,
"height": 362.8 "height": 284
} }
}, },
{ {
@@ -1567,8 +1570,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 370.8 "height": 292
} }
}, },
{ {
@@ -1587,8 +1590,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 300, "width": 240,
"height": 378.8 "height": 300
} }
}, },
{ {
@@ -1607,8 +1610,8 @@
], ],
"value": { "value": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": -66.75, "x": -51.75,
"y": 88.45, "y": 68.75,
"z": 0 "z": 0
} }
}, },
@@ -1622,7 +1625,7 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 44 "height": 44
} }
}, },
@@ -1936,8 +1939,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 150, "width": 120,
"height": 189.4 "height": 150
} }
}, },
{ {
@@ -1956,8 +1959,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 284, "width": 224,
"height": 362.8 "height": 284
} }
}, },
{ {
@@ -1976,8 +1979,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 370.8 "height": 292
} }
}, },
{ {
@@ -1996,8 +1999,8 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 300, "width": 240,
"height": 378.8 "height": 300
} }
}, },
{ {
@@ -2016,8 +2019,8 @@
], ],
"value": { "value": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": -66.75, "x": -51.75,
"y": 88.45, "y": 68.75,
"z": 0 "z": 0
} }
}, },
@@ -2031,7 +2034,7 @@
], ],
"value": { "value": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 292, "width": 232,
"height": 44 "height": 44
} }
}, },
@@ -2464,8 +2467,8 @@
}, },
"_contentSize": { "_contentSize": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 150, "width": 120,
"height": 189.4 "height": 150
}, },
"_anchorPoint": { "_anchorPoint": {
"__type__": "cc.Vec2", "__type__": "cc.Vec2",
@@ -2561,7 +2564,7 @@
"_lpos": { "_lpos": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": 0, "x": 0,
"y": 8.873000000000005, "y": 0,
"z": 0 "z": 0
}, },
"_lrot": { "_lrot": {
@@ -2611,7 +2614,7 @@
"_lpos": { "_lpos": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": 0, "x": 0,
"y": 0, "y": 9.319,
"z": 0 "z": 0
}, },
"_lrot": { "_lrot": {
@@ -2740,8 +2743,8 @@
}, },
"_contentSize": { "_contentSize": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 150, "width": 110,
"height": 160 "height": 140
}, },
"_anchorPoint": { "_anchorPoint": {
"__type__": "cc.Vec2", "__type__": "cc.Vec2",
@@ -2788,12 +2791,12 @@
"__prefab": { "__prefab": {
"__id__": 211 "__id__": 211
}, },
"_alignFlags": 41, "_alignFlags": 45,
"_target": null, "_target": null,
"_left": 0, "_left": 5,
"_right": 0, "_right": 5,
"_top": 5.827000000000003, "_top": 5,
"_bottom": 0, "_bottom": 5,
"_horizontalCenter": 0, "_horizontalCenter": 0,
"_verticalCenter": 0, "_verticalCenter": 0,
"_isAbsLeft": true, "_isAbsLeft": true,
@@ -2803,7 +2806,7 @@
"_isAbsHorizontalCenter": true, "_isAbsHorizontalCenter": true,
"_isAbsVerticalCenter": true, "_isAbsVerticalCenter": true,
"_originalWidth": 200, "_originalWidth": 200,
"_originalHeight": 0, "_originalHeight": 160,
"_alignMode": 2, "_alignMode": 2,
"_lockFlags": 0, "_lockFlags": 0,
"_id": "" "_id": ""
@@ -2900,7 +2903,7 @@
"_lpos": { "_lpos": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": 0, "x": 0,
"y": 72.844, "y": 56.345,
"z": 0 "z": 0
}, },
"_lrot": { "_lrot": {
@@ -2979,8 +2982,8 @@
"_string": "名称", "_string": "名称",
"_horizontalAlign": 1, "_horizontalAlign": 1,
"_verticalAlign": 1, "_verticalAlign": 1,
"_actualFontSize": 25, "_actualFontSize": 20,
"_fontSize": 25, "_fontSize": 20,
"_fontFamily": "Arial", "_fontFamily": "Arial",
"_lineHeight": 30, "_lineHeight": 30,
"_overflow": 2, "_overflow": 2,
@@ -3001,7 +3004,7 @@
"b": 0, "b": 0,
"a": 255 "a": 255
}, },
"_outlineWidth": 3, "_outlineWidth": 2,
"_enableShadow": false, "_enableShadow": false,
"_shadowColor": { "_shadowColor": {
"__type__": "cc.Color", "__type__": "cc.Color",
@@ -3038,7 +3041,7 @@
"_target": null, "_target": null,
"_left": 0, "_left": 0,
"_right": 0, "_right": 0,
"_top": 6.856000000000002, "_top": 3.654999999999994,
"_bottom": 0, "_bottom": 0,
"_horizontalCenter": 0, "_horizontalCenter": 0,
"_verticalCenter": 0, "_verticalCenter": 0,
@@ -3095,7 +3098,7 @@
"_lpos": { "_lpos": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": 0, "x": 0,
"y": -75.451, "y": -59.128,
"z": 0 "z": 0
}, },
"_lrot": { "_lrot": {
@@ -3135,7 +3138,7 @@
}, },
"_contentSize": { "_contentSize": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 52.1689453125, "width": 42.53515625,
"height": 54.4 "height": 54.4
}, },
"_anchorPoint": { "_anchorPoint": {
@@ -3174,8 +3177,8 @@
"_string": "Lv.1", "_string": "Lv.1",
"_horizontalAlign": 1, "_horizontalAlign": 1,
"_verticalAlign": 1, "_verticalAlign": 1,
"_actualFontSize": 25, "_actualFontSize": 20,
"_fontSize": 25, "_fontSize": 20,
"_fontFamily": "Arial", "_fontFamily": "Arial",
"_lineHeight": 40, "_lineHeight": 40,
"_overflow": 0, "_overflow": 0,
@@ -3230,6 +3233,184 @@
"targetOverrides": null, "targetOverrides": null,
"nestedPrefabInstanceRoots": null "nestedPrefabInstanceRoots": null
}, },
{
"__type__": "cc.Node",
"_name": "active",
"_objFlags": 0,
"__editorExtras__": {},
"_parent": {
"__id__": 1
},
"_children": [],
"_active": false,
"_components": [
{
"__id__": 230
},
{
"__id__": 232
},
{
"__id__": 234
}
],
"_prefab": {
"__id__": 236
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"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__": 229
},
"_enabled": true,
"__prefab": {
"__id__": 231
},
"_contentSize": {
"__type__": "cc.Size",
"width": 138,
"height": 168
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "6bRkXvBFBBQJTXKJ+lHn7F"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 229
},
"_enabled": true,
"__prefab": {
"__id__": 233
},
"_customMaterial": null,
"_srcBlendFactor": 2,
"_dstBlendFactor": 4,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 0,
"a": 187
},
"_spriteFrame": {
"__uuid__": "abc35b6e-b052-4835-a3a3-cb85abd47f4d@b2a38",
"__expectedType__": "cc.SpriteFrame"
},
"_type": 1,
"_fillType": 0,
"_sizeMode": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_useGrayscale": false,
"_atlas": {
"__uuid__": "abc35b6e-b052-4835-a3a3-cb85abd47f4d",
"__expectedType__": "cc.SpriteAtlas"
},
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "0aBT/Ljh5P+KFlQ7DgfNYD"
},
{
"__type__": "cc.Widget",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 229
},
"_enabled": true,
"__prefab": {
"__id__": 235
},
"_alignFlags": 45,
"_target": null,
"_left": -9,
"_right": -9,
"_top": -9,
"_bottom": -9,
"_horizontalCenter": 0,
"_verticalCenter": 0,
"_isAbsLeft": true,
"_isAbsRight": true,
"_isAbsTop": true,
"_isAbsBottom": true,
"_isAbsHorizontalCenter": true,
"_isAbsVerticalCenter": true,
"_originalWidth": 108,
"_originalHeight": 108,
"_alignMode": 2,
"_lockFlags": 0,
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "52xFvF0H5D/b9QPel8K40f"
},
{
"__type__": "cc.PrefabInfo",
"root": {
"__id__": 1
},
"asset": {
"__id__": 0
},
"fileId": "75YtWkfHpD8KJXX18oHnIP",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{ {
"__type__": "cc.UITransform", "__type__": "cc.UITransform",
"_name": "", "_name": "",
@@ -3240,12 +3421,12 @@
}, },
"_enabled": true, "_enabled": true,
"__prefab": { "__prefab": {
"__id__": 230 "__id__": 238
}, },
"_contentSize": { "_contentSize": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 150, "width": 120,
"height": 189.4 "height": 150
}, },
"_anchorPoint": { "_anchorPoint": {
"__type__": "cc.Vec2", "__type__": "cc.Vec2",
@@ -3268,7 +3449,7 @@
}, },
"_enabled": true, "_enabled": true,
"__prefab": { "__prefab": {
"__id__": 232 "__id__": 240
}, },
"name_node": { "name_node": {
"__id__": 215 "__id__": 215
@@ -3281,7 +3462,9 @@
"BG_node": { "BG_node": {
"__id__": 2 "__id__": 2
}, },
"lvl_node": null, "lvl_node": {
"__id__": 226
},
"_id": "" "_id": ""
}, },
{ {

3204
assets/resources/gui/element/heros.prefab
View File

File diff suppressed because it is too large Load Diff

5
assets/resources/gui/element/ranks.prefab
View File

@@ -1111,10 +1111,7 @@
"b": 255, "b": 255,
"a": 255 "a": 255
}, },
"_spriteFrame": { "_spriteFrame": null,
"__uuid__": "cb93c900-b440-4571-91d1-7da1636e3d73@bc0ca",
"__expectedType__": "cc.SpriteFrame"
},
"_type": 1, "_type": 1,
"_fillType": 0, "_fillType": 0,
"_sizeMode": 1, "_sizeMode": 1,

628
assets/resources/gui/role_controller.prefab
View File

File diff suppressed because it is too large Load Diff

8
assets/resources/gui/ui3.plist.meta
View File

@@ -2462,10 +2462,10 @@
"height": 108, "height": 108,
"rawWidth": 108, "rawWidth": 108,
"rawHeight": 108, "rawHeight": 108,
"borderTop": 0, "borderTop": 54,
"borderBottom": 0, "borderBottom": 54,
"borderLeft": 0, "borderLeft": 54,
"borderRight": 0, "borderRight": 54,
"packable": true, "packable": true,
"pixelsToUnit": 100, "pixelsToUnit": 100,
"pivotX": 0.5, "pivotX": 0.5,

8
assets/resources/gui/ui6.plist.meta
View File

@@ -3934,10 +3934,10 @@
"height": 57, "height": 57,
"rawWidth": 90, "rawWidth": 90,
"rawHeight": 57, "rawHeight": 57,
"borderTop": 0, "borderTop": 28.5,
"borderBottom": 0, "borderBottom": 28.5,
"borderLeft": 0, "borderLeft": 45,
"borderRight": 0, "borderRight": 45,
"packable": true, "packable": true,
"pixelsToUnit": 100, "pixelsToUnit": 100,
"pivotX": 0.5, "pivotX": 0.5,

85
assets/script/game/map/CardLiteComp.ts
View File

@@ -9,7 +9,7 @@
* *
* 关键设计： * 关键设计：
* - 轻量版 CardComp，无拖拽使用、无锁定、无费用扣除等交互。 * - 轻量版 CardComp，无拖拽使用、无锁定、无费用扣除等交互。
* - 英雄卡图标使用 AnimationClip 动态加载 idle 动画；非英雄卡使用静态图标。 * - 英雄卡图标加载 idle 动画剪辑并提取首帧静态展示；非英雄卡使用静态图标。
* - 通过 iconVisualToken 防止异步加载竞态。 * - 通过 iconVisualToken 防止异步加载竞态。
* *
* 依赖： * 依赖：
@@ -19,12 +19,11 @@
* - smc —— 全局单例，访问图标图集缓存 * - smc —— 全局单例，访问图标图集缓存
*/ */
import { mLogger } from "../common/Logger"; import { mLogger } from "../common/Logger";
import { _decorator, Animation, AnimationClip, EventTouch, Label, Node, NodeEventType, Sprite, SpriteAtlas, Tween, tween, UIOpacity, Vec3, resources, UITransform, Widget } from "cc"; import { _decorator, AnimationClip, EventTouch, Label, Node, NodeEventType, Sprite, SpriteFrame, Tween, tween, UIOpacity, Vec3, resources } from "cc";
import { ecs } from "../../../../extensions/oops-plugin-framework/assets/libs/ecs/ECS"; import { ecs } from "../../../../extensions/oops-plugin-framework/assets/libs/ecs/ECS";
import { CCComp } from "../../../../extensions/oops-plugin-framework/assets/module/common/CCComp"; import { CCComp } from "../../../../extensions/oops-plugin-framework/assets/module/common/CCComp";
import { CardConfig, CardType, SpecialRefreshCardList, SpecialUpgradeCardList, CKind, CardPoolList } from "../common/config/CardSet"; import { CardConfig, CardType, SpecialRefreshCardList, SpecialUpgradeCardList, CKind, CardPoolList } from "../common/config/CardSet";
import { SkillCardList } from "../common/config/SCardSet"; import { SkillCardList } from "../common/config/SCardSet";
import { CardBgComp } from "./CardBgComp";
import { HeroInfo } from "../common/config/heroSet"; import { HeroInfo } from "../common/config/heroSet";
import { SkillSet } from "../common/config/SkillSet"; import { SkillSet } from "../common/config/SkillSet";
import { getLvColor } from "../common/config/GameSet"; import { getLvColor } from "../common/config/GameSet";
@@ -32,6 +31,9 @@ import { smc } from "../common/SingletonModuleComp";
const { ccclass, property } = _decorator; const { ccclass, property } = _decorator;
/** card_lv → BG_node 子节点（颜色）名映射：1=green 2=blue 3=purple 4=yellow 5=red */
const BG_COLORS = ["green", "blue", "purple", "yellow", "red"];
/** /**
* CardLiteComp —— 单张卡牌简单视图组件 * CardLiteComp —— 单张卡牌简单视图组件
* *
@@ -152,6 +154,15 @@ export class CardLiteComp extends CCComp {
this.node.active = false; this.node.active = false;
} }
/**
* 设置选中态：切换根节点下 `active` 子节点的显隐（不再通过缩放表达选中）。
* @param selected 是否选中
*/
setSelected(selected: boolean) {
const mark = this.node.getChildByName("active");
if (mark) mark.active = selected;
}
// ======================== 事件绑定 ======================== // ======================== 事件绑定 ========================
private bindEvents() { private bindEvents() {
@@ -211,15 +222,11 @@ export class CardLiteComp extends CCComp {
parentName: this.node.parent?.name || "none", parentName: this.node.parent?.name || "none",
}); });
const kindName = CKind[this.cardData.kind]; // 背景：按 card_lv 切换颜色底框（BG_node 下为 green/blue/purple/yellow/red 子节点）
if (this.BG_node) { if (this.BG_node) {
const bgLv = this.cardData.base_card_lv ?? this.cardData.card_lv; const bgLv = Math.min(Math.max(this.cardData.base_card_lv ?? this.cardData.card_lv ?? 1, 1), 5);
this.BG_node.children.forEach(child => { const color = BG_COLORS[bgLv - 1];
child.active = (child.name === kindName); this.BG_node.children.forEach(child => child.active = (child.name === color));
const bg = child.getComponent(CardBgComp);
if (bg) child.active ? bg.apply(bgLv) : bg.clear();
});
} }
if (this.card_type === CardType.Hero) { if (this.card_type === CardType.Hero) {
@@ -271,7 +278,6 @@ export class CardLiteComp extends CCComp {
return; return;
} }
iconNode.setScale(new Vec3(1, 1, 1)); iconNode.setScale(new Vec3(1, 1, 1));
this.clearIconAnimation(iconNode);
const iconId = this.resolveCardIconId(this.card_type, this.card_uuid); const iconId = this.resolveCardIconId(this.card_type, this.card_uuid);
if (iconId) { if (iconId) {
this.updateIcon(iconNode, iconId); this.updateIcon(iconNode, iconId);
@@ -297,15 +303,10 @@ export class CardLiteComp extends CCComp {
} }
if (this.lvl_node) this.lvl_node.node.active = false; if (this.lvl_node) this.lvl_node.node.active = false;
if (this.BG_node) { if (this.BG_node) {
this.BG_node.children.forEach(child => { this.BG_node.children.forEach(child => child.active = false);
child.active = false;
const bg = child.getComponent(CardBgComp);
if (bg) bg.clear();
});
} }
if (this.icon_node) { if (this.icon_node) {
(this.icon_node as Node).setScale(new Vec3(1, 1, 1)); this.icon_node.setScale(new Vec3(1, 1, 1));
this.clearIconAnimation(this.icon_node as Node);
const sprite = this.icon_node?.getComponent(Sprite) || this.icon_node?.getComponentInChildren(Sprite); const sprite = this.icon_node?.getComponent(Sprite) || this.icon_node?.getComponentInChildren(Sprite);
if (sprite) sprite.spriteFrame = null; if (sprite) sprite.spriteFrame = null;
} }
@@ -363,46 +364,42 @@ export class CardLiteComp extends CCComp {
} }
/** /**
* 为英雄卡图标加载并播放 idle 动画。 * 为英雄图标加载 idle 动画剪辑，提取首帧 SpriteFrame 静止展示（参考 CHeroComp）。
* 使用 token 做竞态保护，确保异步回调时不会覆盖已更新的图标。 * 使用 token 做竞态保护，确保异步回调时不会覆盖已更新的图标。
*/ */
private updateHeroAnimation(node: Node, uuid: number, token: number) { private updateHeroAnimation(node: Node, uuid: number, token: number) {
const sprite = node?.getComponent(Sprite) || node?.getComponentInChildren(Sprite); if (!node || !node.isValid) return;
const sprite = node.getComponent(Sprite) || node.getComponentInChildren(Sprite);
if (sprite) sprite.spriteFrame = null; if (sprite) sprite.spriteFrame = null;
const hero = HeroInfo[uuid]; const hero = HeroInfo[uuid];
if (!hero) return; if (!hero) return;
const anim = node.getComponent(Animation) || node.addComponent(Animation);
this.clearAnimationClips(anim);
const path = `game/heros/hero/${hero.path}/idle`; const path = `game/heros/hero/${hero.path}/idle`;
resources.load(path, AnimationClip, (err, clip) => { resources.load(path, AnimationClip, (err, clip) => {
if (err || !clip) { if (err || !clip) {
mLogger.log(this.debugMode, "CardLiteComp", `load hero animation failed ${uuid}`, err); mLogger.log(this.debugMode, "CardLiteComp", `load hero idle failed ${uuid}`, err);
return; return;
} }
if (token !== this.iconVisualToken || !this.cardData || this.card_type !== CardType.Hero || this.card_uuid !== uuid) { // 竞态保护：仅允许最新一次图标请求落地
return; if (token !== this.iconVisualToken || !node.isValid) return;
const target = node.getComponent(Sprite) || node.getComponentInChildren(Sprite);
if (!target || !target.isValid) return;
// 帧动画数据存于 spriteFrame 轨道的 _channel._curve._values（裸 SpriteFrame 数组）
let firstFrame: SpriteFrame | undefined;
for (const track of clip.tracks) {
const curve = (track as unknown as { channel?: { curve?: { _values?: unknown[] } } }).channel?.curve;
const frame = curve?._values?.[0];
if (frame instanceof SpriteFrame) {
firstFrame = frame;
break;
}
}
if (firstFrame) {
target.spriteFrame = firstFrame;
} }
this.clearAnimationClips(anim);
anim.addClip(clip);
anim.play("idle");
}); });
} }
/** 清除图标节点上的动画（停止播放并移除所有 clip） */
private clearIconAnimation(node: Node) {
const anim = node?.getComponent(Animation);
if (!anim) return;
anim.stop();
this.clearAnimationClips(anim);
}
/** 移除 Animation 组件上的全部 AnimationClip */
private clearAnimationClips(anim: Animation) {
const clips = (anim as any).clips as AnimationClip[] | undefined;
if (!clips || clips.length === 0) return;
[...clips].forEach(clip => anim.removeClip(clip, true));
}
// ======================== 生命周期钩子 ======================== // ======================== 生命周期钩子 ========================
/** ECS 组件移除时的释放钩子：销毁节点 */ /** ECS 组件移除时的释放钩子：销毁节点 */

10
assets/script/game/map/HerosListComp.ts
View File

@@ -226,13 +226,13 @@ export class HerosListComp extends CCComp {
} }
private highlightCard(cardNode: Node) { private highlightCard(cardNode: Node) {
// 取消旧选中：关闭其 active 标识节点
if (this.selectNode) { if (this.selectNode) {
const oldWidget = this.selectNode.getComponent(Widget) this.selectNode.getComponent(CardLiteComp)?.setSelected(false)
if (oldWidget) oldWidget.enabled = false
this.selectNode.setScale(1, 1, 1)
} }
this.selectNode = cardNode this.selectNode = cardNode
cardNode.setScale(1.1, 1.1, 1) // 新选中：激活根节点下的 active 标识节点（替代原缩放高亮）
cardNode.getComponent(CardLiteComp)?.setSelected(true)
} }
private onCardSelect(uuid: number) { private onCardSelect(uuid: number) {
@@ -336,7 +336,7 @@ export class HerosListComp extends CCComp {
// 碎片图标：使用 ChipComp 渲染英雄图标（自动读取 HeroInfo 配置） // 碎片图标：使用 ChipComp 渲染英雄图标（自动读取 HeroInfo 配置）
if (this.chip_node) { if (this.chip_node) {
const chipComp = this.chip_node.getComponent(ChipComp) || this.chip_node.addComponent(ChipComp) const chipComp = this.chip_node.getComponent(ChipComp) || this.chip_node.addComponent(ChipComp)
chipComp.setHeroIconByUuid(uuid) chipComp.setHeroByUuid(uuid)
} }
// 升级按钮状态：未满级且碎片足够时可用 // 升级按钮状态：未满级且碎片足够时可用