多窗口模式

  • Web

更新时间不可用

适用于 Whiteboard Web SDK 2.16.59。

多窗口模式使用 WindowManager 管理主白板(MainView)和各类课件窗口。适用于需要同时展示多个课件、切换焦点、统一翻页与协同书写的业务。

安装与接入

Shell
npm install white-web-sdk@2.16.59 @netless/window-manager@1.0.25
TypeScript
import { WhiteWebSdk, type InvisiblePluginClass } from 'white-web-sdk';
import { WindowManager } from '@netless/window-manager';
import '@netless/window-manager/dist/style.css';
const sdk = new WhiteWebSdk({ appIdentifier, region: 'cn-hz', useMobXState: true });
const room = await sdk.joinRoom({
  uuid, roomToken, uid, region: 'cn-hz',
  useMultiViews: true, disableMagixEventDispatchLimit: true,
  invisiblePlugins: [WindowManager as unknown as InvisiblePluginClass<string, object, object>]
});
const manager = await WindowManager.mount({
  room, container, containerSizeRatio: 9 / 16, cursor: true
});

container 是已有且具备有效尺寸的 DOM 元素。invisiblePlugins 在入房前注册,mount 在入房后执行;useMobXState 与 disableMagixEventDispatchLimit 应同时开启。同房间客户端保持一致的比例约定。使用教具插件时,还需要该页面介绍的插件注册与初始化。

按功能选择 API

功能公开入口作用
课件生命周期addApp / closeApp添加与关闭房间中的课件实例
课件查询queryAll / queryOne查询本端 AppProxy;实例是否存在不代表已渲染
窗口焦点focusApp、focused、focusedChange提交或观察窗口焦点;focusApp 返回 Promise<boolean>
主白板场景setMainViewScenePath / setMainViewSceneIndex切换主白板目录或零基场景索引
主白板页导航nextPage / prevPage / jumpPage操作主白板页面;jumpPage 使用零基索引
窗口状态setBoxState / boxState / boxStateChange最大化、最小化、普通窗口状态
视角与权限setViewMode / setReadonly配置跟随和只读;不能提升房间本身的写权限
光标mount 的 cursor、入房 userPayload配置多窗口用户光标与昵称
相机与撤销moveCamera / undo / redo移动主视图、撤销重做
表格内容超出当前宽度,可横向滚动查看更多列。

统一控制接口使用从 1 开始的页码,与上述零基场景索引区分。操作回调只代表其定义的提交状态,课件可见/初始化/资源渲染需要分别观察。WindowManager 事件由 manager.emitter.on(...) 订阅,保存并调用返回的解除订阅函数。

课件与进阶配置

  • 课件接入:动态 Slide、静态 Presentation、DocsViewer、MediaPlayer 与自定义 H5。
  • 统一页面控制:按 mainView 或具体 appId 控制页面、查询倍率、监听页码和缩放。
  • 统一笔记:MainView 与 Slide/Presentation 的 originSize。
  • 课件按需加载:forceMaximized、按焦点初始化与 LRU 缓存。
  • 动态配置:配置平台下发窗口参数与本地覆盖优先级。

退出

先解除业务监听;若创建了教具插件实例,先等待其 destroy,再等待 manager.destroy 和 room.disconnect,最后移除容器。不要一边销毁 manager 一边继续向它发送课件操作。