Feature/editor optimization (#251)
* refactor: 编辑器/运行时架构拆分与构建系统升级 * feat(core): 层级系统重构与UI变换矩阵修复 * refactor: 移除 ecs-components 聚合包并修复跨包组件查找问题 * fix(physics): 修复跨包组件类引用问题 * feat: 统一运行时架构与浏览器运行支持 * feat(asset): 实现浏览器运行时资产加载系统 * fix: 修复文档、CodeQL安全问题和CI类型检查错误 * fix: 修复文档、CodeQL安全问题和CI类型检查错误 * fix: 修复文档、CodeQL安全问题、CI类型检查和测试错误 * test: 补齐核心模块测试用例，修复CI构建配置 * fix: 修复测试用例中的类型错误和断言问题 * fix: 修复 turbo build:npm 任务的依赖顺序问题 * fix: 修复 CI 构建错误并优化构建性能
This commit is contained in:
YHH
GitHub
424
packages/physics-rapier2d-editor/src/Physics2DEditorModule.ts
Normal file
424
packages/physics-rapier2d-editor/src/Physics2DEditorModule.ts
Normal file
@@ -0,0 +1,424 @@
|
||||
/**
|
||||
* Physics 2D Editor Module
|
||||
* 2D 物理编辑器模块
|
||||
*/
|
||||
|
||||
import type { ServiceContainer, Entity } from '@esengine/ecs-framework';
|
||||
import { Core } from '@esengine/ecs-framework';
|
||||
import type {
|
||||
IEditorModuleLoader,
|
||||
EntityCreationTemplate,
|
||||
ComponentAction
|
||||
} from '@esengine/editor-core';
|
||||
import {
|
||||
EntityStoreService,
|
||||
MessageHub,
|
||||
ComponentRegistry,
|
||||
SettingsRegistry
|
||||
} from '@esengine/editor-core';
|
||||
import { TransformComponent } from '@esengine/engine-core';
|
||||
|
||||
// Import from @esengine/physics-rapier2d package
|
||||
import {
|
||||
DEFAULT_PHYSICS_CONFIG,
|
||||
Rigidbody2DComponent,
|
||||
BoxCollider2DComponent,
|
||||
CircleCollider2DComponent,
|
||||
CapsuleCollider2DComponent,
|
||||
PolygonCollider2DComponent
|
||||
} from '@esengine/physics-rapier2d';
|
||||
import { Physics2DSystem } from '@esengine/physics-rapier2d/runtime';
|
||||
|
||||
// Local editor imports
|
||||
import { registerPhysics2DGizmos } from './gizmos/Physics2DGizmo';
|
||||
import { CollisionMatrixEditor } from './components/CollisionMatrixEditor';
|
||||
|
||||
/**
|
||||
* Physics 2D Editor Module
|
||||
* 2D 物理编辑器模块
|
||||
*/
|
||||
export class Physics2DEditorModule implements IEditorModuleLoader {
|
||||
private settingsListener: ((event: Event) => void) | null = null;
|
||||
|
||||
async install(services: ServiceContainer): Promise<void> {
|
||||
// 注册物理设置到设置面板
|
||||
this.registerPhysicsSettings(services);
|
||||
|
||||
// 监听设置变更
|
||||
this.setupSettingsListener();
|
||||
|
||||
// 注册组件到编辑器组件注册表
|
||||
const componentRegistry = services.resolve(ComponentRegistry);
|
||||
if (componentRegistry) {
|
||||
componentRegistry.register({
|
||||
name: 'Rigidbody2D',
|
||||
type: Rigidbody2DComponent,
|
||||
category: 'components.category.physics',
|
||||
description: '2D rigidbody for physics simulation',
|
||||
icon: 'Box'
|
||||
});
|
||||
|
||||
componentRegistry.register({
|
||||
name: 'BoxCollider2D',
|
||||
type: BoxCollider2DComponent,
|
||||
category: 'components.category.physics',
|
||||
description: '2D box collider shape',
|
||||
icon: 'Square'
|
||||
});
|
||||
|
||||
componentRegistry.register({
|
||||
name: 'CircleCollider2D',
|
||||
type: CircleCollider2DComponent,
|
||||
category: 'components.category.physics',
|
||||
description: '2D circle collider shape',
|
||||
icon: 'Circle'
|
||||
});
|
||||
|
||||
componentRegistry.register({
|
||||
name: 'CapsuleCollider2D',
|
||||
type: CapsuleCollider2DComponent,
|
||||
category: 'components.category.physics',
|
||||
description: '2D capsule collider shape',
|
||||
icon: 'Pill'
|
||||
});
|
||||
|
||||
componentRegistry.register({
|
||||
name: 'PolygonCollider2D',
|
||||
type: PolygonCollider2DComponent,
|
||||
category: 'components.category.physics',
|
||||
description: '2D polygon collider shape',
|
||||
icon: 'Pentagon'
|
||||
});
|
||||
}
|
||||
|
||||
// 注册 Physics Gizmos
|
||||
registerPhysics2DGizmos();
|
||||
}
|
||||
|
||||
async uninstall(): Promise<void> {
|
||||
// 移除设置监听器
|
||||
if (this.settingsListener) {
|
||||
window.removeEventListener('settings:changed', this.settingsListener);
|
||||
this.settingsListener = null;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置变更监听器
|
||||
*/
|
||||
private setupSettingsListener(): void {
|
||||
this.settingsListener = ((event: CustomEvent) => {
|
||||
const changedSettings = event.detail;
|
||||
|
||||
// 检查是否有物理相关设置变更
|
||||
const physicsKeys = Object.keys(changedSettings).filter(k => k.startsWith('physics.'));
|
||||
if (physicsKeys.length === 0) return;
|
||||
|
||||
this.applyPhysicsSettings(changedSettings);
|
||||
}) as EventListener;
|
||||
|
||||
window.addEventListener('settings:changed', this.settingsListener);
|
||||
}
|
||||
|
||||
/**
|
||||
* 应用物理设置到物理系统
|
||||
*/
|
||||
private applyPhysicsSettings(settings: Record<string, unknown>): void {
|
||||
const scene = Core.scene;
|
||||
if (!scene) return;
|
||||
|
||||
const physicsSystem = scene.getSystem(Physics2DSystem);
|
||||
if (!physicsSystem) return;
|
||||
|
||||
const world = physicsSystem.world;
|
||||
if (!world) return;
|
||||
|
||||
// 构建配置对象
|
||||
const gravityX = settings['physics.gravity.x'] as number | undefined;
|
||||
const gravityY = settings['physics.gravity.y'] as number | undefined;
|
||||
|
||||
if (gravityX !== undefined || gravityY !== undefined) {
|
||||
const currentGravity = world.getGravity();
|
||||
world.updateConfig({
|
||||
gravity: {
|
||||
x: gravityX ?? currentGravity.x,
|
||||
y: gravityY ?? currentGravity.y
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (settings['physics.timestep'] !== undefined) {
|
||||
world.updateConfig({ timestep: settings['physics.timestep'] as number });
|
||||
}
|
||||
|
||||
if (settings['physics.maxSubsteps'] !== undefined) {
|
||||
world.updateConfig({ maxSubsteps: settings['physics.maxSubsteps'] as number });
|
||||
}
|
||||
|
||||
if (settings['physics.velocityIterations'] !== undefined) {
|
||||
world.updateConfig({ velocityIterations: settings['physics.velocityIterations'] as number });
|
||||
}
|
||||
|
||||
if (settings['physics.positionIterations'] !== undefined) {
|
||||
world.updateConfig({ positionIterations: settings['physics.positionIterations'] as number });
|
||||
}
|
||||
|
||||
if (settings['physics.allowSleep'] !== undefined) {
|
||||
world.updateConfig({ allowSleep: settings['physics.allowSleep'] as boolean });
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 注册物理设置到设置面板
|
||||
*/
|
||||
private registerPhysicsSettings(services: ServiceContainer): void {
|
||||
const settingsRegistry = services.tryResolve(SettingsRegistry);
|
||||
if (!settingsRegistry) {
|
||||
return;
|
||||
}
|
||||
|
||||
settingsRegistry.registerCategory({
|
||||
id: 'physics',
|
||||
title: '物理',
|
||||
description: '2D 物理引擎配置',
|
||||
sections: [
|
||||
{
|
||||
id: 'physics-world',
|
||||
title: '物理世界',
|
||||
description: '配置物理世界的基础参数',
|
||||
settings: [
|
||||
{
|
||||
key: 'physics.gravity.x',
|
||||
label: '重力 X',
|
||||
type: 'number',
|
||||
defaultValue: DEFAULT_PHYSICS_CONFIG.gravity.x,
|
||||
description: '水平方向重力（通常为 0）',
|
||||
step: 0.1
|
||||
},
|
||||
{
|
||||
key: 'physics.gravity.y',
|
||||
label: '重力 Y',
|
||||
type: 'number',
|
||||
defaultValue: DEFAULT_PHYSICS_CONFIG.gravity.y,
|
||||
description: '垂直方向重力（负值向下）',
|
||||
step: 0.1
|
||||
},
|
||||
{
|
||||
key: 'physics.timestep',
|
||||
label: '时间步长',
|
||||
type: 'number',
|
||||
defaultValue: DEFAULT_PHYSICS_CONFIG.timestep,
|
||||
description: '固定物理更新时间步长（秒）',
|
||||
min: 0.001,
|
||||
max: 0.1,
|
||||
step: 0.001
|
||||
},
|
||||
{
|
||||
key: 'physics.maxSubsteps',
|
||||
label: '最大子步数',
|
||||
type: 'number',
|
||||
defaultValue: DEFAULT_PHYSICS_CONFIG.maxSubsteps,
|
||||
description: '每帧最大物理子步数',
|
||||
min: 1,
|
||||
max: 32,
|
||||
step: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 'physics-solver',
|
||||
title: '求解器',
|
||||
description: '配置物理求解器参数',
|
||||
settings: [
|
||||
{
|
||||
key: 'physics.velocityIterations',
|
||||
label: '速度迭代次数',
|
||||
type: 'number',
|
||||
defaultValue: DEFAULT_PHYSICS_CONFIG.velocityIterations,
|
||||
description: '速度求解器迭代次数，越高越精确但性能开销越大',
|
||||
min: 1,
|
||||
max: 16,
|
||||
step: 1
|
||||
},
|
||||
{
|
||||
key: 'physics.positionIterations',
|
||||
label: '位置迭代次数',
|
||||
type: 'number',
|
||||
defaultValue: DEFAULT_PHYSICS_CONFIG.positionIterations,
|
||||
description: '位置求解器迭代次数，越高越精确但性能开销越大',
|
||||
min: 1,
|
||||
max: 16,
|
||||
step: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 'physics-behavior',
|
||||
title: '行为',
|
||||
description: '配置物理行为',
|
||||
settings: [
|
||||
{
|
||||
key: 'physics.allowSleep',
|
||||
label: '允许休眠',
|
||||
type: 'boolean',
|
||||
defaultValue: DEFAULT_PHYSICS_CONFIG.allowSleep,
|
||||
description: '允许静止的刚体进入休眠状态以提高性能'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 'physics-collision',
|
||||
title: '碰撞层',
|
||||
description: '配置碰撞层和碰撞矩阵',
|
||||
settings: [
|
||||
{
|
||||
key: 'physics.collisionMatrix',
|
||||
label: '碰撞矩阵',
|
||||
type: 'collisionMatrix',
|
||||
defaultValue: null,
|
||||
description: '配置哪些层之间可以发生碰撞',
|
||||
customRenderer: CollisionMatrixEditor
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
});
|
||||
}
|
||||
|
||||
getInspectorProviders() {
|
||||
// 使用 @Property 装饰器自动生成检视器，不再需要自定义
|
||||
return [];
|
||||
}
|
||||
|
||||
getEntityCreationTemplates(): EntityCreationTemplate[] {
|
||||
const createPhysicsEntity = (
|
||||
name: string,
|
||||
colliderType: 'box' | 'circle' | 'capsule',
|
||||
isStatic: boolean = false
|
||||
): number => {
|
||||
const scene = Core.scene;
|
||||
if (!scene) {
|
||||
throw new Error('Scene not available');
|
||||
}
|
||||
|
||||
const entityStore = Core.services.resolve(EntityStoreService);
|
||||
const messageHub = Core.services.resolve(MessageHub);
|
||||
|
||||
if (!entityStore || !messageHub) {
|
||||
throw new Error('EntityStoreService or MessageHub not available');
|
||||
}
|
||||
|
||||
const count = entityStore.getAllEntities()
|
||||
.filter((e: Entity) => e.name.startsWith(name)).length;
|
||||
const entityName = `${name} ${count + 1}`;
|
||||
|
||||
const entity = scene.createEntity(entityName);
|
||||
entity.addComponent(new TransformComponent());
|
||||
|
||||
const rb = new Rigidbody2DComponent();
|
||||
if (isStatic) {
|
||||
rb.bodyType = 2; // Static
|
||||
}
|
||||
entity.addComponent(rb);
|
||||
|
||||
switch (colliderType) {
|
||||
case 'box':
|
||||
entity.addComponent(new BoxCollider2DComponent());
|
||||
break;
|
||||
case 'circle':
|
||||
entity.addComponent(new CircleCollider2DComponent());
|
||||
break;
|
||||
case 'capsule':
|
||||
entity.addComponent(new CapsuleCollider2DComponent());
|
||||
break;
|
||||
}
|
||||
|
||||
entityStore.addEntity(entity);
|
||||
messageHub.publish('entity:added', { entity });
|
||||
messageHub.publish('scene:modified', {});
|
||||
entityStore.selectEntity(entity);
|
||||
|
||||
return entity.id;
|
||||
};
|
||||
|
||||
return [
|
||||
{
|
||||
id: 'create-physics-box',
|
||||
label: '物理方块',
|
||||
icon: 'Square',
|
||||
category: 'physics',
|
||||
order: 100,
|
||||
create: () => createPhysicsEntity('PhysicsBox', 'box')
|
||||
},
|
||||
{
|
||||
id: 'create-physics-circle',
|
||||
label: '物理圆球',
|
||||
icon: 'Circle',
|
||||
category: 'physics',
|
||||
order: 101,
|
||||
create: () => createPhysicsEntity('PhysicsBall', 'circle')
|
||||
},
|
||||
{
|
||||
id: 'create-physics-capsule',
|
||||
label: '物理胶囊',
|
||||
icon: 'Pill',
|
||||
category: 'physics',
|
||||
order: 102,
|
||||
create: () => createPhysicsEntity('PhysicsCapsule', 'capsule')
|
||||
},
|
||||
{
|
||||
id: 'create-static-platform',
|
||||
label: '静态平台',
|
||||
icon: 'Minus',
|
||||
category: 'physics',
|
||||
order: 110,
|
||||
create: () => createPhysicsEntity('Platform', 'box', true)
|
||||
},
|
||||
{
|
||||
id: 'create-static-ground',
|
||||
label: '地面',
|
||||
icon: 'AlignVerticalJustifyEnd',
|
||||
category: 'physics',
|
||||
order: 111,
|
||||
create: (): number => {
|
||||
const scene = Core.scene;
|
||||
if (!scene) {
|
||||
throw new Error('Scene not available');
|
||||
}
|
||||
|
||||
const entityStore = Core.services.resolve(EntityStoreService);
|
||||
const messageHub = Core.services.resolve(MessageHub);
|
||||
|
||||
if (!entityStore || !messageHub) {
|
||||
throw new Error('EntityStoreService or MessageHub not available');
|
||||
}
|
||||
|
||||
const entity = scene.createEntity('Ground');
|
||||
entity.addComponent(new TransformComponent());
|
||||
|
||||
const rb = new Rigidbody2DComponent();
|
||||
rb.bodyType = 2; // Static
|
||||
entity.addComponent(rb);
|
||||
|
||||
const collider = new BoxCollider2DComponent();
|
||||
collider.width = 200;
|
||||
collider.height = 10;
|
||||
entity.addComponent(collider);
|
||||
|
||||
entityStore.addEntity(entity);
|
||||
messageHub.publish('entity:added', { entity });
|
||||
messageHub.publish('scene:modified', {});
|
||||
entityStore.selectEntity(entity);
|
||||
|
||||
return entity.id;
|
||||
}
|
||||
}
|
||||
];
|
||||
}
|
||||
|
||||
getComponentActions(): ComponentAction[] {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
export const physics2DEditorModule = new Physics2DEditorModule();
|
||||
Reference in New Issue
Block a user