Files
esengine/packages/components/src/CameraComponent.ts
YHH a3f7cc38b1 Feature/render pipeline (#232)
* refactor(engine): 重构2D渲染管线坐标系统

* feat(engine): 完善2D渲染管线和编辑器视口功能

* feat(editor): 实现Viewport变换工具系统

* feat(editor): 优化Inspector渲染性能并修复Gizmo变换工具显示

* feat(editor): 实现Run on Device移动预览功能

* feat(editor): 添加组件属性控制和依赖关系系统

* feat(editor): 实现动画预览功能和优化SpriteAnimator编辑器

* feat(editor): 修复SpriteAnimator动画预览功能并迁移CI到pnpm

* feat(editor): 修复SpriteAnimator动画预览并迁移到pnpm

* feat(editor): 修复SpriteAnimator动画预览并迁移到pnpm

* feat(editor): 修复SpriteAnimator动画预览并迁移到pnpm

* feat(editor): 修复SpriteAnimator动画预览并迁移到pnpm

* feat(ci): 迁移项目到pnpm并修复CI构建问题

* chore: 迁移CI工作流到pnpm并添加WASM构建支持

* chore: 迁移CI工作流到pnpm并添加WASM构建支持

* chore: 迁移CI工作流到pnpm并添加WASM构建支持

* chore: 迁移CI工作流到pnpm并添加WASM构建支持

* chore: 迁移CI工作流到pnpm并添加WASM构建支持

* chore: 迁移CI工作流到pnpm并添加WASM构建支持

* chore: 移除 network 相关包

* chore: 移除 network 相关包
2025-11-23 14:49:37 +08:00

83 lines
2.3 KiB
TypeScript

import { Component, ECSComponent, Serializable, Serialize, Property } from '@esengine/ecs-framework';
/**
* 相机投影类型
*/
export enum CameraProjection {
Perspective = 'perspective',
Orthographic = 'orthographic'
}
/**
* 相机组件 - 管理视图和投影
*/
@ECSComponent('Camera')
@Serializable({ version: 1, typeId: 'Camera' })
export class CameraComponent extends Component {
/** 投影类型 */
@Serialize()
@Property({
type: 'enum',
label: 'Projection',
options: [
{ label: 'Orthographic', value: CameraProjection.Orthographic },
{ label: 'Perspective', value: CameraProjection.Perspective }
]
})
public projection: CameraProjection = CameraProjection.Orthographic;
/** 视野角度(透视模式) */
@Serialize()
@Property({ type: 'number', label: 'Field of View', min: 1, max: 179 })
public fieldOfView: number = 60;
/** 正交尺寸(正交模式) */
@Serialize()
@Property({ type: 'number', label: 'Orthographic Size', min: 0.1, step: 0.1 })
public orthographicSize: number = 5;
/** 近裁剪面 */
@Serialize()
@Property({ type: 'number', label: 'Near Clip', min: 0.01, step: 0.1 })
public nearClipPlane: number = 0.1;
/** 远裁剪面 */
@Serialize()
@Property({ type: 'number', label: 'Far Clip', min: 1, step: 10 })
public farClipPlane: number = 1000;
/** 视口X */
@Serialize()
@Property({ type: 'number', label: 'Viewport X', min: 0, max: 1, step: 0.01 })
public viewportX: number = 0;
/** 视口Y */
@Serialize()
@Property({ type: 'number', label: 'Viewport Y', min: 0, max: 1, step: 0.01 })
public viewportY: number = 0;
/** 视口宽度 */
@Serialize()
@Property({ type: 'number', label: 'Viewport Width', min: 0, max: 1, step: 0.01 })
public viewportWidth: number = 1;
/** 视口高度 */
@Serialize()
@Property({ type: 'number', label: 'Viewport Height', min: 0, max: 1, step: 0.01 })
public viewportHeight: number = 1;
/** 渲染优先级 */
@Serialize()
@Property({ type: 'integer', label: 'Depth' })
public depth: number = 0;
/** 背景颜色 */
@Serialize()
@Property({ type: 'color', label: 'Background Color' })
public backgroundColor: string = '#000000';
constructor() {
super();
}
}