UNPKG

@turbox3d/renderer-core

Version:

Large-scale declarative graphic ui core renderer

269 lines (268 loc) 10.3 kB
import { CoordinateController, InteractiveConfig, InteractiveController, InteractiveType, SceneEvent, ViewEntity } from '@turbox3d/event-manager'; import { Vec2, Vec3 } from '@turbox3d/shared'; import { SceneTool, CommandManager } from '@turbox3d/command-manager'; import { Component, ComponentProps } from './component'; declare global { interface Window { $$turbox_hot: boolean; } } interface IInteractiveControllerInfo<Container, DisplayObject, Renderer> { [id: string]: InteractiveController<Container, DisplayObject, Renderer>; } interface ICanvasInfo<Renderer> { height: number; width: number; renderer: Renderer; } export interface ViewportInfo { x: number; y: number; width: number; height: number; visible: boolean; resolution?: number; } export declare enum SceneType { Scene2D = "2d", Scene3D = "3d" } export interface BaseSceneProps { /** * 用以标示当前场景的 ID * 当多个不同 id 的场景关联到同一容器中时,可用于区分场景和隔离交互控制器 */ id: string; /** * 用以标示当前场景的类型 */ type?: symbol; /** * 画布容器标识 * 多个不同 id 的场景可关联同一个容器/渲染器上下文 */ container: string; /** * 画布背景色,使用十六进制。默认:0xffffff */ backgroundColor?: number; /** * 画布背景图,优先级高于背景色 */ backgroundImage?: string; /** * 画布背景透明度。默认:1 */ backgroundAlpha?: number; /** * 画布是否可缩放。默认:true */ scalable?: boolean; /** * 画布是否可拖拽。默认:true */ draggable?: boolean; /** * 点击场景未选中任何目标的回调 */ onClickNothing?: (event: SceneEvent) => void; /** * 处理本场景的 commandMgr */ commandMgr?: CommandManager; /** 相机的初始位置 */ cameraPosition?: Vec3 | Vec2; /** 坐标系类型 */ coordinateType?: 'top' | 'front' | 'left'; /** resizeTo 适配的 dom id 或元素引用 */ resizeTo?: string | Window; /** 分辨率 */ resolution?: number; /** 保留绘制缓存数据,用来截图 */ preserveDrawingBuffer?: boolean; /** 颜色输出模式 renderer.outputColorSpace */ outputColorSpace?: string; /** 最大帧率限制 */ maxFPS?: number; /** 禁用 resize */ disableResize?: boolean; /** 渲染标志(用来打开或关闭渲染 ticker,若为 false,则当前帧不渲染) */ renderFlag?: boolean; /** 场景初始化完成的回调 */ initialized?: (sceneTool: SceneTool) => void; /** 场景缩放系数限制([0.1, 2]) */ zoomRange?: number[]; } export interface ViewInfo { position: Vec2 | Vec3; scale: Vec2 | Vec3; visible: boolean; width?: number; height?: number; } export interface SceneContext { getCommandManager: () => CommandManager | undefined; getSceneTools: () => SceneTool; } export declare abstract class BaseScene<ApplicationContext, Renderer, Scene, Camera, Raycaster, Container, DisplayObject, Viewport> extends Component<BaseSceneProps> { /** 默认背景色 */ static BACKGROUND_COLOR: number; /** 默认背景透明度 */ static BACKGROUND_ALPHA: number; /** 默认画布宽度 */ static DEFAULT_WIDTH: number; /** 默认画布高度 */ static DEFAULT_HEIGHT: number; static SCALE_BIGGER: number; static SCALE_SMALLER: number; /** 挂载点与应用上下文的映射关系 */ static appMap: Map<string, any>; /** 应用上下文与不同视角交互控制器的映射关系 */ static interactiveMap: Map<any, IInteractiveControllerInfo<any, any, any>>; /** 应用上下文是否已经挂载的状态 */ static appMountedStatus: Map<string, boolean>; /** 模型实际容器 */ view: Container; /** 默认的场景视图类型标识 */ abstract defaultSceneViewType: symbol; /** 模型视口容器(有多视图的时候才有) */ viewport?: Viewport; /** 场景类型,标识是 2d 还是 3d 场景 */ abstract sceneType: SceneType; /** 场景实例,仅 3d 下有 */ scene?: Scene; /** 相机实例,仅 3d 下有 */ camera?: Camera; /** 射线实例,仅 3d 下有 */ raycaster?: Raycaster; tickers: Array<(deltaTime: number) => void>; width: number; height: number; coordinate: CoordinateController; mountTimer: number; sceneContext: SceneContext; resolution: number; backgroundImage: DisplayObject; maxFPS: number; renderFlag: boolean; constructor(props: Exclude<ComponentProps<BaseSceneProps>, ViewEntity>); componentDidMount(): void; componentDidUpdate(): void; /** * 卸载画布的钩子(主要做一些清理回收工作,浏览器环境下无需另外实现) */ abstract unmountCanvas(): void; componentWillUnmount(): void; /** 移除应用子视图 */ abstract removeAppChildrenView(app: ApplicationContext): void; /** 销毁 gl app 及相关清理工作的实现 */ abstract destroyApp(app: ApplicationContext): void; /** 创建 gl app instance,并返回 */ abstract createApp(): ApplicationContext; /** 创建根视图,给 view 设值 */ abstract createView(): Container; /** 获取根视图的基本信息(position、scale、visible) */ abstract getViewInfo(): ViewInfo; /** 添加子视图的接口 */ abstract addChildView(view: DisplayObject): void; /** 关闭渲染器的默认交互 */ abstract destroyRendererInteraction(app: ApplicationContext): void; abstract getCanvasView(app: ApplicationContext): ICanvasInfo<Renderer>; /** 获取 hitTarget 的原始实现方法 */ abstract getHitTargetOriginal(): (point: Vec2, container: Container, configMap: Map<DisplayObject, InteractiveConfig>, interactiveType: InteractiveType) => { /** event 的直接对象 */ originalTarget?: DisplayObject; /** originalTarget 或 originalTarget 的祖先中的第一个可被交互的元素 */ target?: DisplayObject; /** 选中对象的具体场景鼠标位置 */ originalTargetPoint?: Vec2 | Vec3; }; /** 更新分辨率 */ abstract updateResolution(app: ApplicationContext): void; private initInteractiveController; /** 更新渲染状态 */ private updateRenderFlag; private getCoordinateCtrl; private getViewEntity; getCurrentInteractiveController: () => InteractiveController<any, any, any> | undefined; getCurrentApp: () => ApplicationContext | undefined; private updateCursorHandler; abstract updateCursor(app: ApplicationContext, cursor: string): void; private getSceneTools; /** * 坐标转化 */ private coordinateTransform; /** * 将渲染器/画布挂载到视图布局上(浏览器环境下无需另外实现) */ abstract mountCanvas(renderer: Renderer): void; private loadCanvas; private updateCameraInfo; /** 更新相机位置 */ abstract updateCameraPosition(position: Vec3): void; private resizeHandler; /** 初始化坐标系控制系统 */ abstract createCoordinateController(app: ApplicationContext): CoordinateController; private resizeStageByCanvas; /** 初始化天空盒 */ abstract initSkyBox(app: ApplicationContext): void; /** * resize 场景大小 */ abstract resizeStage(app: ApplicationContext): void; /** 设置背景图 */ abstract setBackGroundImage(app: ApplicationContext): void; /** * 计算2d原始视图的缩放和位置 */ private compute2dOriginView; /** 计算视口的缩放和位置、可见性 */ private computeViewport; /** resize 视口 */ abstract resizeViewport(app: ApplicationContext): void; /** 设置根视图的位置 */ abstract setViewPosition(position: Partial<Vec3>): void; /** 设置根视图的缩放 */ abstract setViewScale(scale: Partial<Vec3>): void; /** 设置根视图是否可见 */ abstract setViewVisible(visible: boolean): void; /** 添加根视图容器到 app stage 的实现 */ abstract addRootViewContainer(app: ApplicationContext): void; onClick: (event: SceneEvent) => void; onDBClick: (event: SceneEvent) => void; onRightClick: (event: SceneEvent) => void; onDragStart: (event: SceneEvent) => void; onDragMove: (event: SceneEvent) => void; onDragEnd: (event: SceneEvent) => void; onPinchStart: (event: SceneEvent) => void; onPinch: (event: SceneEvent) => void; onPinchEnd: (event: SceneEvent) => void; onRotateStart: (event: SceneEvent) => void; onRotate: (event: SceneEvent) => void; onRotateEnd: (event: SceneEvent) => void; onPress: (event: SceneEvent) => void; onPressUp: (event: SceneEvent) => void; onPointerMove: (event: SceneEvent) => void; onPointerUp: (event: SceneEvent) => void; onWheel: (event: SceneEvent) => void; /** 画布拖拽功能的实现,注意:如果已经引入其他交互插件则无需重复实现,避免实现上的冲突 */ abstract canvasDragImpl(event: SceneEvent, type: 'start' | 'move' | 'end'): void; /** 画布缩放功能的实现,注意:如果已经引入其他交互插件则无需重复实现,避免实现上的冲突 */ abstract canvasScaleImpl(event: SceneEvent): void; /** 获取视口的实现 */ abstract getViewport(): Viewport | undefined; /** 获取视口基础信息的实现 */ abstract getViewportInfo(): ViewInfo | undefined; /** 初始化视口,给 viewport 设值 */ abstract createViewport(): void; /** 设置视口的位置 */ abstract setViewportPosition(position: Partial<Vec3>): void; /** 设置视口的缩放 */ abstract setViewportScale(scale: Partial<Vec3>): void; /** 设置视口是否可见 */ abstract setViewportVisible(visible: boolean): void; /** 获取截图 */ abstract getScreenShot(sx?: number, sy?: number, w?: number, h?: number, fileType?: string, quality?: number, isBase64?: boolean): Promise<string | Blob>; } export {};