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

feat(card&ui): add custom card icon support and optimize icon display

Browse Source 
1. 新增CardConfig的icon字段用于配置自定义卡牌图标，优先级最高
2. 为HInfoComp新增技能图标节点，区分英雄卡和技能卡的图标展示
3. 重构updateSkillAnimation方法，支持按配置优先级加载图标
4. 优化两种卡牌的图标显示互斥逻辑
This commit is contained in:
panFD
2026-06-20 15:11:37 +08:00
parent 0a281a95d1
commit 4d6403e362
3 changed files with 606 additions and 447 deletions
Download Patch File Download Diff File Expand all files Collapse all files

994
assets/resources/gui/element/hnode.prefab
View File

File diff suppressed because it is too large Load Diff

2
assets/script/game/common/config/CardSet.ts
View File

@@ -86,6 +86,7 @@ export interface CardConfig {
// 技能卡扩展属性
skill?: number // 关联的技能 UUID
icon?: string // 图标ID（可选，优先使用；未设置时按 trigger_type 从 SkillSet/FieldSkillSet 自动取）
name?: string // 卡牌名称
info?: string // 卡牌描述信息
is_inst?: boolean // 是否即时起效
@@ -265,6 +266,7 @@ SkillCardData.forEach(data => {
card_lv: 1,
name: data.name,
info: data.info,
icon: data.icon, // 【新增】透传自定义图标ID（优先级最高）
is_inst: data.is_inst,
t_times: data.t_times || (data.is_inst ? 1 : 999),
t_inv: data.t_inv || 0,

57
assets/script/game/map/HInfoComp.ts
View File

@@ -35,7 +35,7 @@ import { mLogger } from "../common/Logger";
import { MissionHeroComp } from "./MissionHeroComp";
import { MoveComp } from "../hero/MoveComp";
import { FacSet, getLvColor } from "../common/config/GameSet";
import { CKind, CardPoolList } from "../common/config/CardSet";
import { CKind, CardPoolList, CardConfig, CardTriggerType } from "../common/config/CardSet";
import { SkillSet } from "../common/config/SkillSet";
import { CardBgComp } from "./CardBgComp";
import { MissionEconomy } from "./MissionEconomy";
@@ -54,6 +54,9 @@ export class HInfoComp extends CCComp {
/** 英雄 idle 动画图标节点 */
@property(Node)
icon_node=null!
/** 技能图标节点 */
@property(Node)
skill_icon_node=null!
/** 出售按钮节点 */
@property(Node)
sell_node=null!
@@ -169,6 +172,10 @@ export class HInfoComp extends CCComp {
if (this.isSkillCard) {
// ================= 技能卡预览 =================
// 互斥：技能卡只显示技能图标，隐藏英雄图标
if (this.icon_node) this.icon_node.active = false;
if (this.skill_icon_node) this.skill_icon_node.active = true;
const config = CardPoolList.find(c => c.uuid === heroUuid);
if (!config) return;
@@ -192,10 +199,14 @@ export class HInfoComp extends CCComp {
if (heroUuid !== this.iconHeroUuid) {
this.iconHeroUuid = heroUuid;
this.iconVisualToken += 1;
this.updateSkillAnimation(this.icon_node, config.skill ?? heroUuid, this.iconVisualToken);
this.updateSkillAnimation(this.skill_icon_node, config, this.iconVisualToken);
}
} else {
// ================= 英雄卡预览 =================
// 互斥：英雄卡只显示英雄图标，隐藏技能图标
if (this.icon_node) this.icon_node.active = true;
if (this.skill_icon_node) this.skill_icon_node.active = false;
const hero = HeroInfo[heroUuid];
if (!hero) return;
@@ -461,31 +472,35 @@ export class HInfoComp extends CCComp {
/**
* 为技能图标加载静态图片。
* @param node 图标节点
* @param skillUuid 技能 UUID
* @param token 视觉令牌
* 图标来源优先级：config.icon > 按 trigger_type 自动取（Interval→SkillSet，Field→FieldSkillSet）。
* @param node 图标节点
* @param config 卡牌配置
* @param token 视觉令牌
*/
private updateSkillAnimation(node: Node, skillUuid: number, token: number) {
private updateSkillAnimation(node: Node, config: CardConfig, token: number) {
if (!node) return;
this.clearIconAnimation(node); // 停止之前的动画
this.clearIconAnimation(node);
const sprite = node.getComponent(Sprite) || node.getComponentInChildren(Sprite);
if (!sprite) return;
sprite.spriteFrame = null;
const skillData = SkillSet[skillUuid];
if (!skillData || !skillData.icon) {
sprite.spriteFrame = null;
return;
}
if (smc.uiconsAtlas) {
const frame = smc.uiconsAtlas.getSpriteFrame(skillData.icon);
if (frame && token === this.iconVisualToken) {
sprite.spriteFrame = frame;
// 优先使用卡牌自定义 icon；未定义则按 trigger_type 自动取
let iconId: string | undefined = config.icon;
if (!iconId) {
if (config.trigger_type === CardTriggerType.Interval) {
iconId = config.skill ? SkillSet[config.skill]?.icon : undefined;
} else if (config.trigger_type === CardTriggerType.Field) {
const fieldUuid = config.field?.[0];
iconId = fieldUuid ? FieldSkillSet[fieldUuid]?.icon : undefined;
}
} else {
const sf = oops.res.get("game/heros/cards/" + skillData.icon, SpriteFrame) as SpriteFrame;
if (sf && token === this.iconVisualToken) {
sprite.spriteFrame = sf;
}
if (!iconId) return;
// 与 CardComp / SCardComp 一致：仅信任全局缓存的 uiconsAtlas
if (smc.uiconsAtlas) {
const frame = smc.uiconsAtlas.getSpriteFrame(iconId);
if (token === this.iconVisualToken) {
sprite.spriteFrame = frame || null;
}
}
}