feat(技能框): 添加技能释放动画并优化UI显示

添加技能触发时的缩放缓动动画，播放前停止已有缓动避免异常，增强操作视觉反馈。
调整技能剩余次数的显示格式，移除多余的“次”后缀。
更新技能框预制体，新增CD遮罩节点并调整图标布局与缩放参数，同时替换关联UI图片资源。

assets/resources/gui/element/sbox.prefab

@@ -38,19 +38,22 @@
       },
       {
         "__id__": 56
-      }
-    ],
-    "_active": true,
-    "_components": [
-      {
-        "__id__": 62
       },
       {
         "__id__": 64
       }
     ],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 70
+      },
+      {
+        "__id__": 72
+      }
+    ],
     "_prefab": {
-      "__id__": 66
+      "__id__": 74
     },
     "_lpos": {
       "__type__": "cc.Vec3",
@@ -1151,7 +1154,7 @@
     "_lpos": {
       "__type__": "cc.Vec3",
       "x": 0,
-      "y": 35,
+      "y": 30.251,
       "z": 0
     },
     "_lrot": {
@@ -1163,8 +1166,8 @@
     },
     "_lscale": {
       "__type__": "cc.Vec3",
-      "x": 0.9,
+      "x": 0.7,
-      "y": 0.9,
+      "y": 0.7,
       "z": 1
     },
     "_mobility": 0,
@@ -1262,8 +1265,179 @@
       "__id__": 0
     },
     "fileId": "a33ReyWcpAoZY5ieotS6Ir",
-    "instance": null,
+    "nestedPrefabInstanceRoots": null
-    "targetOverrides": null,
+  },
+  {
+    "__type__": "cc.Node",
+    "_name": "SkillFrame_01_Border_Blue",
+    "_objFlags": 0,
+    "__editorExtras__": {},
+    "_parent": {
+      "__id__": 1
+    },
+    "_children": [],
+    "_active": true,
+    "_components": [
+      {
+        "__id__": 57
+      },
+      {
+        "__id__": 59
+      },
+      {
+        "__id__": 61
+      }
+    ],
+    "_prefab": {
+      "__id__": 63
+    },
+    "_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__": 56
+    },
+    "_enabled": true,
+    "__prefab": {
+      "__id__": 58
+    },
+    "_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__": 56
+    },
+    "_enabled": true,
+    "__prefab": {
+      "__id__": 60
+    },
+    "_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__": 56
+    },
+    "_enabled": true,
+    "__prefab": {
+      "__id__": 62
+    },
+    "_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",
     "nestedPrefabInstanceRoots": null
   },
   {
@@ -1278,14 +1452,14 @@
     "_active": true,
     "_components": [
       {
-        "__id__": 57
+        "__id__": 65
       },
       {
-        "__id__": 59
+        "__id__": 67
       }
     ],
     "_prefab": {
-      "__id__": 61
+      "__id__": 69
     },
     "_lpos": {
       "__type__": "cc.Vec3",
@@ -1322,11 +1496,11 @@
     "_objFlags": 0,
     "__editorExtras__": {},
     "node": {
-      "__id__": 56
+      "__id__": 64
     },
     "_enabled": true,
     "__prefab": {
-      "__id__": 58
+      "__id__": 66
     },
     "_contentSize": {
       "__type__": "cc.Size",
@@ -1350,11 +1524,11 @@
     "_objFlags": 0,
     "__editorExtras__": {},
     "node": {
-      "__id__": 56
+      "__id__": 64
     },
     "_enabled": true,
     "__prefab": {
-      "__id__": 60
+      "__id__": 68
     },
     "_customMaterial": null,
     "_srcBlendFactor": 2,
@@ -1421,8 +1595,6 @@
       "__id__": 0
     },
     "fileId": "95w1bEWo1Fx6DZZbD+r43Q",
-    "instance": null,
-    "targetOverrides": null,
     "nestedPrefabInstanceRoots": null
   },
   {
@@ -1435,12 +1607,12 @@
     },
     "_enabled": true,
     "__prefab": {
-      "__id__": 63
+      "__id__": 71
     },
     "_contentSize": {
       "__type__": "cc.Size",
-      "width": 70,
+      "width": 60,
-      "height": 70
+      "height": 60
     },
     "_anchorPoint": {
       "__type__": "cc.Vec2",
@@ -1463,13 +1635,13 @@
     },
     "_enabled": true,
     "__prefab": {
-      "__id__": 65
+      "__id__": 73
     },
     "icon_node": {
       "__id__": 50
     },
     "info_label": {
-      "__id__": 59
+      "__id__": 67
     },
     "_id": ""
   },
@@ -1486,7 +1658,6 @@
       "__id__": 0
     },
     "fileId": "c46/YsCPVOJYA4mWEpNYRx",
-    "instance": null,
+    "instance": null
-    "targetOverrides": null
   }
 ]

assets/script/game/map/SkillBoxComp.ts

@@ -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,7 +178,7 @@ 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 = "";
             }
@@ -304,6 +307,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,       // 标记为卡牌技能（区别于英雄自身技能）