基于Java的网络电子白板的设计与实现

2016-11-02毛颖华

电脑知识与技术 2016年23期

毛颖华

摘要：随着宽带和多媒体技术的日趋成熟，电子白板正以其形象、直观、不受地域限制等优势，得到越来越广泛的应用。通过电子白板，可以在文字聊天基础上引入图形绘制交流功能，更加丰富了人们之间交流的形式。该文综合运用UML建模技术、计算机网络技术，以Java作为开发语言、Eclipse作为开发工具，基于Socket通信模型，设计并实现一个具有绘制图形及图形数据同步传输与显示功能的网络电子白板。

关键词：Java；电子白板；Eclipse 绘制图形

中图分类号：TP311 文献标识码：A 文章编号：1009-3044（2016）23-0061-04

Abstract： As the broadband and multimedia technology matures， whiteboard is used more widely with its image， intuitive， without geographical restrictions and other advantages. By the whiteboard， we can introduced graphics exchange capabilities on the basis of text chat， richer forms of communication between people. This paper uses UML modeling and computer network technology， uses Java as a development language， Eclipse as a development tool， and based on the socket communications， designs and implements a whiteboard with the functions of drawing graphics and graphic data transmission and display.

Key words： Java； Whiteboard； Eclipse drawing graphics

1 背景

随着网络的迅速发展，Email、WWW、FTP等传统的非实时应用日趋成熟，广大网络用户对在线实时交流的需求不断扩大，如网上会议、远程教学、协同工作等[1]，此方面的应用软件也日益丰富。该类交流软件主要分为两类，一类是以目前BBS和主页中聊天室为代表的纯文字型的交流工具；另一种就是电子白板类交流工具，而电子白板正以其形象、直观、不受地域限制等优势，受到越来越广泛的应用。

所谓电子白板，即指一个虚拟公用区域内，在CSCW中参加协作的各成员计算机上均有一个白板视图，白板视图上的内容既可以是手绘的简单图形（直线、曲线、矩形等），也可以是文字、图像、音频、视频。其中白板数据是共享数据[4]，当一个用户修改了其中的数据之后，就会把修改立即通知给其他用户，让其他用户及时更新自己的白板视图，其更新结果立即反映在其他所有用户的视图上。

目前，市场上主流的电子白板软件有EduBoard、EduOffice和NetMeeting等。其中，NetMeeting[5]是一款由MicroSoft公司开发的带有电子白板功能的视频会议软件，即当某个用户创建了一个网络会议之后，该会议中的任何一个用户都可以运行白板部件，其他用户则可以看到该白板，所有的用户都可以在白板上自由书写、绘制图形，输入的信息被所有用户共享。

与其他交流工具相比，本文所设计的电子白板除了具备聊天室功能外，还引入了绘制图形交流功能，大大增强了交流的形象性和直观性，弥补了文字交流的不足。当分布在Internet不同位置的用户用白板进行交流时，用户在自己的白板上绘制的图形可以立即在其他用户白板上显示出来，类似所有用户都在同一块白板上绘画，大大缩短了彼此间的距离感。

2 主要技术

本文所设计的电子白板基于用户加入分组，并向组广播消息的工作原理来实现用户间的通信。在传输层，采用UDP协议进行数据传输，并将网络数据流量压缩成数据报的形式，而对拆分后数据的先后到达顺序不做要求。在应用层，使用Socket编程技术实现应用程序之间的数据交换，并采用网络API中的数据报套接字建立在发送和接收消息时的连接，该套接字的使用减少了在建立连接时所要花费一定时间而产生的开销。

Socket通信示例图如图1所示。

为了使开发的软件便捷、高效并且适合网络应用，本文采用了Java作为开发语言，Eclipse作为集成开发平台，其中Eclipse多样化的插件支持，使得软件的设计变得更加便捷，为本系统的成功开发奠定了良好的基础。

3 系统需求

本文所设计的电子白板在设计时应满足以下目标：采用文字与图形两种交谈方式，其中当文字消息发送后，组中所有成员均能及时接收，并实现区分用户名重名；图形消息除保证能正常接收外，还应能够实现同步传输和显示；系统界面友好、美观。系统将最大限度地实现易维护性和易操作性，保证系统运行稳定，且安全可靠。

电子白板功能主要划分为文字交谈和图形交互两个部分，其中文字交谈是指实现用户之间文字消息发送、传输和接收，而图形交互主要是用户在白板区域绘制图形，另一方的该区域将同步显示图形画面，其功能模块图如图2所示。

③ 离开组播组。当用户加入组后，按钮jButton2由“加入”变为“离开”，再次点击该按钮（此时为“离开”）时，则调用leaveGroup（）方法向组播组发出此用户离开的消息，用户离开组播组，并且在离开前向组里面广播自己已经离开。

2）发送消息。当用户点击按钮jButton1时，就触发发送消息事件。首先调用方法addActionListener（），在按钮jButton1上添加按钮监听器jButton1_actionPerformed（），用来负责监听按钮事件。接着在该方法中定义实现获取输入信息并向组里广播等功能的属性及操作。

在方法jButton1_actionPerformed（）中，首先调用getText（）方法获取用户输入信息，其次在该信息中添加如用户名、交谈对象等信息，并把消息连接在一起组成字符串，随后将消息打包并在组里广播，最后清空输入消息框。

3）接收消息。利用waitfopacket（）方法等待组播组发送的消息并在本机上显示出来。首先调用receive（）方法接收组内的广播包，因为传递的数据包中可能同时包含文字消息及图形信息（坐标值），所以在每对坐标值之前添加一个特殊符号“@”，然后在解析包内容时，如果含有“@”则是图形消息，否则是文字消息。如果是文字消息就调用append（）方法把内容显示，如果是画图消息则按照坐标绘制出远端的图形。

4）绘画。绘画功能的实现是调用Java自带画图方法mouseDragged（）中的mouseMove（）方法和mouseReleased（）方法。其中，mouseMove（）方法是在鼠标落下并移动时调用，而mouseReleased（）方法是在抬起鼠标时调用。当用户将鼠标移至绘图区域时，单击并拖动鼠标就可以进行绘画，直到抬起鼠标才标志着一次绘画的结束。具体处理过程是首先获得鼠标落下时的坐标，随后记录下鼠标在拖动过程中的各个坐标，到抬起鼠标为止，然后调用drawLine（）方法，每两点之间划线，最后将直线坐标的4个值打包，在组内广播。

5）清除画板。当用户点击按钮jButton3时，触发清除画板事件。首先在jButton3上添加按钮监听器jButton3_actionPerformed（），负责监听按钮事件。其次在该方法中定义实现清除绘画区域功能的属性及操作，清除画板实际上是通过调用Java所提供的图形绘制函数setBackground（），把画板区域涂一层白色。

5 系统实现

5.1 系统界面

本系统界面中，在用户加入组播组之前，消息输入框、绘画区域、文字消息显示区域等都显示灰色，即该区域暂时没有被激活。系统运行效果图如图7所示。

5.2 用户加入组

当用户加入组播组后，消息输入框、绘画区域、文字消息显示区域等都被激活，负责输入用户名的按钮从“加入”变为“离开”，此时，用户可以通过消息输入框输入信息来交谈，也可以利用白板区域绘画进行交互。用户加入组播组界面如图8所示。

5.3 发送和接收文字消息

当用户加入组后，即可进行交谈。在输入框中输入信息，点击“发送”按钮就能通过广播将消息发送给组内成员。此外，本系统支持中英文的输入和显示，解决了编码问题。用户发送和接收文字消息界面如图9所示。

5.4 图形消息的同步显示

除了利用文字消息进行交谈，用户之间还可以通过白板进行交互。在绘图区域绘画时，组中另外成员的画板上会同步传输和显示该图形。两个用户之间的白板交互情况分别如图10和图11所示，其中图10为发送方界面，图11为接受方界面。

5.5 用户离开组

当用户离开组播组后，消息输入框、绘画区域、文字消息显示区域等又恢复为加入组播组之前的不可用状态。用户离开组后界面变化如图12所示。

6 结束语