电子白板技术最初是指多媒体视频会议系统中，与会者通过某个界面实时共享数据并协同工作的技术。任何与会者在电子白板上的操作，包括简单的图形绘制操作、文字输入操作等，都可以实时地与其他与会者共享。
即时通信系统中电子白板输入数据的类型分为两类：文本和图形对象。文本可以用于用户对图形进行注释等功能，图形对象则包括直线、矩形、圆、自由画线以及橡皮擦、清屏等。每一种数据类型都被定义为相应的类，并由另一个类包装成数据包在系统中的通道上传送，同时这个类还要能将接收的数据包进行远程图形恢复。
在本系统中电子白板功能模块使用静态链接的方式实现，通信双方成功建立连接时，系统可以自动调用电子白板的可执行文件，启动电子白板，或者用户根据需要通过功能键启动电子白板。系统主程序中使用ShellExecute（）函数调用电子白板可执行文件的程序代码如下：
电子白板调用成功的界面如图8-6所示。
图8-6 电子白板运行界面
当电子白板启动成功后，用户就可以使用鼠标绘制图形或输入文字。绘制图形的鼠标消息数据包必须考虑绘制过程，即要描述绘制开始（鼠标按下）、绘制中（鼠标拖动）和绘制结束（鼠标放开），这样，其他用户在接收到这个数据包时，才能正确地在本地重新绘制并重现绘制过程。
8.5.1 电子白板的功能要求
8.5.1.1 电子白板的功能目标
根据系统需求，电子白板的功能与Windows提供的绘图板的功能相似，因此在程序设计和开发时将电子白板的界面设计成与Windows绘图板类似的界面，方便Windows用户的操作。在本系统中，电子白板实现的功能主要有：
（1）电子白板共享内容的同步显示。
用户以鼠标移动在电子白板中进行各种操作时，接收方的电子白板会始终保持着与用户的白板同步，用户在白板上所做的任何行为都会反映到接收方的电子白板上。
（2）在线同步作业。
系统允许通信双方同时对电子白板进行操作，效果如同现实生活中两个人同时在同一块黑板上书写。
（3）常用的绘图功能。
系统中实现了基本的绘图功能，如绘制直线、绘制圆形、绘制矩形、橡皮擦、清屏等功能。
8.5.1.2 电子白板的功能模块划分
电子白板图形会话是以图形为信息载体、以图形信息传输为主的即时通信。电子白板是在完成基本图形绘制时，提取图形特征信息，然后打包传输给接收方，在接收方将信息包恢复成图形的过程。电子白板模块可分为三个子模块：
（1）本地图形绘制模块。
本地绘图模块是电子白板系统中一个非常重要的组成部分，用户在电子白板中根据需要选择图形、功能类型进行各种操作，通信双方可以在自己机器上客户端的电子白板上同时进行操作。
（2）打包传输模块。
打包传输模块在传送图形信息前采用自定义的协议格式对信息头和图形属性信息进行打包，把图形信息组合成一个完整的图形特征信息包，然后才能发送给远程客户端，等待下一步处理。
（3）远程图形恢复模块。
远程图形恢复就是在远程客户端进行图形重新绘制，与本地图形实现的过程比较相似，所不同的是它通过远程传输的图形特征信息来重绘图形。在信息到达远程客户端后，确定图形绘制的属性值，调用图形绘制函数，使用鼠标坐标参数值，就能完成图形的恢复。
8.5.2 本地图形绘制
8.5.2.1 本地图形绘制逻辑过程
本地图形绘制模块为用户提供了图形编辑工具、即时绘制图形的场所。用户在工具栏上选择绘图工具，可以在画布上绘制各种图形。本地图形绘制的逻辑过程如图8-7所示：
图8-7 本地图形绘制逻辑过程
8.5.2.2 绘制图形功能设计与实现
画笔是基本的GDI（Graphics Device Interface，图形设备接口）对象之一，在绘图之前，必须先创建或选择画笔对象。MFC提供了一个封装CPen类，大大简化了画笔对象的使用。CPen类保存了基础层GDI对象，并且处理它的分配与释放。
应用程序可以调用GDI提供的一系列函数来创建自定义的画笔，这些函数包括CreatePen（）函数、CreatePenIndirect（）函数等，MFC将这些函数封装在CPen类中，这样画笔就能够被视为对象进行处理。
1.创建画笔
本系统使用CPen构造函数和CreatePen（）函数两种方法来创建画笔。
（1）创建GDI画笔最简单的方法是构造一个CPen类对象，并且将定义画笔的参数传给它。例如，下面的代码创建了一支红色的实心笔：
（2）创建GDI画笔的第二个方法是构造一个没有初始化的CPen类对象。当画笔声明与画笔创建不在同一个地方时经常使用这种方法。例如，在同一个画笔实例需要被多次使用，但颜色却改变了许多次时就可以使用这种方法。在每一次更新创建画笔时，就可以调用CreatePen（）函数，如果画笔被成功地创建，那么CreatePen（）函数返回TRUE，否则，返回FALSE。
2.设置画笔的属性
画笔的属性有三个定义特性，包括样式、宽度和颜色。
（1）设置画笔的样式。
传递到CPen构造函数、CreatePen（）函数的三个参数中的第一个参数指定了画笔的样式，它定义了画笔绘制直线的类型。表8-1中列出了可以使用的画笔的样式。
表8-1 可用的画笔的样式值
（2）设置画笔的宽度。
传递给CPen类构造函数的第二个参数指定了画笔的宽度，使用画笔宽度的物理意义取决于映射方式的逻辑单位。如果第二个参数的值为1的话，那么所创建的画笔的宽度就是一个像素，是所有可以使用的画笔中最细的。该参数的值越大，则所创建的画笔就会越粗。在本系统中，只选用了4种宽度，如果有需要，可以根据需要添加。
（3）设置画笔的颜色。
在构造画笔对象时，可以设置的第三个参数是颜色，该参数的类型是COLORREF。实际上，一个COLORREF类型的值只是一个32位的整数，这个整数由代表颜色的红、绿、蓝三元素的8位整数组成。MFC中定义了一个宏RGB可以帮助设置颜色。例如，下面的代码显示了如何使用宏RGB：
宏RGB需要三个参数，分别代表颜色的红、绿、蓝三元素的亮度，可以把这三个参数设置成0到255之间的任意值，0代表没有颜色，255代表全颜色。在本系统中，我们将部分颜色存放在数组中，并显示在工具栏上，这样方便用户选择需要的颜色。
3.绘制图形
（1）绘制直线。
画直线是常用的绘图操作之一，Lineto（）函数和Moveto（）函数就是用来实现画线功能的两个函数，Moveto（）是移动画笔位置，需要提供起始点的坐标，Lineto（）方法用来绘制直线，需要提供终止点的坐标。Lineto（）函数和Moveto（）函数配合使用，就能完成绘制直线和折线的任何操作。
值得注意的是，在画直线时，总存在一个称为当前位置的特殊位置。每次画直线都是以当前位置为起点。画直线操作结束之后，直线的结束点位置又成为了当前位置。设置当前位置是为了提高画线操作的效率。因为在大多数场合下，总是一条直线连着另一条直线，有了当前位置，会自动隐含地传递信息，就可以避免每次画线时都要给出两点坐标的工作。
本系统中绘制直线时，设置操作类型nType=0，调用MoveTo（x，y）和Lineto（x，y）方法，其中创建并选择了不同的画笔。
电子白板中绘制直线的图形界面如图8-8所示：
图8-8 绘制直线的图形界面
（2）绘制矩形框、实心矩形。
绘制矩形框时，设置操作类型n Type=1，将刷子设置为透明，然后调用Rectangle（x1，y1，x2，y2）方法，（x1，y1）是鼠标起始点的坐标，（x2，y2）是鼠标终止点的坐标。
绘制实心矩形时，设置操作类型Type=2，选择颜色和宽度，调用Rectangle（x1，y1，x2，y2）方法绘制一个用刷子填充了颜色的实心矩形。
电子白板中绘制矩形和实心矩形的图形界面如图8-9所示：
图8-9 绘制矩形和实心矩形的图形界面
（3）画笔。
在电子白板上用画笔操作类似于课堂上教师在黑板上的书写动作。在共享白板上，用户按左键拖动鼠标画线时，鼠标移动到哪里线就画到哪里。这个问题的解决主要根据应用场合对实时性的要求。对实时性要求最高的场合，当然是鼠标移动一个点就传送一个点。但实际中往往不需要，而是每隔6个点就生成一条消息，也就是说，鼠标每移动6个像素的位置，就有一条消息产生。
至于采样点的个数，可选择传送全部点，保证画笔画出的曲线足够光滑，实现没有失真的采集。如果选择隔点采样，实际的网络传输量就会减半，但还原得到的线条就可能会出现明显的锯齿现象。
电子白板中用画笔操作的图形界面如图8-10所示：
图8-10 用画笔操作的图形界面
（4）选择图形。
设置操作类型n Type=3，如果选择单个图形，只要用鼠标左键单击该图形即可；如果选择多个图形，按住鼠标左键拖动鼠标选择。选择完成后被选中的图形四周显示一个区域虚线框。例如，下面的代码是选择矩形的情况：
电子白板中选择图形的操作的图形界面如图8-11所示：
图8-11 选择操作的图形界面
（5）使用橡皮擦。
设置操作类型n Type=4。要清除某个图形，只要在该图形上单击鼠标左键即可；如果要清除多个图形，可以先使用选择功能选中要清除的连续的对象，然后使用清除功能即可。
（6）绘制椭圆和实心椭圆。
圆是一种长半轴和短半轴相等的椭圆，所以绘制圆和椭圆只要一个设备环境来的成员函数就足够了。程序中使用Ellipse（）函数来画椭圆，在El1ipse（）函数中，椭圆是由其外接矩形来确定的，外接矩形的中心与椭圆的中心重合，矩形的长和宽与椭圆的长短轴相等。
绘制椭圆时，设置操作类型n Type=5。
绘制实心圆形或椭圆时，设置操作类型n Type=6，实现的原理跟绘制实心矩形是相同的，就是将绘制的圆或椭圆填充颜色即可。
电子白板中绘制椭圆和实心椭圆的图形界面如图8-12所示：
图8-12 绘制椭圆和实心椭圆的图形界面
（7）文字输入。
Windows可以显示很多种数据，但即使在像Wnidows这样强大的图形操作系统中，文本仍然是程序与用户进行交互的主要途径。在屏幕上显示文本最简单、最快捷的方法莫过于使用设备环境中的成员函数Textout（）。该函数要求传递参数x坐标和y坐标来确定起始的文本输出位置，另外还需要一个Cstring类型的参数来保持待显示的文本。
设置n Type=7，部分程序代码如下：
电子白板中文字输入的图形界面如图8-13所示：
图8-13 文字输入的图形界面
（8）移动图形。
移动图形是在选择了图形的基础上进行的操作，首先根据需要使用选择功能选择图形，然后按住鼠标左键移动图形到终点位置，移动之后各个图形之间的相对位置保持不变。
设置n Type=8，部分程序代码如下：
4.删除画笔
使用完自定义的画笔后，必须把它们删掉，同时也必须清除基础层GDI对象和释放被占用的系统资源。当CPen类被删除的时候，系统将自动把基础层的GDI对象删除，并且释放被占用的系统资源。
DeleteObject（）函数是删除基础层的GDI对象的成员函数，画笔被删除之后，基础层的GDI对象被释放，如果用户还想画图，就要重新使用CPen类的CreatePen（）来创建另一个画笔。
8.5.3 图形信息打包与传输模块
用户在电子白板上进行操作时，操作的结果被传输到接收方，并同步显示在接收方的电子白板上，传输过程中被传送的都是图形对象的特征信息。在传送图形信息前必须采用自定义的信息数据格式对信息进行打包，然后才能发送给远程客户端。
图形信息报文内容是绘制图形过程中产生的图形特征信息组成的数据。系统中定义的各种不同的图形工具特征信息数据结构如下：
◣直线：起点+终点+线条粗细+线条样式+线条颜色；
◣圆形、椭圆、矩形：起点+终点+线条粗细+线条样式+线条颜色+填充样式+填充颜色；
◣文本：坐标+字体+字号+字体样式+颜色+文本内容；
◣选择、移动：起点+终点；
◣画笔：起点+终点+线条大小+线条颜色；
◣橡皮擦：起点+终点坐标+擦痕大小：
◣清屏：报文内容为空。
8.5.3.1 图形信息打包
图形信息打包就是按照图形信息传输协议把图形信息组合成数据包，等待系统的进一步处理。我们采用字符数组格式的数据包，定义一个字符数组stGraph Tem来存储打包的图形信息，打包好的数据提交给一个发送队列发送。
图形信息打包的处理过程：首先对信息头进行打包，接着对图形属性信息进行打包，就成为一个完整的图形特征信息包，各个属性值之间用“%”隔开。
在程序响应WM_MOUSEMOVE（鼠标移动）、WM_LBUTTONDOWN（鼠标左键按下）和WM_LBUTTONUP（鼠标左键抬起）这样3种Wnidows消息时，采用如下程序对图形数据进行打包：
通过以上程序代码，画图所需要的各种信息就被打包到数组stGraph Tem中，然后等待信息的下一步处理。
8.5.3.2 图形信息包传输
图形信息包传输包括数据包发送和接收。数据包的收发都是通过UDP网络协议来实现的。图形信息接收是在远程客户端进行的，从UDP上将本地发送的数据包读到远程客户端，并保存在缓冲队列中，等待下一步处理。
8.5.4 远程图形恢复模块
远程图形恢复就是在远程客户端进行图形重新绘制，与本地图形实现的过程比较相似，所不同的是它通过远程传输的图形特征信息来重新绘制图形。第二个区别是远程图形恢复过程不需要用户干预，由客户端自动完成。
图形打包的信息到达远程客户端后，就会通过Windows信息处理过程触发图形恢复过程，恢复的原则是逐条恢复。直线、矩形、圆形、文字等基本图形恢复和本地图形实现一致，唯一区别是图形恢复的是操作的结果，而本地图形实现能看到图形绘制过程。确定图形绘制的属性值，调用图形绘制函数，使用鼠标坐标参数值，就能完成图形的恢复。
系统程序中调用函数ReceiveCallback（）来进行图形的恢复。首先利用Receive（）函数获取所需的信息，然后用API函数sscanf（）对缓存buff中的数据进行解析，变为可以方便处理的简单数据类型的信息，最后利用GDI函数进行本地绘图。
免责声明：以上内容源自网络，版权归原作者所有，如有侵犯您的原创版权请告知，我们将尽快删除相关内容。
