feat(ui): 调整英雄信息面板布局和排序逻辑

- 将英雄信息面板从垂直排列改为水平排列,增加间距
- 实现按英雄位置、生成顺序和实体ID的排序逻辑
- 调整相关UI元素的锚点、位置和组件状态
- 更新预制体引用和布局参数以支持新的排列方式
This commit is contained in:
panw
2026-03-31 16:00:28 +08:00
parent 9bd50d5a77
commit 1437a7ee40
3 changed files with 307 additions and 173 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -1290,7 +1290,7 @@
}, },
"_lpos": { "_lpos": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": 0, "x": -350,
"y": 93.364, "y": 93.364,
"z": 0 "z": 0
}, },
@@ -1345,7 +1345,7 @@
}, },
{ {
"__type__": "cc.PrefabInstance", "__type__": "cc.PrefabInstance",
"fileId": "98sPdmBuhC94DR6vInBaLY", "fileId": "b5euhUHTJKy51uYq8GiAyM",
"prefabRootNode": { "prefabRootNode": {
"__id__": 1 "__id__": 1
}, },
@@ -1393,7 +1393,7 @@
], ],
"value": { "value": {
"__type__": "cc.Vec3", "__type__": "cc.Vec3",
"x": -290, "x": 0,
"y": 0, "y": 0,
"z": 0 "z": 0
} }
@@ -1448,7 +1448,7 @@
}, },
"_anchorPoint": { "_anchorPoint": {
"__type__": "cc.Vec2", "__type__": "cc.Vec2",
"x": 0.5, "x": 0,
"y": 0.5 "y": 0.5
}, },
"_id": "" "_id": ""
@@ -1501,7 +1501,7 @@
"node": { "node": {
"__id__": 49 "__id__": 49
}, },
"_enabled": true, "_enabled": false,
"__prefab": { "__prefab": {
"__id__": 63 "__id__": 63
}, },

View File

@@ -12,6 +12,7 @@ import { smc } from "../common/SingletonModuleComp";
import { HeroInfo, HType } from "../common/config/heroSet"; import { HeroInfo, HType } from "../common/config/heroSet";
import { HeroViewComp } from "../hero/HeroViewComp"; import { HeroViewComp } from "../hero/HeroViewComp";
import { FacSet } from "../common/config/GameSet"; import { FacSet } from "../common/config/GameSet";
import { MoveComp } from "../hero/MoveComp";
const { ccclass, property } = _decorator; const { ccclass, property } = _decorator;
@@ -60,7 +61,8 @@ export class MissionCardComp extends CCComp {
private cardComps: CardComp[] = []; private cardComps: CardComp[] = [];
/** 当前卡池等级(仅影响抽卡来源,不直接改卡槽现有内容) */ /** 当前卡池等级(仅影响抽卡来源,不直接改卡槽现有内容) */
private poolLv: number = CARD_POOL_INIT_LEVEL; private poolLv: number = CARD_POOL_INIT_LEVEL;
private readonly heroInfoItemGap: number = 86; private readonly heroInfoItemGap: number = 110;
private readonly heroInfoItemSpacing: number = 10;
private heroInfoSyncTimer: number = 0; private heroInfoSyncTimer: number = 0;
private hasCachedCardsBaseScale: boolean = false; private hasCachedCardsBaseScale: boolean = false;
private cardsBaseScale: Vec3 = new Vec3(1, 1, 1); private cardsBaseScale: Vec3 = new Vec3(1, 1, 1);
@@ -613,9 +615,7 @@ export class MissionCardComp extends CCComp {
for (let i = 0; i < removeKeys.length; i++) { for (let i = 0; i < removeKeys.length; i++) {
this.heroInfoItems.delete(removeKeys[i]); this.heroInfoItems.delete(removeKeys[i]);
} }
if (removeKeys.length > 0) { this.relayoutHeroInfoPanels();
this.relayoutHeroInfoPanels();
}
this.updateHeroNumUI(false, false); this.updateHeroNumUI(false, false);
} }
@@ -628,13 +628,30 @@ export class MissionCardComp extends CCComp {
} }
private relayoutHeroInfoPanels() { private relayoutHeroInfoPanels() {
let index = 0; const sortedItems = [...this.heroInfoItems.values()].sort((a, b) => {
this.heroInfoItems.forEach(item => { const aEnt = (a.model as any)?.ent as ecs.Entity | undefined;
if (!item.node || !item.node.isValid) return; const bEnt = (b.model as any)?.ent as ecs.Entity | undefined;
const pos = item.node.position; const aView = aEnt?.get(HeroViewComp);
item.node.setPosition(pos.x, -index * this.heroInfoItemGap, pos.z); const bView = bEnt?.get(HeroViewComp);
index += 1; const aMove = aEnt?.get(MoveComp);
const bMove = bEnt?.get(MoveComp);
const aFrontScore = aView?.node?.position?.x ?? -999999;
const bFrontScore = bView?.node?.position?.x ?? -999999;
if (aFrontScore !== bFrontScore) return aFrontScore - bFrontScore;
const aSpawnOrder = aMove?.spawnOrder ?? 0;
const bSpawnOrder = bMove?.spawnOrder ?? 0;
if (aSpawnOrder !== bSpawnOrder) return aSpawnOrder - bSpawnOrder;
const aEid = aEnt?.eid ?? 0;
const bEid = bEnt?.eid ?? 0;
return aEid - bEid;
}); });
for (let index = 0; index < sortedItems.length; index++) {
const item = sortedItems[index];
if (!item.node || !item.node.isValid) continue;
const pos = item.node.position;
item.node.setPosition(index * (this.heroInfoItemGap + this.heroInfoItemSpacing), pos.y, pos.z);
item.node.setSiblingIndex(index);
}
} }
private clearHeroInfoPanels() { private clearHeroInfoPanels() {