feat(渲染): 实现基于线路和生成顺序的层级管理系统
添加IndexSet枚举定义基础层级和增量 修改怪物生成逻辑以支持线路(lane)和生成顺序(spawnOrder) 重构MonMoveSystem中的渲染层级更新逻辑 优化HeroViewComp中血条显示逻辑 调整怪物位置配置以支持双线路布局
This commit is contained in:
@@ -2,7 +2,7 @@ import { ecs } from "../../../../extensions/oops-plugin-framework/assets/libs/ec
|
||||
import { HeroViewComp } from "./HeroViewComp";
|
||||
import { HeroAttrsComp } from "./HeroAttrsComp";
|
||||
import { smc } from "../common/SingletonModuleComp";
|
||||
import { FacSet } from "../common/config/GameSet";
|
||||
import { FacSet, IndexSet } from "../common/config/GameSet";
|
||||
import { Attrs } from "../common/config/HeroAttrs";
|
||||
|
||||
/** 怪物移动组件 */
|
||||
@@ -14,11 +14,17 @@ export class MonMoveComp extends ecs.Comp {
|
||||
targetX: number = 0;
|
||||
/** 是否处于移动状态 */
|
||||
moving: boolean = true;
|
||||
/** 线路标识:0=一线(y=120),1=二线(y=80) */
|
||||
lane: number = 0;
|
||||
/** 生成顺序:用于同线路内的层级排序,数值越大越晚生成,层级越前 */
|
||||
spawnOrder: number = 0;
|
||||
|
||||
reset() {
|
||||
this.direction = 1;
|
||||
this.targetX = 0;
|
||||
this.moving = true;
|
||||
this.lane = 0;
|
||||
this.spawnOrder = 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -134,31 +140,55 @@ export class MonMoveSystem extends ecs.ComblockSystem implements ecs.ISystemUpda
|
||||
|
||||
/** 更新渲染层级 */
|
||||
private updateRenderOrder(entity: ecs.Entity) {
|
||||
const currentView = entity.get(HeroViewComp);
|
||||
const currentModel = entity.get(HeroAttrsComp);
|
||||
|
||||
// 查找所有怪物单位
|
||||
const allUnits = ecs.query(ecs.allOf(HeroAttrsComp, HeroViewComp))
|
||||
.filter(e => {
|
||||
const otherModel = e.get(HeroAttrsComp);
|
||||
return otherModel.fac === currentModel.fac; // 按阵营分组
|
||||
})
|
||||
.map(e => e);
|
||||
// 直接调用全局更新方法,避免重复计算
|
||||
this.updateAllUnitsRenderOrder();
|
||||
}
|
||||
|
||||
// 按x坐标排序:x坐标越大(越前面)的显示在上层
|
||||
const sortedUnits = allUnits.sort((a, b) => {
|
||||
const viewA = a.get(HeroViewComp);
|
||||
const viewB = b.get(HeroViewComp);
|
||||
if (!viewA || !viewA.node || !viewB || !viewB.node) return 0;
|
||||
const posA = viewA.node.position.x;
|
||||
const posB = viewB.node.position.x;
|
||||
return posA - posB; // x坐标从小到大排序
|
||||
/** 更新所有单位的渲染层级 */
|
||||
private updateAllUnitsRenderOrder() {
|
||||
// 获取所有单位
|
||||
const allUnits = ecs.query(ecs.allOf(HeroAttrsComp, HeroViewComp));
|
||||
|
||||
// 创建单位数组,包含层级信息
|
||||
const unitsWithOrder: Array<{
|
||||
entity: ecs.Entity,
|
||||
view: HeroViewComp,
|
||||
order: number
|
||||
}> = [];
|
||||
|
||||
allUnits.forEach(e => {
|
||||
const model = e.get(HeroAttrsComp);
|
||||
const view = e.get(HeroViewComp);
|
||||
|
||||
if (!view || !view.node || !model) return;
|
||||
|
||||
let order = 0;
|
||||
|
||||
if (model.fac === FacSet.HERO) {
|
||||
// 英雄层级:基础层级 + y轴位置影响
|
||||
order = IndexSet.HERO + Math.floor(view.node.position.y);
|
||||
} else if (model.fac === FacSet.MON) {
|
||||
const move = e.get(MonMoveComp);
|
||||
if (move) {
|
||||
// 怪物层级:基于线路和生成顺序
|
||||
const baseLane = move.lane === 0 ? IndexSet.MON1 : IndexSet.MON2;
|
||||
order = baseLane + (move.spawnOrder * IndexSet.MON_INCREMENT);
|
||||
}
|
||||
}
|
||||
|
||||
unitsWithOrder.push({
|
||||
entity: e,
|
||||
view: view,
|
||||
order: order
|
||||
});
|
||||
});
|
||||
|
||||
// 设置渲染顺序:x坐标越大的显示在上层(index越大,层级越高)
|
||||
sortedUnits.forEach((unit, index) => {
|
||||
const model = unit.get(HeroViewComp);
|
||||
model.node.setSiblingIndex(index); // 直接使用index,x坐标大的index大,层级高
|
||||
// 按层级排序:order值小的在后面(siblingIndex小),order值大的在前面(siblingIndex大)
|
||||
unitsWithOrder.sort((a, b) => a.order - b.order);
|
||||
|
||||
// 设置 siblingIndex
|
||||
unitsWithOrder.forEach((unit, index) => {
|
||||
unit.view.node.setSiblingIndex(index);
|
||||
});
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user