flash中通过XMLSocket监控生产系统-3

三、实战

1、服务端

　　首先，我们来构造服务端。考虑到本文的重点只是用XMLSocket 进行及时监控，而服务端知识来模拟生产系统，为了节省篇幅，我们对服务端的功能进行了简化，只要求其能够做到（使用Java语言完成服务端的编写）监听指定的端口，当有客户端请求时，启动一个新的线程与之建立连接。

try{

ServerSocket server = new ServerSocket(Integer.parseInt (args[0]));

while(true) {

System.out.println(" Start Listenning the TCP port " + Integer.parseInt(args[0]));
System.out.println("-------------------------------------------");

Socket client = server.accept();
System.out.println("Remote Host is "+ client.getInetAddress());
new ServerThread (client).start();
}
}catch (IOException ex){

ex.printStackTrace();
}

　　以上语句中，先是通过启动Java程序时传进来的端口参数，建立一个服务端套接字（ServerSocket）对象server，在随后的死循环中，调用其accept()方法监听指定的端口，如果有客户端连接请求时，生成一个套接字对象client，并用其作为参数生成并启动一个新的线程与客户端交互。

　　不断向客户端发送不同类型的有意义的XML数据，模拟生产系统的不同状态。考虑到功能的简便性，服务端只是每2秒向客户端发送一条随机类型的数据，而没有包括模拟生产系统及时的状态，如在某一时刻发生错误时，发送一条表示错误类型的数据，在实际设计编程中，基于本文中的例子，可以轻松扩展实现所需功能。

public void run() {

try {

while (true) {

System.out.println(this.getName() + "------" + i++);
d = new Date();

if(new Random().nextInt()*100 < 50){

str = "< MESSAGE TYPE=\"error\" TEXT=\"Hello, my name is Morgan!\" TIME=\"" + d.toString() + "\"/>";
} else {

str = "";
}

byte[] s= str.getBytes();

out.write(s);
out.write(0);
out.flush();

this.sleep(2000);
}

} catch (Exception ex){

ex.printStackTrace();
}
}

　　以上语句是自定义线程类ServerThread的run()方法，首先利用随机数条件if语句，随机产生不同类型的XML数据，接着用OutputStream输出流对象，输出XML数据的字节数组数据，为了表示该条数据已发送完成，再发送一个0字节，随后调用输出流的flush()方法清空缓存，让输出流立即发送数据。最后使线程暂停2秒钟，等线程再次执行时，循环以上步骤。

这样，在客户端就可以每2秒钟收到一条随机类型的XML数据。详见本文附带的程序源码。

在服务端，为了简便，只是随机向两种类型（normal类型和error类型）的数据：

< MESSAGE TYPE="error" TEXT=" 数据内容" TIME=" + 系统时刻+ / >"
< MESSAGE TYPE="normal" TEXT=" 数据内容" TIME=" + 系统时刻+ / >"

2、Flash客户端

在了解了服务端向客户端发送的数据后，我们来构造本文的核心内容——用Flash客户端来连接服务端，并以不同的颜色及时显示不同类型的数据。

1) 启动Flash MX，通过 File -> New 菜单创建一个新的Flash 文档。

2) 通过 Insert -> Layer 菜单，添加一个层，并把现有的两个层名字分别修改为UI 和 Action ，如图一。其中，Action层是我们统一放程序代码的地方，Flash是一个编程极其灵活的开发工具，可以放置代码的地方非常多，如MovieClip内部、各个祯、按钮等内部都可以放置程序代码(关于代码放置的详细阐述，请参见作者的另一篇文章“Flash 编程规范”)，假如MovieClip嵌套过深的话，这将增加以后维护程序的难度。
所以作者推荐尽可能把程序代码放置在一个统一的位置。

3) 选中 Action层，打开Action面板，切换到专家模式，加入以下注释，如图二：

//Flash创作时对象的初始化

//Flash运行时对象的初始化

//自定义函数

为了以后程序维护的方便，建议尽可能把所有的程序写在一处，象本例中，所有程序都写在Action层中，为了程序的结构清晰，建议用以上注释把整个程序分成几个部分。

4) 选中 UI层，在工具箱选中文本工具，并在属性检查器中设置属性Show Border Around Text为真、文本类型为Dynamic Text（动态文本）、文本为Multiline（多行），在Stage （舞台）上半部分画一个大的文本区域，把其实例名设为 txt。如图三，现在注意到，txt文本域具有了边框和白色背景，我个人不太喜欢白色，能不能改变文本域的背景色呢？

当然能，可以这么说，在Flash MX中，能够看到的都有方法来改变，我们就把txt文本域的背景变成 #BBBBCC颜色吧，请在程序的 [Flash创作时对象的初始化]部分加入下面语句：

txt.backgroundColor = "0xbbbbcc";

通过 Control -> Test Movie 菜单（或 Ctrl + Enter快捷键）预览，您会看到txt文本域的背景已经变成所期望的颜色。

5) 通过 Window -> Componets 菜单，打开Componets（组件）面板，选择ScrollBar组件拖到舞台上的txt文本域上，当释放鼠标时，两者会自动结合，如图五。到属性检查器中，ScrollBar组件的Target TextField属性为 txt ，同时给ScrollBar组件起一个唯一的实例名，如scrollbar ，由于当信息显示满一屏时，需要通过滚动条查看以往的信息，所以需要在程序一开始对scrollbar进行设置以激活它，在程序的 [Flash创作时对象的初始化]部分加入下面语句：

scrollbar.setScrollProperties(10, 10, 20);

6) 从工具箱中选择文本工具，在属性检查器中设置属性Show Border Around Text为真、文本类型为Input Text（输入框文本）、文本为Single Line（单行），在Stage（舞台）上txt文本区域的下面靠左画两个文本域，把其实例名分别设为txtHost和txtPort，如图三：

另外，在属性检查器中，设置txtPort的Maximum Characters（最大长度）为5（因为端口数最大为65535），设置txtPort只能输入数字，我们可以在属性检查器中的Character按钮设置限制，我们这里用ActionScript在运行时设置(也可以在属性检查器中设置)，在程序的 [Flash创作时对象的初始化]部分加入下面语句：

txtPort.restrict = "0-9";
txtPort.onChanged = txtPort_onChanged;

并且设置txtHost的内容为 ”Default Host”， txtPort的内容为 ”6666”。同时， 由于用户在txtPort中键入错误的端口数时，txtPort的背景将变成红色（详见前面输入框 文本（Input Text）的介绍），当用户再次键入时，背景颜色将变回原来的白色，这 txtPort的onChanged事件中得以实现。 7) 从Componets（组件）面板上，选择两个PushButton组件拖到舞台上的txt文本域的下部靠右的位置，水平与前面两个输入框文本对起。

第一个PushButton按钮的实例名设为 btnConnect ，Label（标签）设为 Connect， Click Handler（单击事件处理函数）设为btnConnect_onClick 。第一个PushButton按钮 的实例名设为 btnClear ，Label（标签）设为 Clear，单击事件处理函数设为 btnClear_onClick ，如图四：

通过完成以上的步骤，我们已经建立了Flash客户端的用户界面。现在我们来在程序的第二部分[Flash运行时对象的初始化]中，创建并初始化相应的对象：

myTextFormat = new TextFormat();

socket = new XMLSocket();
socket.onConnect = myOnConnect;
socket.onXML = myOnXML;
socket.onClose = myOnClose;

　　以上语句中，第一条语句生成一个TextFormat（文本样式对象）实例myTextFormat，以达到以不同颜色显示不同类型数据的目的（详见前面动态文本（Dynamic Text）的介绍 ）。接着生成一个XMLSocket对象实例socket，并分别设置其onConnect、onXML、onClose事件的处理函数。

　　以下我们最后只剩下编写各种对象的事件处理函数了，由于在本文的第二部分里，就有关的技术已经做了相当详细的介绍，并且您可以同时参照本文附带的程序源码，为了节省篇幅，这部分将不再做进一步的介绍了，如果您在实际使用中，有问题您可以给我发 E_mail: yz2yz@etang.com。

　　现在程序已经完成了，在您的Web服务器上启动服务端模拟程序，然后通过浏览器连接到相应包含Flash客户端的页面，单击Connect按钮，如果没有其他的意外，您就会看到客户端正常地运行了。如果为了测试的方便，您可以在本地机启动服务端模拟程序，然后通过单独的Flash Player 6来打开，在txtHost中键入“127.0.0.1”，这样您就省了架设Web服务器的麻烦。祝您顺利！