2d血条

assets/module_storm_sunder/Prefabs/Buildings/detail_treeA.prefab

@@ -272,6 +272,7 @@
     "__prefab": {
       "__id__": 12
     },
+    "hp": 1,
     "_id": ""
   },
   {

assets/module_storm_sunder/Script/Component/PropComponent.ts

@@ -1,4 +1,5 @@
 import { _decorator, CCFloat, Component, Node, tween, Tween, Vec3 } from 'cc';
+import { Effect2DUIMgr } from '../Manager/Effect2DUIMgr';
 const { ccclass, property } = _decorator;
 
 export enum PropStatus {
@@ -11,22 +12,34 @@ export class PropComponent extends Component {
 
     @property({ type: CCFloat })
     hp: number = 1;
+
+    currentHp: number = 0;
     status: PropStatus = PropStatus.LIFE;
     speed: number = 50;
 
     start() {
         this.status = PropStatus.LIFE;
+        this.currentHp = this.hp;
     }
 
     //受伤
-    hurt(attack: number) {
+    async hurt(damage: number) {
         if (this.status == PropStatus.DIE) return;
 
-        this.hp -= attack;
-        console.log(`当前道具血量:${this.hp}`)
-        if (this.hp <= 0) {
-            this.hp = 0;
+        this.currentHp -= damage;
+        console.log(`当前道具血量:${this.currentHp}`);
+
+        if (this.currentHp > 0) {
+            const hpPercent = this.currentHp / this.hp;
+            // 显示或更新血条
+            await Effect2DUIMgr.Instance.showBlood(this.node, hpPercent);
+        }
+
+        //小于0时死亡
+        if (this.currentHp <= 0) {
+            this.currentHp = 0;
             this.status = PropStatus.DIE;
+            Effect2DUIMgr.Instance.removeBlood(this.node);
         }
     }
 

assets/module_storm_sunder/Script/Component/TornadoComponent.ts

@@ -67,7 +67,7 @@ export class TornadoComponent extends Component {
                 propComp.hurt(this.attack);
 
                 // 检查道具是否被摧毁
-                if (propComp.hp <= 0) {
+                if (propComp.currentHp <= 0) {
                     // 随机选择一个吸收点
                     const randomPoint = this.points[Math.floor(Math.random() * this.points.length)];
                     if (randomPoint) {

assets/module_storm_sunder/Script/Manager/Effect2DUIMgr.ts

@@ -1,7 +1,9 @@
 /** 2dUI 特效 血条 粒子等管理器*/
 
-import { assetManager, Prefab } from "cc";
+import { assetManager, instantiate, Prefab, Node, UITransform, Vec3 } from "cc";
 import { resLoader } from "db://assets/core_tgx/base/ResLoader";
+import { StormSunderGlobalInstance } from "../StormSunderGlobalInstance";
+import { BloodComponent } from "../Component/BloodComponent";
 
 export class Effect2DUIMgr {
     private static _instance: Effect2DUIMgr;
@@ -16,9 +18,40 @@ export class Effect2DUIMgr {
         return this.Instance;
     }
 
-    //添加血条到对应道具上方
-    async addBloodBarToProp() {
-        const blood = await resLoader.loadAsync(resLoader.gameBundleName, "Prefabs/Blood");
+    private bloodMap: Map<Node, Node> = new Map(); // 存储节点与对应血条的映射
+
+    async showBlood(target: Node, hpPercent: number) {
+        let bloodNode = this.bloodMap.get(target) as any;
+
+        if (!bloodNode) {
+            // 加载血条预制体
+            const bloodPrefab = await resLoader.loadAsync(resLoader.gameBundleName, "Prefabs/Blood");
+            bloodNode = instantiate(bloodPrefab);
+
+            // 添加到全局UI节点下
+            bloodNode.parent = StormSunderGlobalInstance.instance.bloodUI;
+
+            // 设置血条位置跟随目标
+            const worldPos = target.worldPosition.clone();
+            bloodNode.setWorldPosition(worldPos.x, worldPos.y + 100, worldPos.z);
+
+            this.bloodMap.set(target, bloodNode);
+        }
+
+        // 更新血量显示
+        const bloodComp = bloodNode.getComponent(BloodComponent);
+        if (bloodComp) {
+            bloodComp.updateHP(hpPercent);
+        }
+    }
+
+    // 清理血条
+    removeBlood(target: Node) {
+        const bloodNode = this.bloodMap.get(target);
+        if (bloodNode) {
+            bloodNode.destroy();
+            this.bloodMap.delete(target);
+        }
     }
 }