Skip to content

Latest commit

 

History

History
209 lines (180 loc) · 9.33 KB

互动白板接入文档.md

File metadata and controls

209 lines (180 loc) · 9.33 KB
Raw

SDK 文件结构

文件名称 说明
TEduBoard.h SDK 头文件
TEduBoard.lib SDK 导入库
TEduBoard.dll SDK 动态链接库
TEduBoardRender.exe SDK 渲染程序
其它文件 CEF 框架及其依赖文件

SDK 快速集成

导入 SDK 到项目

在 Visual Studio 开发环境下，按如下步骤导入 SDK：

  1. 从菜单中依次选择【视图】>【解决方案资源管理器】；
  2. 在【解决方案资源管理器】中，右键单击要导入 SDK 的项目名称；
  3. 在弹出菜单内单击【属性】选项，弹出项目属性对话框；
  4. 从左侧配置属性列表中，选择【VC++目录】项；
  5. 将 SDK 头文件所在目录路径添加到右侧【包含目录】中；
  6. 将 SDK 导入库所在目录路径添加到右侧【库目录】中；
  7. 在需要使用 SDK 的源码文件内添加如下代码导入 SDK。
// 引入 SDK 头文件
#include "TEduBoard.h"
// 链接 SDK
#pragma comment(lib, "TEduBoard.lib")

白板窗口管理

白板控制器创建及初始化

使用如下代码创建并初始化白板控制器：

// 创建白板控制器
TEduBoardController *boardCtrl = CreateTEduBoardController();
// 添加回调
boardCtrl->AddCallback(myCallback);
// 初始化授权参数结构体
TEduBoardAuthParam authParam;
authParam.sdkAppId = SDK_APP_ID;
authParam.userId = USER_ID;
authParam.userSig = USER_SIG;
// 初始化白板控制器（配合腾讯云 IMSDK 4.0 以上版本使用时最后一个参数传 true 以实现自动同步实时数据）
boardCtrl->Init(authParam, ROOM_ID, true);

其中 SDK_APP_ID、USER_ID、USER_SIG、ROOM_ID为需要您自己填写的参数，myCallback 为实例化 TEduBoardCallback 接口的回调接收器。

白板窗口获取及显示

在 onTEBInit 回调方法内，使用如下代码获取并显示白板窗口：

// 获取白板窗口句柄
HWND boardHwnd = boardCtrl->GetBoardRenderView();
// 获取并计算父窗口客户区大小
RECT parentRect;
::GetClientRect(PARENT_HWND, &parentRect);
int cx =  parentRect.right - parentRect.left;
int cy =  parentRect.bottom - parentRect.top;
// 设置白板为子窗口
::SetParent(boardHwnd, PARENT_HWND);
// 更改白板大小和位置
boardCtrl->SetBoardRenderViewPos(0, 0, cx, cy);
// 显示白板窗口
::ShowWindow(boardHwnd, SW_SHOW);

其中 PARENT_HWND 为要将白板窗口嵌入其中显示的容器窗口句柄。

!SDK 所有回调都在主线程内执行，因此可以在回调里直接执行 UI 操作。

WM_SIZE 事件处理

在父窗口的 WM_SIZE 事件处理函数内，使用如下代码调整白板窗口大小与父窗口适配：

// 获取白板窗口句柄
HWND boardHwnd = boardCtrl->GetBoardRenderView();
// 获取并计算父窗口客户区大小
RECT parentRect;
::GetClientRect(PARENT_HWND, &parentRect);
int cx =  parentRect.right - parentRect.left;
int cy =  parentRect.bottom - parentRect.top;
// 更改白板大小
boardCtrl->SetBoardRenderViewPos(0, 0, cx, cy);

白板窗口关闭

需要关闭白板窗口时，使用如下代码关闭：

// 销毁白板控制器
DestroyTEduBoardController(&boardCtrl);

SDK 常用操作

涂鸦操作

启用禁用涂鸦

白板窗口显示出来后，默认情况下用户可以在白板窗口上进行涂鸦操作，您可以通过以下接口禁用或再次启用涂鸦操作：

// 判断当前是否允许涂鸦（此处这样写只是出于演示目的，实际可以不进行判断）
if(boardCtrl->IsDrawEnable()){
	// 禁用涂鸦操作
	boardCtrl->SetDrawEnable(false);
}

选择涂鸦工具

白板目前支持以下几种涂鸦工具：

工具类型 对应枚举值
画笔 TEDU_BOARD_TOOL_TYPE_PEN
橡皮擦 TEDU_BOARD_TOOL_TYPE_ERASER
激光笔 TEDU_BOARD_TOOL_TYPE_LASER
直线 TEDU_BOARD_TOOL_TYPE_LINE
空心椭圆 TEDU_BOARD_TOOL_TYPE_OVAL
空心矩形 TEDU_BOARD_TOOL_TYPE_RECT
实心椭圆 TEDU_BOARD_TOOL_TYPE_OVAL_SOLID
实心矩形 TEDU_BOARD_TOOL_TYPE_RECT_SOLID
点选工具 TEDU_BOARD_TOOL_TYPE_POINT_SELECT
框选工具 TEDU_BOARD_TOOL_TYPE_RECT_SELECT
文本工具 TEDU_BOARD_TOOL_TYPE_TEXT

您可以通过以下接口选择涂鸦工具：

// 判断当前是否选框工具（此处这样写只是出于演示目的，实际可以不进行判断）
if(boardCtrl->GetToolType() != TEDU_BOARD_TOOL_TYPE_SELECT){
	// 选择选框工具
	boardCtrl->SetToolType(TEDU_BOARD_TOOL_TYPE_SELECT);
}

设置涂鸦属性

目前支持的涂鸦属性有以下几种：

属性说明 对应获取接口 对应设置接口
全局白板背景色 GetGlobalBackgroundColor SetGlobalBackgroundColor
当前白板使用的背景色 GetBackgroundColor SetBackgroundColor
用于所有涂鸦绘制的画笔颜色 GetBrushColor SetBrushColor
用于所有涂鸦绘制的画笔粗细 GetBrushThin SetBrushThin
插入文本时使用的文本颜色 GetTextColor SetTextColor
插入文本时使用的文本大小 GetTextSize SetTextSize
当前白板使用的背景图片 无 SetBackgroundImage
当前白板使用的背景 H5（目前版本暂不支持） 无 SetBackgroundH5
当前白板使用的宽高比（目前版本暂不支持） 无 SetBoardRatio

每个接口的详细使用说明参见互动白板接口文档。

清除涂鸦

您可以调用以下接口清除当前白板页涂鸦，通过参数可以指定是否同时清除背景图片：

// 清除当前白板页的涂鸦（同时清除背景图片）
boardCtrl->Clear(true);

也可以调用以下接口重置白板控制器（删除所有白板页）：

// 重置白板控制器
boardCtrl->Reset();

撤销重做

您可以调用白板控制器的 Undo 和 Redo 接口进行涂鸦的撤销和重做操作，同时可以通过 onTEBUndoStatusChanged 和 onTEBRedoStatusChanged 这两个回调拿到当前是否还可以继续撤销或重做的信息。

白板操作

白板管理

  • 每个白板页由全局唯一的白板 ID 标识，若需要获取当前白板页的白板 ID，您可以调用白板控制器的 GetCurrentBoard接口。
  • 此外您可以调用白板控制器的 GetBoardList 接口获取所有白板 ID 列表。
  • 您也可以调用白板控制器的 AddBoard 和 DeleteBoard 接口添加、删除默认文件的白板页（自行上传的文件无法添加删除白板页）。

翻页操作

  • 您可以调用白板控制器的 PrevBoard 和 NextBoard 来执行向前翻页、向后翻页操作。
  • 您也可以调用白板控制器的 GotoBoard 接口直接跳到任意白板页（支持跨文件跳转）。

文件操作

文件管理

  • 每个文件由全局唯一的文件 ID 标识，若需要获取当前白板所属的文件 ID，您可以调用白板控制器的 GetCurrentFile 接口。
  • 一个文件对应一个或多个白板页，每个白板页对应文件中的一个页面，您可以调用白板控制器的 GetFileBoardList 接口获取文件对应的白板 ID 列表。
  • 通过白板控制器的 GetFileInfoList 接口您可以获取白板中所有文件的文件信息列表。
  • 您可以调用白板控制器的 AddFile 接口来添加本地文件，文件上传并转码完成后您会收到 onAddFile 回调。
  • 当文件不再使用时，您可以调用白板控制器的 DeleteFile 接口删除文件。

文件切换

  • 您可以调用白板控制器的 SwitchFie 接口来切换当前正在展示的文件。

PPT 动画

  • 您可以调用白板控制器的 AddH5PPTFile 接口来添加 PPT 转码得到的 H5 动画 URL。
  • PPT 动画加载完成后，您会收到 onTEBAddH5PPTFile 回调。
  • 此后您可以调用白板控制器的 PrevStep 和 NextStep 接口来执行 PPT 的上一步、下一步操作（每一步对应 PPT 的一个动画效果）。
  • 白板控制器的 PrevBoard、NextBoard、GotoBoard接口在 PPT 动画文件中依然有效。
  • 白板控制器的 DeleteFile 接口也可以用于删除 PPT 动画文件。

SDK 实时数据同步

白板在使用过程中，需要在不同的用户之间进行实时数据同步（涂鸦数据等）。使用腾讯云通信 SDK 进行实时数据同步时，只需要在初始化白板控制器时进行指定 timSync 参数为 true 即可。

// 初始化白板控制器（配合腾讯云 IMSDK 4.0 以上版本使用时最后一个参数传 true 以实现自动同步实时数据）
boardCtrl->Init(authParam, ROOM_ID, true);

如果使用自已的数据通道进行实时数据同步，则需要按下面步骤进行：

// 1. 初始化白板控制器（最后一个参数传 false）
boardCtrl->Init(authParam, ROOM_ID, false);

// 2. 在 `onTEBSyncData` 回调里，将数据发送给其他白板用户
virtual void onTEBSyncData(const char * data) override {
   //使用自定义的通道，发送 data 数据给其他白板用户。
}

// 3. 在收到其他用户的 data 数据时，调用白板控制器的 `AddSyncData` 接口将数据塞给白板
boardCtrl->AddSyncData(data);