如何實現共享屏幕標註功能?

   在視頻會議系統中,經常會有這樣的需求:參會人員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源碼就非常容易瞭解了。

       共享屏幕標註Demo(源碼)

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章