如何实现共享屏幕标注功能?
在视频会议系统中,经常会有这样的需求:参会人员A共享了自己的屏幕给大家观看,人员B则需要在屏幕图像上做标注,并且希望所有的与会人员都能看到他做的标注。这个功能通常被称为共享屏幕标注、或带标绘功能的远程桌面。如何实现这个功能了?
在视频会议系统中,经常会有这样的需求:参会人员A共享了自己的屏幕给大家观看,人员B则需要在屏幕图像上做标注,并且希望所有的与会人员都能看到他做的标注。
这个功能通常被称为共享屏幕标注、或屏幕标注、或带标绘功能的远程桌面。
一.实现方案
将这个功能拆解开来,实际上就是 远程桌面 + 电子白板,我们可以在远程桌面的控件上叠加一个背景透明的电子白板就可以实现这样的效果。
接下来,我们尝试使用 OMCS 的远程桌面组件和电子白板组件,来实现这个功能。具体而言,我们在 OMCS入门Demo 的电子白板示例组件上,再增加一个动态桌面连接器,就可以在观看对方桌面的同时进行标绘。
Demo最终的运行效果如下图所示:
二.具体实现
我们在OMCS入门demo的白板功能演示的窗口上,增加一个动态桌面连接器(DynamicDesktopConnector),并预定动态桌面连接器相关事件。
public WhiteBoardForm(string _ownerID) { InitializeComponent(); this.whiteBoardConnector1.WatchingOnly = false; this.ownerID = _ownerID; this.Text = string.Format("正在访问{0}的电子白板", this.ownerID);
// 需要在设计界面将电子白板连接器的背景改为透明(属性已修改)
this.whiteBoardConnector1.ConnectEnded += new CbGeneric<ConnectResult>(whiteBoardConnector1_ConnectEnded); this.whiteBoardConnector1.BeginConnect(this.ownerID); this.dynamicDesktopConnector1.ConnectEnded += new CbGeneric<ConnectResult>(DynamicDesktopConnector1_ConnectEnded);
// 将动态桌面连接器控件设置在当前窗口 this.dynamicDesktopConnector1.SetViewer(this); this.dynamicDesktopConnector1.BeginConnect(this.ownerID); } private void DynamicDesktopConnector1_ConnectEnded(ConnectResult obj) { if (this.InvokeRequired) { this.BeginInvoke(new CbGeneric<ConnectResult>(this.DynamicDesktopConnector1_ConnectEnded), obj); } else { if (obj != ConnectResult.Succeed) { MessageBox.Show("连接失败!" + obj.ToString()); } } }
在点击开始“远程桌面(标绘)”按钮时,我们开始初始化电子白板连接器及动态桌面连接器,连接到目标会议室的房间ID。
有几点要注意一下:
(1)电子白板连接器控件的背景色 BackgroundColor 要设置成透明。
(2)必须要使用DynamicDesktopConnector组件,而不能使用DesktopConnector控件。
(3)DynamicDesktopConnector组件所使用的显示屏幕图像的Viewer必须是Form,而不能是Control,否则,电子白板连接器控件的背景透明就无法实现(可能是WinForm的限制)。
(4)所以,UI的整体结构层次是:底层是Form(DynamicDesktopConnector使用该Form的表面来绘制屏幕图像),上层是WhiteBoardConnector控件,背景透明,用于实现标注。
三.源码下载
在理解了屏幕标注功能的具体实现原理之后,再看Demo源码就非常容易了解了。