自定义教具与样式
适用于 Appliance Plugin 1.1.45。先完成启用插件，下文 plugin 为 AppliancePluginInstance。
当前用户的教具状态
使用插件导出的扩展 MemberState，通过 plugin.setMemberState 提交。此状态控制当前用户，和 SDK 基础 MemberState 的字段集合不同。
import { ApplianceNames, EStrokeType, ShapeType, type MemberState } from '@netless/appliance-plugin';
const pencil: Partial<MemberState> = {
currentApplianceName: ApplianceNames.pencil,
strokeColor: [32, 102, 255], strokeWidth: 4,
strokeType: EStrokeType.Dotted, strokeOpacity: 0.8
};
plugin.setMemberState(pencil);
plugin.setMemberState({
currentApplianceName: ApplianceNames.shape, shapeType: ShapeType.Polygon,
vertices: 6, fillColor: [240, 245, 255], fillOpacity: 0.4
});
strokeColor、fillColor 为 RGB 数组；透明度为 0～1。切换工具时按业务需要显式恢复线型、填充和 autoShape 等状态。
ExtrasOptions 配置
在初始化时传入 options.extras；Fastboard 对应 enableAppliancePlugin.extras。回调函数放在 adaptor，不放在 extras。
import type { ExtrasOptions } from '@netless/appliance-plugin';
const extras: ExtrasOptions = {
useWorker: 'auto',
useSimple: true,
useBackgroundThread: true,
dottedStroke: { lineCap: 'round', segment: 1, gap: 2 },
longDottedStroke: { lineCap: 'round', segment: 4, gap: 3 },
normalStroke: { lineCap: 'round' },
undoRedo: { maxStackLength: 20 },
overwriteSelectorStyles: {
highlightBox: { borderColor: '#2066ff' },
highlightBoxPoint: { backgroundColor: '#ffffff' },
highlightBoxPoints: { LT: { borderColor: '#2066ff' } }
}
};
| 配置 | 用途 |
|---|---|
| useWorker / allowImageBitmapFallback / useSimple | Worker 选择和绘制模式；默认 auto、true、true |
| useBackgroundThread | 背景图能力，默认 false |
| pencilEraser / strokeWidth / bezier | 橡皮、笔宽和曲线处理 |
| textEditor | 文字编辑器样式和交互 |
| normalStroke / dottedStroke / longDottedStroke | 线型端点、长度和间隔 |
| overwriteSelectorStyles | 框选边框、控制点和锁定图标样式 |
| backgroundImageLoadOptions | 背景图超时与重试策略 |
| cursor | 插件光标配置 |
| undoRedo | 撤销重做配置；跨用户全局撤销默认关闭 |
自定义 Selector 与属性面板
通过 getSelectedElements(viewId) 获取快照；有效 View 未选中元素时仍返回快照，selectedIds 和 selectedElements 为空数组；没有可用 View 时可能返回 undefined。使用 getFloatbarContainer(viewId) 获得面板容器，外部容器定位可用 getViewOffsetToContainer(container, viewId)。
更新已选中元素使用 updateSelectedElements(viewId, changes)，复制和删除使用 copySelectedElements(viewId)、deleteSelectedElements(viewId)，清空选择使用 blurSelector(viewId)。这些操作返回 Promise，业务拒绝通常通过结果的 ok=false 和 reason 表示；应检查 ok，不要只依赖 catch。blurSelector 在拖动/缩放/旋转中可能返回失败结果。
viewRect 使用当前 View 的 DOM 视图坐标，不能直接当作世界坐标。修改属性前用 isElementPropertySupported(toolsType, field) 判断元素是否支持该属性。结果表示模型操作完成，不能泛化为资源或首帧就绪。
Selector 的四类事件为 selectedElementsChange、selectorGeometryChange、selectorTransformChange、remoteSelectorChange，分别表示选中集合、最终几何、交互过程、远端同步结果。监听及清理示例见事件监听与元素查询。