3 Commits

Author SHA1 Message Date
panFD
998300f721 feat(技能UI): 添加技能冷却遮罩显示功能
为SkillBoxComp组件新增CD遮罩的初始化与帧更新逻辑,根据技能触发间隔动态计算冷却进度
调整多个技能相关预制体的布局,添加cd_mask精灵节点以支持冷却UI展示
优化部分技能框的UI排版与节点配置
2026-06-04 21:12:12 +08:00
panFD
ac1c810636 feat(技能框): 添加技能释放动画并优化UI显示
添加技能触发时的缩放缓动动画,播放前停止已有缓动避免异常,增强操作视觉反馈。
调整技能剩余次数的显示格式,移除多余的“次”后缀。
更新技能框预制体,新增CD遮罩节点并调整图标布局与缩放参数,同时替换关联UI图片资源。
2026-06-04 20:42:22 +08:00
panFD
237df1dc4e 重构(地图卡牌): 抽离技能卡牌逻辑为独立组件
- 新增SCardComp.ts,实现技能卡牌专属的UI渲染、点击交互与使用逻辑
- 更新MissionCardComp.ts,替换技能卡槽的组件类型为SCardComp并修正相关代码
- 重构CardComp.ts:移除所有Skill类型卡牌的处理代码,修复卡牌等级取值优先级问题,简化拖拽逻辑仅保留英雄卡上划使用功能
2026-06-04 19:08:54 +08:00
13 changed files with 22822 additions and 2757 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -99,7 +99,7 @@
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 200,
"x": 183.23,
"y": 177,
"z": 0
},
@@ -446,6 +446,8 @@
"__id__": 0
},
"fileId": "b7CXK9ttxDz5mrJpDB4qA4",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
@@ -476,7 +478,7 @@
"_lpos": {
"__type__": "cc.Vec3",
"x": 100,
"y": 200,
"y": 215.538,
"z": 0
},
"_lrot": {
@@ -781,8 +783,6 @@
"__id__": 0
},
"fileId": "adFmHHJ5BBAY0CazvLDgGw",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
@@ -822,6 +822,8 @@
"__id__": 0
},
"fileId": "36Na+WXPtJRbtR9UQnCyaj",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
@@ -852,7 +854,7 @@
"_lpos": {
"__type__": "cc.Vec3",
"x": 100,
"y": 117.776,
"y": 100.445,
"z": 0
},
"_lrot": {
@@ -1157,8 +1159,6 @@
"__id__": 0
},
"fileId": "96QFNOz55OyZEByIPMUwVi",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
@@ -1198,6 +1198,8 @@
"__id__": 0
},
"fileId": "06y3o47t5NjZX9yks6rQWL",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
@@ -1227,7 +1229,7 @@
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 0,
"x": 14.536,
"y": 250,
"z": 0
},
@@ -1574,6 +1576,8 @@
"__id__": 0
},
"fileId": "f2j7DYVutESIJc8Q7SiM91",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
@@ -1603,7 +1607,7 @@
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 0,
"x": 9.847,
"y": 74.669,
"z": 0
},
@@ -1950,6 +1954,8 @@
"__id__": 0
},
"fileId": "cdrD/D+WdDiZtHCrbPOfP7",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{

File diff suppressed because it is too large Load Diff

View File

@@ -38,19 +38,25 @@
},
{
"__id__": 56
},
{
"__id__": 64
},
{
"__id__": 72
}
],
"_active": true,
"_components": [
{
"__id__": 62
"__id__": 78
},
{
"__id__": 64
"__id__": 80
}
],
"_prefab": {
"__id__": 66
"__id__": 82
},
"_lpos": {
"__type__": "cc.Vec3",
@@ -1151,7 +1157,7 @@
"_lpos": {
"__type__": "cc.Vec3",
"x": 0,
"y": 35,
"y": 30.251,
"z": 0
},
"_lrot": {
@@ -1163,8 +1169,8 @@
},
"_lscale": {
"__type__": "cc.Vec3",
"x": 0.9,
"y": 0.9,
"x": 0.7,
"y": 0.7,
"z": 1
},
"_mobility": 0,
@@ -1268,7 +1274,7 @@
},
{
"__type__": "cc.Node",
"_name": "Label",
"_name": "cdui",
"_objFlags": 0,
"__editorExtras__": {},
"_parent": {
@@ -1282,10 +1288,360 @@
},
{
"__id__": 59
},
{
"__id__": 61
}
],
"_prefab": {
"__id__": 61
"__id__": 63
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 0,
"y": 30,
"z": 0
},
"_lrot": {
"__type__": "cc.Quat",
"x": 0,
"y": 0,
"z": 0.7071067811865475,
"w": 0.7071067811865476
},
"_lscale": {
"__type__": "cc.Vec3",
"x": 1,
"y": 1,
"z": 1
},
"_mobility": 0,
"_layer": 1073741824,
"_euler": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 90
},
"_id": ""
},
{
"__type__": "cc.UITransform",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 56
},
"_enabled": true,
"__prefab": {
"__id__": 58
},
"_contentSize": {
"__type__": "cc.Size",
"width": 56,
"height": 56
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "8cuCMcJklDi6scy5fggLvA"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 56
},
"_enabled": true,
"__prefab": {
"__id__": 60
},
"_customMaterial": null,
"_srcBlendFactor": 2,
"_dstBlendFactor": 4,
"_color": {
"__type__": "cc.Color",
"r": 0,
"g": 0,
"b": 0,
"a": 114
},
"_spriteFrame": {
"__uuid__": "cb93c900-b440-4571-91d1-7da1636e3d73@d8db6",
"__expectedType__": "cc.SpriteFrame"
},
"_type": 3,
"_fillType": 2,
"_sizeMode": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_useGrayscale": false,
"_atlas": null,
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "cbySXykHtKaIF2cehy7c2w"
},
{
"__type__": "cc.Widget",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 56
},
"_enabled": true,
"__prefab": {
"__id__": 62
},
"_alignFlags": 45,
"_target": null,
"_left": 2,
"_right": 2,
"_top": 2,
"_bottom": 2,
"_horizontalCenter": 0,
"_verticalCenter": 0,
"_isAbsLeft": true,
"_isAbsRight": true,
"_isAbsTop": true,
"_isAbsBottom": true,
"_isAbsHorizontalCenter": true,
"_isAbsVerticalCenter": true,
"_originalWidth": 56,
"_originalHeight": 58,
"_alignMode": 2,
"_lockFlags": 0,
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "8bo+PVCiFGga4aZPi+w2yF"
},
{
"__type__": "cc.PrefabInfo",
"root": {
"__id__": 1
},
"asset": {
"__id__": 0
},
"fileId": "b36dIBgWBNL7F+ZdA3AV7a",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
"__type__": "cc.Node",
"_name": "SkillFrame_01_Border_Blue",
"_objFlags": 0,
"__editorExtras__": {},
"_parent": {
"__id__": 1
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 65
},
{
"__id__": 67
},
{
"__id__": 69
}
],
"_prefab": {
"__id__": 71
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 0,
"y": 30,
"z": 0
},
"_lrot": {
"__type__": "cc.Quat",
"x": 0,
"y": 0,
"z": 0,
"w": 1
},
"_lscale": {
"__type__": "cc.Vec3",
"x": 0.4,
"y": 0.4,
"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__": 64
},
"_enabled": true,
"__prefab": {
"__id__": 66
},
"_contentSize": {
"__type__": "cc.Size",
"width": 150,
"height": 150
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "bdhTW5lJ9PJamgUN/UmnC2"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 64
},
"_enabled": true,
"__prefab": {
"__id__": 68
},
"_customMaterial": null,
"_srcBlendFactor": 2,
"_dstBlendFactor": 4,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_spriteFrame": {
"__uuid__": "cb93c900-b440-4571-91d1-7da1636e3d73@654c0",
"__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": null,
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "74QdiEVndDl5Vqf5Hjj8qY"
},
{
"__type__": "cc.Widget",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 64
},
"_enabled": true,
"__prefab": {
"__id__": 70
},
"_alignFlags": 45,
"_target": null,
"_left": 0,
"_right": 0,
"_top": 0,
"_bottom": 0,
"_horizontalCenter": 0,
"_verticalCenter": 0,
"_isAbsLeft": true,
"_isAbsRight": true,
"_isAbsTop": true,
"_isAbsBottom": true,
"_isAbsHorizontalCenter": true,
"_isAbsVerticalCenter": true,
"_originalWidth": 56,
"_originalHeight": 58,
"_alignMode": 2,
"_lockFlags": 0,
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "17NmLP2VJDYqeNommRKja0"
},
{
"__type__": "cc.PrefabInfo",
"root": {
"__id__": 1
},
"asset": {
"__id__": 0
},
"fileId": "05/ViZ4x5CsKTMBvYgTNv7",
"instance": null,
"targetOverrides": null,
"nestedPrefabInstanceRoots": null
},
{
"__type__": "cc.Node",
"_name": "Label",
"_objFlags": 0,
"__editorExtras__": {},
"_parent": {
"__id__": 1
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 73
},
{
"__id__": 75
}
],
"_prefab": {
"__id__": 77
},
"_lpos": {
"__type__": "cc.Vec3",
@@ -1322,11 +1678,11 @@
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 56
"__id__": 72
},
"_enabled": true,
"__prefab": {
"__id__": 58
"__id__": 74
},
"_contentSize": {
"__type__": "cc.Size",
@@ -1350,11 +1706,11 @@
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 56
"__id__": 72
},
"_enabled": true,
"__prefab": {
"__id__": 60
"__id__": 76
},
"_customMaterial": null,
"_srcBlendFactor": 2,
@@ -1435,12 +1791,12 @@
},
"_enabled": true,
"__prefab": {
"__id__": 63
"__id__": 79
},
"_contentSize": {
"__type__": "cc.Size",
"width": 70,
"height": 70
"width": 60,
"height": 60
},
"_anchorPoint": {
"__type__": "cc.Vec2",
@@ -1463,13 +1819,16 @@
},
"_enabled": true,
"__prefab": {
"__id__": 65
"__id__": 81
},
"icon_node": {
"__id__": 50
},
"info_label": {
"__id__": 59
"__id__": 75
},
"cd_mask": {
"__id__": 56
},
"_id": ""
},

View File

@@ -31,17 +31,17 @@
"_active": true,
"_components": [
{
"__id__": 444
"__id__": 445
},
{
"__id__": 446
"__id__": 447
},
{
"__id__": 448
"__id__": 449
}
],
"_prefab": {
"__id__": 450
"__id__": 451
},
"_lpos": {
"__type__": "cc.Vec3",
@@ -1386,7 +1386,7 @@
},
"_lpos": {
"__type__": "cc.Vec3",
"x": -270,
"x": -180,
"y": 0,
"z": 0
},
@@ -2514,7 +2514,7 @@
},
"_lpos": {
"__type__": "cc.Vec3",
"x": -90,
"x": 0,
"y": 0,
"z": 0
},
@@ -3622,7 +3622,7 @@
"__id__": 189
}
],
"_active": true,
"_active": false,
"_components": [
{
"__id__": 209
@@ -4764,7 +4764,7 @@
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 270,
"x": 180,
"y": 0,
"z": 0
},
@@ -9317,7 +9317,7 @@
},
"_contentSize": {
"__type__": "cc.Size",
"width": 720,
"width": 540,
"height": 200
},
"_anchorPoint": {
@@ -9345,8 +9345,8 @@
},
"_alignFlags": 44,
"_target": null,
"_left": 0,
"_right": 0,
"_left": 90,
"_right": 90,
"_top": 0,
"_bottom": -2,
"_horizontalCenter": 0,
@@ -9714,6 +9714,9 @@
},
{
"__id__": 443
},
{
"__id__": 444
}
],
"removedComponents": []
@@ -9816,6 +9819,16 @@
],
"value": 1193.667
},
{
"__type__": "CCPropertyOverrideInfo",
"targetInfo": {
"__id__": 436
},
"propertyPath": [
"_active"
],
"value": false
},
{
"__type__": "cc.UITransform",
"_name": "GameUI<UITransform>",
@@ -9826,7 +9839,7 @@
},
"_enabled": true,
"__prefab": {
"__id__": 445
"__id__": 446
},
"_contentSize": {
"__type__": "cc.Size",
@@ -9854,7 +9867,7 @@
},
"_enabled": true,
"__prefab": {
"__id__": 447
"__id__": 448
},
"_alignFlags": 45,
"_target": null,
@@ -9890,7 +9903,7 @@
},
"_enabled": true,
"__prefab": {
"__id__": 449
"__id__": 450
},
"debugMode": false,
"_id": ""

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 1.1 MiB

View File

@@ -298,7 +298,7 @@ export class CardComp extends CCComp {
reason: "",
uuid: this.cardData.uuid,
hero_lv: this.cardData.hero_lv ?? 1,
card_lv: this.cardData.pool_lv ?? 1
card_lv: this.cardData.base_pool_lv ?? this.cardData.pool_lv ?? 1
};
oops.message.dispatchEvent(GameEvent.UseHeroCard, guard);
if (guard.cancel) {
@@ -355,9 +355,6 @@ export class CardComp extends CCComp {
case CardType.Hero:
oops.message.dispatchEvent(GameEvent.CallHero, payload);
break;
case CardType.Skill:
oops.message.dispatchEvent(GameEvent.UseSkillCard, payload);
break;
case CardType.SpecialUpgrade:
case CardType.SpecialRefresh:
oops.message.dispatchEvent(GameEvent.UseSpecialCard, payload);
@@ -507,10 +504,7 @@ export class CardComp extends CCComp {
}
}
// 技能卡不支持上划移动
if (this.cardData.type !== CardType.Skill) {
this.node.setPosition(this.restPosition.x, this.restPosition.y + deltaY, this.restPosition.z);
}
this.node.setPosition(this.restPosition.x, this.restPosition.y + deltaY, this.restPosition.z);
}
/**
@@ -533,24 +527,13 @@ export class CardComp extends CCComp {
oops.gui.remove(UIID.HInfo);
}
// 技能卡改为点击使用
if (this.cardData.type === CardType.Skill) {
if (Math.abs(deltaY) < 20 && Math.abs(deltaX) < 20) {
const used = this.useCard();
if (!used) {
this.playReboundAnim();
}
return;
}
} else {
// 英雄卡保持上划使用
if (deltaY >= this.dragUseThreshold) {
const used = this.useCard();
if (!used) {
this.playReboundAnim();
}
return;
// 英雄卡保持上划使用
if (deltaY >= this.dragUseThreshold) {
const used = this.useCard();
if (!used) {
this.playReboundAnim();
}
return;
}
this.playReboundAnim();
@@ -722,19 +705,6 @@ export class CardComp extends CCComp {
this.hp_node.active = true;
// 英雄卡:隐藏技能信息节点
if (this.info_node) this.info_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);
const card_lv = Math.max(1, Math.floor(this.cardData.card_lv ?? 1));
const spSuffix = card_lv >= 2 ? "★".repeat(card_lv - 1) : "";
this.setLabel(this.name_node, `${spSuffix}${skillCard?.name || skill?.name || ""}${spSuffix}`);
this.ap_node.active = false;
this.hp_node.active = false;
// 技能卡:显示技能信息节点
if (this.info_node) this.info_node.active = true;
} else {
if (this.lvl_node) this.lvl_node.node.active = false;
// 特殊卡(升级 / 刷新):显示卡名 + 品质后缀 + 描述
@@ -758,11 +728,6 @@ export class CardComp extends CCComp {
}
}
if (this.name_node) {
const currentPos = this.name_node.position;
this.name_node.setPosition(currentPos.x, -70, currentPos.z);
}
// ---- 图标 ----
const iconNode = this.icon_node as Node;
if (this.card_type === CardType.Hero) {
@@ -880,10 +845,6 @@ export class CardComp extends CCComp {
});
});
if (this.name_node) {
const currentPos = this.name_node.position;
this.name_node.setPosition(currentPos.x, -70, currentPos.z);
}
this.iconVisualToken += 1;
this.setLabel(this.name_node, "");
if (this.cost_node) {
@@ -936,9 +897,6 @@ export class CardComp extends CCComp {
* @returns 图标帧名称
*/
private resolveCardIconId(type: CardType, uuid: number): string {
if (type === CardType.Skill) {
return SkillSet[uuid]?.icon || `${uuid}`;
}
if (type === CardType.Hero) {
return HeroInfo[uuid]?.icon || `${uuid}`;
}

View File

@@ -39,6 +39,7 @@ import { CCComp } from "../../../../extensions/oops-plugin-framework/assets/modu
import { GameEvent } from "../common/config/GameEvent";
import { CARD_POOL_INIT_LEVEL, CARD_POOL_MAX_LEVEL, CARD_POOL_UPGRADE_DISCOUNT_PER_WAVE, CardConfig, CardType, CardsUpSet, drawCardsByRule, getCardsByLv, SpecialRefreshCardList, SpecialRefreshHeroType, SpecialUpgradeCardList } from "../common/config/CardSet";
import { CardComp } from "./CardComp";
import { SCardComp } from "./SCardComp";
import { oops } from "db://oops-framework/core/Oops";
import { HeroAttrsComp } from "../hero/HeroAttrsComp";
import { smc } from "../common/SingletonModuleComp";
@@ -138,7 +139,7 @@ export class MissionCardComp extends CCComp {
/** 四个槽位对应的 CardComp 控制器缓存(有序数组) */
private cardComps: CardComp[] = [];
/** 技能卡槽控制器缓存 */
private skillCardComps: CardComp[] = [];
private skillCardComps: SCardComp[] = [];
/** 当前卡池等级(仅影响抽卡来源,不直接改卡槽现有内容) */
private poolLv: number = CARD_POOL_INIT_LEVEL;
/** 是否已缓存卡牌面板基准缩放 */
@@ -671,8 +672,8 @@ export class MissionCardComp extends CCComp {
const skillNodes = [this.skill_card1, this.skill_card2, this.skill_card3];
this.skillCardComps = skillNodes
.map(node => node?.getComponent(CardComp))
.filter((comp): comp is CardComp => !!comp);
.map(node => node?.getComponent(SCardComp))
.filter((comp): comp is SCardComp => !!comp);
}
// ======================== 核心业务:抽卡 & 升级 ========================

View File

@@ -0,0 +1,387 @@
/**
* @file SCardComp.ts
* @description 技能卡牌槽位组件UI 视图层)
*
* 职责:
* 1. 管理技能卡牌槽位的显示和交互(点击使用)。
* 2. 渲染技能卡面。
* 3. 触发使用时扣除费用并分发 UseSkillCard 事件。
*/
import { mLogger } from "../common/Logger";
import { _decorator, Animation, AnimationClip, EventTouch, Label, Node, NodeEventType, Sprite, SpriteAtlas, Tween, tween, UIOpacity, Vec3, UITransform, Widget } 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 { CardConfig, CardType, CKind, CardPoolList } from "../common/config/CardSet";
import { CardBgComp } from "./CardBgComp";
import { SkillSet } from "../common/config/SkillSet";
import { GameEvent } from "../common/config/GameEvent";
import { oops } from "db://oops-framework/core/Oops";
import { smc } from "../common/SingletonModuleComp";
import { MissionEconomy } from "./MissionEconomy";
const { ccclass, property } = _decorator;
@ccclass('SCardComp')
@ecs.register('SCardComp', false)
export class SCardComp extends CCComp {
private debugMode: boolean = true;
@property(Node)
name_node: Node = null!
@property(Node)
icon_node: Node = null!
@property(Node)
cost_node: Node = null!
@property(Node)
Ckind_node: Node = null!
@property(Node)
BG_node: Node = null!
@property(Node)
info_node: Node = null!
card_cost: number = 0
card_type: CardType = CardType.Skill
card_uuid: number = 0
private cardData: CardConfig | null = null;
private touchStartY: number = 0;
private touchStartX: number = 0;
private isDragging: boolean = false;
private isUsing: boolean = false;
private restPosition: Vec3 = new Vec3();
private hasFixedBasePosition: boolean = false;
private fixedBaseY: number = 0;
private fixedBaseZ: number = 0;
private opacityComp: UIOpacity | null = null;
private iconVisualToken: number = 0;
onLoad() {
this.bindEvents();
this.restPosition = this.node.position.clone();
this.opacityComp = this.node.getComponent(UIOpacity) || this.node.addComponent(UIOpacity);
this.opacityComp.opacity = 255;
this.applyEmptyUI();
}
onDestroy() {
super.onDestroy();
this.unbindEvents();
}
init() { }
start() {
this.node.active = true;
}
applyDrawCard(data: CardConfig | null): boolean {
if (!data) return false;
this.cardData = data;
this.card_uuid = data.uuid;
this.card_type = data.type;
this.card_cost = Math.floor(data.cost ?? 0);
this.node.active = true;
this.applyCardUI();
this.playRefreshAnim();
mLogger.log(this.debugMode, "SCardComp", "skill card updated", {
uuid: this.card_uuid,
cost: this.card_cost
});
return true;
}
useCard(): CardConfig | null {
if (!this.cardData || this.isUsing) return null;
const cardCost = this.card_cost;
const success = MissionEconomy.spendCoin(cardCost);
if (!success) {
oops.gui.toast(`金币不足,需要${cardCost}`);
this.playReboundAnim();
return null;
}
smc.vmdata.scores.refresh_hit_count++;
this.isUsing = true;
const used = this.cardData;
this.playUseDisappearAnim(() => {
this.clearAfterUse();
this.isUsing = false;
oops.message.dispatchEvent(GameEvent.UseSkillCard, used);
});
return used;
}
hasCard(): boolean {
return !!this.cardData;
}
setSlotPosition(x: number) {
const current = this.node.position;
if (!this.hasFixedBasePosition) {
this.fixedBaseY = current.y;
this.fixedBaseZ = current.z;
this.hasFixedBasePosition = true;
}
this.restPosition = new Vec3(x, this.fixedBaseY, this.fixedBaseZ);
if (!this.isDragging && !this.isUsing) {
this.node.setPosition(this.restPosition);
}
}
clearBySystem() {
Tween.stopAllByTarget(this.node);
if (this.opacityComp) {
Tween.stopAllByTarget(this.opacityComp);
this.opacityComp.opacity = 255;
}
this.cardData = null;
this.card_uuid = 0;
this.card_cost = 0;
this.isDragging = false;
this.isUsing = false;
this.node.setPosition(this.restPosition);
this.node.setScale(new Vec3(1, 1, 1));
this.applyEmptyUI();
this.node.active = false;
}
private clearAfterUse() {
Tween.stopAllByTarget(this.node);
if (this.opacityComp) {
Tween.stopAllByTarget(this.opacityComp);
this.opacityComp.opacity = 255;
}
this.cardData = null;
this.card_uuid = 0;
this.card_cost = 0;
this.isDragging = false;
this.node.setPosition(this.restPosition);
this.node.setScale(new Vec3(1, 1, 1));
this.applyEmptyUI();
this.node.active = false;
}
private bindEvents() {
this.node.on(NodeEventType.TOUCH_START, this.onCardTouchStart, this);
this.node.on(NodeEventType.TOUCH_MOVE, this.onCardTouchMove, this);
this.node.on(NodeEventType.TOUCH_END, this.onCardTouchEnd, this);
this.node.on(NodeEventType.TOUCH_CANCEL, this.onCardTouchCancel, this);
}
private unbindEvents() {
if (this.node && this.node.isValid) {
this.node.off(NodeEventType.TOUCH_START, this.onCardTouchStart, this);
this.node.off(NodeEventType.TOUCH_MOVE, this.onCardTouchMove, this);
this.node.off(NodeEventType.TOUCH_END, this.onCardTouchEnd, this);
this.node.off(NodeEventType.TOUCH_CANCEL, this.onCardTouchCancel, this);
}
}
private onCardTouchStart(event: EventTouch) {
if (!this.cardData || this.isUsing) return;
this.touchStartY = event.getUILocation().y;
this.touchStartX = event.getUILocation().x;
this.isDragging = true;
}
private onCardTouchMove(event: EventTouch) {
if (!this.isDragging || !this.cardData || this.isUsing) return;
// 技能卡不支持上拉移动
}
private onCardTouchEnd(event: EventTouch) {
if (!this.isDragging || !this.cardData || this.isUsing) return;
const endY = event.getUILocation().y;
const endX = event.getUILocation().x;
const deltaY = endY - this.touchStartY;
const deltaX = endX - this.touchStartX;
this.isDragging = false;
// 点击触发
if (Math.abs(deltaY) < 20 && Math.abs(deltaX) < 20) {
const used = this.useCard();
if (!used) {
this.playReboundAnim();
}
return;
}
this.playReboundAnim();
}
private onCardTouchCancel() {
if (!this.isDragging || this.isUsing) return;
this.isDragging = false;
this.playReboundAnim();
}
private applyCardUI() {
if (!this.cardData) {
this.applyEmptyUI();
return;
}
this.iconVisualToken += 1;
if (this.opacityComp) this.opacityComp.opacity = 255;
this.node.setPosition(this.restPosition.x, this.restPosition.y, this.restPosition.z);
const kindName = CKind[this.cardData.kind];
if (this.BG_node) {
const bgLv = this.cardData.base_pool_lv ?? this.cardData.pool_lv;
this.BG_node.children.forEach(child => {
child.active = (child.name === kindName);
const bg = child.getComponent(CardBgComp);
if (bg) child.active ? bg.apply(bgLv) : bg.clear();
});
}
if (this.Ckind_node) {
this.Ckind_node.children.forEach(child => {
child.active = (child.name === kindName);
});
}
this.node.children.forEach(child => {
const widget = child.getComponent(Widget);
if (widget) widget.updateAlignment();
child.children.forEach(subChild => {
const subWidget = subChild.getComponent(Widget);
if (subWidget) subWidget.updateAlignment();
});
});
const skill = SkillSet[this.card_uuid];
const skillCard = CardPoolList.find(c => c.uuid === this.card_uuid);
const card_lv = Math.max(1, Math.floor(this.cardData.card_lv ?? 1));
const spSuffix = card_lv >= 2 ? "★".repeat(card_lv - 1) : "";
this.setLabel(this.name_node, `${spSuffix}${skillCard?.name || skill?.name || ""}${spSuffix}`);
if (this.info_node) this.info_node.active = true;
if (this.cost_node) {
this.cost_node.active = true;
const numNode = this.cost_node.getChildByName("num");
if (numNode) {
this.setLabel(numNode, `${this.card_cost}`);
}
}
const iconNode = this.icon_node as Node;
if (iconNode) {
iconNode.setScale(new Vec3(1, 1, 1));
this.clearIconAnimation(iconNode);
const iconId = skill?.icon || `${this.card_uuid}`;
this.updateIcon(iconNode, iconId);
}
}
private playRefreshAnim() {
Tween.stopAllByTarget(this.node);
this.node.setPosition(this.restPosition);
this.node.setScale(new Vec3(0.92, 0.92, 1));
tween(this.node)
.to(0.08, { scale: new Vec3(1.06, 1.06, 1) })
.to(0.1, { scale: new Vec3(1, 1, 1) })
.start();
}
private playReboundAnim() {
Tween.stopAllByTarget(this.node);
tween(this.node)
.to(0.12, {
position: new Vec3(this.restPosition.x, this.restPosition.y, this.restPosition.z),
scale: new Vec3(1, 1, 1)
})
.start();
}
private playUseDisappearAnim(onComplete: () => void) {
const targetPos = new Vec3(this.restPosition.x, this.restPosition.y + 120, this.restPosition.z);
Tween.stopAllByTarget(this.node);
if (this.opacityComp) {
Tween.stopAllByTarget(this.opacityComp);
this.opacityComp.opacity = 255;
tween(this.opacityComp)
.to(0.18, { opacity: 0 })
.start();
}
tween(this.node)
.to(0.18, {
position: targetPos,
scale: new Vec3(0.8, 0.8, 1)
})
.call(onComplete)
.start();
}
private applyEmptyUI() {
if (this.BG_node) {
this.BG_node.children.forEach(child => {
child.active = false;
const bg = child.getComponent(CardBgComp);
if (bg) bg.clear();
});
}
this.node.children.forEach(child => {
const widget = child.getComponent(Widget);
if (widget) widget.updateAlignment();
child.children.forEach(subChild => {
const subWidget = subChild.getComponent(Widget);
if (subWidget) subWidget.updateAlignment();
});
});
this.iconVisualToken += 1;
this.setLabel(this.name_node, "");
if (this.cost_node) {
const numNode = this.cost_node.getChildByName("num");
if (numNode) {
this.setLabel(numNode, "");
}
this.cost_node.active = false;
}
if (this.Ckind_node) {
this.Ckind_node.children.forEach(child => {
child.active = false;
});
}
if (this.info_node) this.info_node.active = false;
if (this.icon_node) {
(this.icon_node as 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);
if (sprite) sprite.spriteFrame = null;
}
}
private setLabel(node: Node | null, value: string) {
if (!node) return;
const label = node.getComponent(Label) || node.getComponentInChildren(Label);
if (label) label.string = value;
}
private updateIcon(node: Node, iconId: string) {
if (!node || !iconId) return;
const sprite = node.getComponent(Sprite) || node.getComponentInChildren(Sprite);
if (!sprite) return;
if (smc.uiconsAtlas) {
const frame = smc.uiconsAtlas.getSpriteFrame(iconId);
sprite.spriteFrame = frame || null;
}
}
private clearIconAnimation(node: Node) {
const anim = node?.getComponent(Animation);
if (!anim) return;
anim.stop();
const clips = (anim as any).clips as AnimationClip[] | undefined;
if (!clips || clips.length === 0) return;
[...clips].forEach(clip => anim.removeClip(clip, true));
}
/** ECS 组件移除时的释放钩子:销毁节点 */
reset() {
this.node.destroy();
}
}

View File

@@ -0,0 +1 @@
{"ver":"4.0.24","importer":"typescript","imported":true,"uuid":"3fe4ed29-26ed-4aef-9feb-a7a451a31f99","files":[],"subMetas":{},"userData":{}}

View File

@@ -26,7 +26,7 @@
* - smc.mission —— 游戏运行状态
*/
import { mLogger } from "../common/Logger";
import { _decorator, Node, Prefab, Sprite, Label, Vec3, resources, SpriteAtlas } from "cc";
import { _decorator, Node, Prefab, Sprite, Label, Vec3, resources, SpriteAtlas, tween, v3, Tween } 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 { CardPoolList } from "../common/config/CardSet";
@@ -56,6 +56,9 @@ export class SkillBoxComp extends CCComp {
@property(Label)
private info_label: Label = null;
/** cd计时遮罩 */
@property({ type: Node })
private cd_mask: Node = null;
// ======================== 技能配置 ========================
/** 技能 UUID */
@@ -175,11 +178,23 @@ export class SkillBoxComp extends CCComp {
if (this.info_label) {
if (!this.is_instant) {
const remain = Math.max(0, this.trigger_times - this.current_trigger_times);
this.info_label.string = `${remain}`;
this.info_label.string = `${remain}`;
} else {
this.info_label.string = "";
}
}
// 初始化或重置 CD 遮罩表现
if (this.cd_mask && this.cd_mask.isValid) {
let sprite = this.cd_mask.getComponent(Sprite);
if (sprite) {
if (this.is_instant || this.trigger_interval <= 0) {
sprite.fillRange = 0; // 无需冷却,直接归 0
} else {
sprite.fillRange = Math.max(0, 1 - (this.timer / this.trigger_interval));
}
}
}
}
// ======================== 战斗状态事件 ========================
@@ -271,6 +286,15 @@ export class SkillBoxComp extends CCComp {
if (this.current_trigger_times < this.trigger_times) {
this.timer += dt;
// 更新 CD 遮罩 (fillRange 从 1 降到 0)
if (this.cd_mask && this.cd_mask.isValid && this.trigger_interval > 0) {
let sprite = this.cd_mask.getComponent(Sprite);
if (sprite) {
sprite.fillRange = Math.max(0, 1 - (this.timer / this.trigger_interval));
}
}
if (this.timer >= this.trigger_interval) {
this.timer = 0;
this.triggerSkill();
@@ -304,6 +328,17 @@ export class SkillBoxComp extends CCComp {
const parentPos = this.node.parent ? this.node.parent.position : new Vec3(0, 0, 0);
targetPos.set(parentPos.x + localPos.x, parentPos.y + localPos.y, 0);
// 播放技能释放缓动动画:图标放大再缩回
if (this.node && this.node.isValid) {
// 停止之前的缓动,防止快速重复触发导致缩放异常
Tween.stopAllByTarget(this.node);
this.node.scale = v3(1, 1, 1);
tween(this.node)
.to(0.1, { scale: v3(1.3, 1.3, 1.3) })
.to(0.15, { scale: v3(1, 1, 1) })
.start();
}
oops.message.dispatchEvent(GameEvent.TriggerSkill, {
s_uuid: this.s_uuid,
isCardSkill: true, // 标记为卡牌技能(区别于英雄自身技能)