Adobe Flex在Vision DWCS大屏幕顯示控制軟件B/S結(jié)構(gòu)中的應(yīng)用

摘 要： 介紹了大屏幕拼接顯示控制軟件基于C/S結(jié)構(gòu)的模塊組成及其關(guān)系，以及采用Adobe Flex編程實(shí)現(xiàn)B/S結(jié)構(gòu)的方法。Vision DWCS大屏幕顯示控制軟件適合目前各種結(jié)構(gòu)的硬件控制器并對(duì)各類(lèi)矩陣、投影等周邊設(shè)備具有廣泛的支持，各項(xiàng)需求已達(dá)到要求。

關(guān)鍵詞： 大屏幕顯示； C/S結(jié)構(gòu)； B/S結(jié)構(gòu)； RGB數(shù)據(jù)； 視頻數(shù)據(jù)； 媒體流； Adobe Flex； TCP/UDP協(xié)議

中圖分類(lèi)號(hào)： TN711?34 文獻(xiàn)標(biāo)識(shí)碼： A 文章編號(hào)： 1004?373X（2013）13?0164?03

Application of Adobe Flex in B/S structure of Vision DWCS

CHEN Rong?rang

（Aircraft Strength Research Institute of China， Xi’an 710065， China）

Abstract： The module composition and its relationship of the digital wall control system （DWCS） based on the structure of C/S and the method of realizing the B/S structure using Adobe Flex programming are introduced. Vision DWCS is suitable for the hardware controller with all kinds of structure， and has wide support of all kinds of matrix， projection and other peripheral equipment. The requirements have been satisfied.

Keywords： large screen display； C/S structure； B/S structure； RGB data； video data； media stream； Adobe Flex； TCP/UDP

0 概 述

Vision DWCS大屏幕顯示系統(tǒng)管理軟件（Vision Digital Wall Control System）是一套基于硬件的控制軟件，它直接體現(xiàn)一個(gè)大屏幕顯示系統(tǒng)的功能。

Vision DWCS集成了視頻信號(hào)、RGB信號(hào)、網(wǎng)絡(luò)計(jì)算機(jī)信號(hào)和工作站信號(hào)，集成了對(duì)視頻矩陣，RGB矩陣，遠(yuǎn)端攝像機(jī)，控制器，投影機(jī)等的控制與操作，通過(guò)它可以方便的把信號(hào)以窗口的形式在大屏幕顯示墻上顯示出來(lái)，如單屏顯示、任意大小顯示、共屏顯示、跨屏顯示、整屏漫游等；并且可以實(shí)現(xiàn)圖像和信號(hào)的切換，色彩和對(duì)比度的調(diào)節(jié)、預(yù)案顯示等功能；支持網(wǎng)絡(luò)控制，多用戶控制，遠(yuǎn)程異地操作等功能，具備用戶管理，權(quán)限管理，通道管理，遠(yuǎn)程鼠標(biāo)管理等多種管理功能。用戶僅需要在一個(gè)圖形界面下通過(guò)鼠標(biāo)操作就能完成對(duì)大屏的控制。

1 Vision DWCS的系統(tǒng)構(gòu)成

Vision DWCS大屏幕顯示控制軟件系統(tǒng)以模塊方式構(gòu)成，系統(tǒng)拓?fù)鋱D如圖1所示。

<＼＼192.168.0.25＼$d＼8月＼8-2＼補(bǔ)＼補(bǔ)！現(xiàn)代電子技術(shù)201313＼Image＼38t1.tif>

圖1 Vision WDCS系統(tǒng)拓?fù)鋱D

系統(tǒng)模塊分別為：

VIEW AGENT： Vision DWCS的服務(wù)模塊Viewagent，面向控制器，負(fù)責(zé)開(kāi)關(guān)窗口，通道操作等。該模塊位于控制器上，接收SYSTEM MANAGER發(fā)來(lái)的操縱命令，在大屏上相應(yīng)位置繪制窗口，切換輸入信號(hào)到窗口顯示出來(lái)。

SYSTEM MANAGER： Vision DWCS的一個(gè)服務(wù)模塊Sysmanager，面向VIEW AGENT，集成用戶命令，位于主控計(jì)算機(jī)上。它接收來(lái)自于各個(gè)用戶（OPERATOR）的操作命令，分類(lèi)解析，單獨(dú)傳送到大屏控制器。另外，大屏系統(tǒng)的所有信息，如遠(yuǎn)端攝像機(jī)，視頻矩陣，RGB矩陣，VGA信號(hào)，網(wǎng)絡(luò)信號(hào)，用戶信息等，都可以在此進(jìn)行詳細(xì)設(shè)置。對(duì)于每套系統(tǒng)，只單獨(dú)配置一份SYSTEM MANAGER，就可以讓多用戶同時(shí)操作大屏。

OPERATOR： Vision DWCS的客戶模塊，面向的是SYSTEM MANAGER，模擬大屏，用戶在此完成對(duì)大屏的操作。該軟件模塊基于TCP/IP方式，在大屏上實(shí)時(shí)顯示窗口信息（窗口大小，種類(lèi)，信號(hào)類(lèi)型，通道等）。

SCLIENT： Vision DWCS的Windows網(wǎng)絡(luò)顯示服務(wù)模塊。安裝于各個(gè)計(jì)算機(jī)上，采用TCP/IP方式，將PC機(jī)的顯示信號(hào)通過(guò)網(wǎng)絡(luò)上傳到控制器進(jìn)行顯示。該軟件拋棄了傳統(tǒng)的“拷屏——壓縮——傳輸——解壓——顯示”的網(wǎng)絡(luò)拷屏技術(shù)而采用WINDOWS HOOK動(dòng)態(tài)檢測(cè)技術(shù)，實(shí)時(shí)監(jiān)測(cè)屏幕上變化的部分并傳送該部分，使得系統(tǒng)資源占用最低，速度最快。

2 采用Adobe Flex技術(shù)Vision DWCS B/S結(jié)

構(gòu)的系統(tǒng)實(shí)現(xiàn)

B/S結(jié)構(gòu)是相對(duì)于C/S結(jié)構(gòu)而言的。C/S結(jié)構(gòu)，即Client/Server（客戶機(jī)/服務(wù)器）結(jié)構(gòu)，是大家熟知的軟件系統(tǒng)體系結(jié)構(gòu)，比如MSN，QQ，Outlook就屬于C/S結(jié)構(gòu)。

B/S結(jié)構(gòu)，即Browser/Server（瀏覽器/服務(wù)器）結(jié)構(gòu)，是隨著Internet技術(shù)的發(fā)展，對(duì)C/S結(jié)構(gòu)的一種變化或者改進(jìn)的結(jié)構(gòu)。在這種結(jié)構(gòu)下，用戶接口完全通過(guò)WWW瀏覽器實(shí)現(xiàn)，一部分事務(wù)邏輯在前端實(shí)現(xiàn)，但是主要事務(wù)邏輯在服務(wù)器端實(shí)現(xiàn)，形成所謂3?tier結(jié)構(gòu)。B/S結(jié)構(gòu)利用不斷成熟和普及的瀏覽器技術(shù)實(shí)現(xiàn)原來(lái)需要復(fù)雜專(zhuān)用軟件才能實(shí)現(xiàn)的強(qiáng)大功能，相較于C/S結(jié)構(gòu)開(kāi)發(fā)，B/S開(kāi)發(fā)節(jié)約成本，方便使用，已成為當(dāng)今應(yīng)用軟件的首選體系結(jié)構(gòu)。

在大屏控制軟件Vision DWCS B/S結(jié)構(gòu)設(shè)計(jì)方案中，選擇一種適合的B/S開(kāi)發(fā)平臺(tái)和技術(shù)至關(guān)重要。經(jīng)過(guò)反復(fù)的比較、測(cè)試，最終采用了Adobe Flex的Web應(yīng)用程序作為Vision DWCS B/S結(jié)構(gòu)的客戶端方案。

Adobe Flex是用于構(gòu)建和維護(hù)在所有主要瀏覽器、桌面和操作系統(tǒng)一致地部署的極具表現(xiàn)力的Web應(yīng)用程序的高效率的開(kāi)放源碼框架。該技術(shù)提供了一個(gè)新的、基于標(biāo)準(zhǔn)的語(yǔ)言和編程模型，其編程模型支持常用的設(shè)計(jì)模式，能夠使企業(yè)創(chuàng)建許多有吸引力的、交互的快速應(yīng)用，這些應(yīng)用會(huì)戲劇性的增強(qiáng)用戶的體驗(yàn)、增加客戶的滿意度和用戶的工作效率。傳統(tǒng)的Web開(kāi)發(fā)，在表現(xiàn)層次受到非常大的約束，F(xiàn)lex技術(shù)不僅輕松解決了所有表現(xiàn)層的技術(shù)問(wèn)題，讓客戶感受前所未有的Web應(yīng)用體驗(yàn)。更主要的是，基與Flash AS 3.0的純面向?qū)ο蠛徒M件的構(gòu)架，讓B/S結(jié)構(gòu)表現(xiàn)層的開(kāi)發(fā)層次分明，結(jié)構(gòu)完整協(xié)調(diào)，在提供強(qiáng)大華麗表現(xiàn)的同時(shí)，大大節(jié)約維護(hù)成本。

Vision DWCS的B/S結(jié)構(gòu)系統(tǒng)包含兩個(gè)部分：Web應(yīng)用客戶端（Flex App）和Web應(yīng)用服務(wù)器（Flex Server）。其中，Web應(yīng)用客戶端是實(shí)現(xiàn)用戶操作的Flash客戶端應(yīng)用。Flex App主要是一個(gè)Flash程序文件，配合相關(guān)的動(dòng)態(tài)網(wǎng)頁(yè)等配置文件，通過(guò)IIS或其他Http服務(wù)器部署在局域網(wǎng)內(nèi)。由于Flex App本身就是標(biāo)準(zhǔn)的Web應(yīng)用程序，所以部署起來(lái)和通常的網(wǎng)頁(yè)部署完全一致，無(wú)需額外的配置，因而十分簡(jiǎn)單，易于操作。Web應(yīng)用服務(wù)器是標(biāo)準(zhǔn)的Window開(kāi)發(fā)的程序文件，從用戶命令的數(shù)據(jù)流來(lái)看，介于客戶端Flex App和Sysmanager之間，主要實(shí)現(xiàn)數(shù)據(jù)的中間轉(zhuǎn)發(fā)和系統(tǒng)設(shè)置管理。

用戶通過(guò)使用IE，F(xiàn)irefox等網(wǎng)頁(yè)瀏覽器，進(jìn)行大屏幕的控制管理，Web客戶端的操作命令通過(guò)網(wǎng)絡(luò)TCP協(xié)議發(fā)送至Flex Server，需要轉(zhuǎn)發(fā)的命令就轉(zhuǎn)發(fā)給Sysmanager，由Sysmanager處理后送達(dá)VIEW AGENT，實(shí)現(xiàn)對(duì)大屏幕系統(tǒng)的最終控制。同樣，Sysmanager發(fā)回客戶端的數(shù)據(jù)經(jīng)過(guò)Flex Server又回傳給用戶。

Vision DWCS B/S結(jié)構(gòu)軟件的架構(gòu)如圖2所示，箭頭表示了用戶操作指令的數(shù)據(jù)流向。

<＼＼192.168.0.25＼$d＼8月＼8-2＼補(bǔ)＼補(bǔ)！現(xiàn)代電子技術(shù)201313＼Image＼38t2.tif>

圖2 Vision DWCS基于B/S結(jié)構(gòu)的數(shù)據(jù)流向

以下就是利用Flex技術(shù)開(kāi)發(fā)的OPERATOR客戶端界面，如圖3所示，定義方法如圖4所示。客戶端的界面布局跟原有的C/S版軟件基本一致。界面的上端是傳統(tǒng)的操作主菜單；左側(cè)包含了信號(hào)源列表，預(yù)案管理列表，羅列了當(dāng)前可用的信號(hào)源和用戶的預(yù)案配置；中間的區(qū)域是大屏系統(tǒng)管理的可視操作界面，包括了開(kāi)窗，關(guān)窗，窗口移動(dòng)等一系列的功能；頁(yè)面下端包含了當(dāng)前系統(tǒng)狀態(tài)的信息提示和狀態(tài)欄。

相比較原有的C/S結(jié)構(gòu)，一個(gè)最明顯的不同，也是B/S結(jié)構(gòu)最大的優(yōu)勢(shì)，就是B/S的Web客戶端是基于網(wǎng)頁(yè)瀏覽器訪問(wèn)的。原有的客戶端軟件需要進(jìn)行軟件的安裝、部署，而B(niǎo)/S版的控制軟件根本沒(méi)有客戶端的安裝文件，用戶只需在IE，F(xiàn)irefox等瀏覽器中輸入服務(wù)器的IP訪問(wèn)即可打開(kāi)大屏控制軟件的接口，隨后就可以使用Web瀏覽器隨時(shí)隨地對(duì)大屏幕管理調(diào)度，甚至可以實(shí)現(xiàn)Internet廣域網(wǎng)的自由調(diào)度控制。

<＼＼192.168.0.25＼$d＼8月＼8-2＼補(bǔ)＼補(bǔ)！現(xiàn)代電子技術(shù)201313＼Image＼38t3.tif>

圖3 2×2拼接的控制操作界面

<＼＼192.168.0.25＼$d＼8月＼8-2＼補(bǔ)＼補(bǔ)！現(xiàn)代電子技術(shù)201313＼Image＼38t4.tif>

圖4 2×2拼接的定義方法

由于Adobe Flex技術(shù)基于Adobe的Flash播放平臺(tái)，而Flash Player是目前世界上最為廣泛流行的跨平臺(tái)的瀏覽器插件，支持Windows 2000/2003/XP/Vista所有32位/64位操作系統(tǒng)，同時(shí)也有Linux，Mac?OS，Solaris的版本。這就意味著B(niǎo)/S的客戶端可以在以上操作系統(tǒng)中使用，具有了跨平臺(tái)的優(yōu)點(diǎn)，用戶可以有更多的選擇。

在系統(tǒng)后期的升級(jí)維護(hù)方面，B/S結(jié)構(gòu)的軟件也有許多優(yōu)勢(shì)。傳統(tǒng)的C/S客戶端需要安裝專(zhuān)用的客戶端軟件，特別是如果有很多客戶端的情況，工作量就會(huì)很大。還有，當(dāng)系統(tǒng)軟件升級(jí)，或者受到病毒感染時(shí)，每一臺(tái)客戶機(jī)需要重新安裝，其維護(hù)和升級(jí)成本非常高。而B(niǎo)/S結(jié)構(gòu)這種“零安裝”的特點(diǎn)大大降低了客戶端的維護(hù)成本。系統(tǒng)架構(gòu)于Web技術(shù)之上，運(yùn)行穩(wěn)定，只要能上網(wǎng)，再由系統(tǒng)管理員分配一個(gè)用戶名和密碼，就可以使用了。同時(shí)便于后期升級(jí)維護(hù)：即只需升級(jí)Web服務(wù)器一端的軟件即可實(shí)現(xiàn)整體系統(tǒng)的升級(jí)，客戶終端用戶無(wú)須考慮版本升級(jí)所帶來(lái)的影響，客戶端零維護(hù)。

從用戶使用的習(xí)慣上，B/S客戶端最大程度地保留了原有C/S客戶端OPERATOR的操作，繼承了原有設(shè)計(jì)對(duì)于大屏開(kāi)窗，關(guān)窗，移動(dòng)窗口，改變窗口大小等通用性的操作模式，包含了用戶主菜單，右鍵菜單，用戶提示Tooltip，操作日志等友好的操作接口，不管是新用戶還是原來(lái)使用過(guò)C/S版軟件的用戶，都可以很快速、方便的了解和使用B/S版軟件進(jìn)行大屏的操作控制。

在數(shù)據(jù)的通信方面，B/S的客戶端Flex App同服務(wù)端Flex Server之間通過(guò)TCP/IP協(xié)議進(jìn)行網(wǎng)絡(luò)通信。Flex Server作為客戶端與原有系統(tǒng)通信的中繼系統(tǒng)，同時(shí)負(fù)責(zé)用戶數(shù)據(jù)的在線保存功能。Flex Server自動(dòng)嘗試建立與原有C/S服務(wù)管理軟件Sysmanager的通信連接，同時(shí)監(jiān)控來(lái)自Web客戶端的用戶連接。用戶發(fā)送的指令和連接狀態(tài)都有完整的日志記錄，方便用戶查詢。Flex Server整個(gè)過(guò)程無(wú)需人員操作，屬于無(wú)人職守的服務(wù)器軟件。

可以看出，F(xiàn)lex Server其實(shí)就是一個(gè)中間層的構(gòu)件。從技術(shù)層面，B/S客戶端完全可以直接和Sysmanager進(jìn)行直接通信，無(wú)需Flex Server在中間進(jìn)行數(shù)據(jù)的轉(zhuǎn)發(fā)服務(wù)。需要Flex Server的原因是：一方面，由于在一般的B/S應(yīng)用中，用戶的自身數(shù)據(jù)需要保存在服務(wù)器端，這就需要一個(gè)軟件作為服務(wù)器，進(jìn)行相應(yīng)的數(shù)據(jù)存儲(chǔ)維護(hù)服務(wù)；另一方面，一些計(jì)算量大的任務(wù)不宜放在用戶端進(jìn)行，而需要在服務(wù)器端執(zhí)行；因此，才有了Flex Server這樣的中間層設(shè)計(jì)。這樣做的好處是：第一，避免了讓Sysmanager承擔(dān)的功能過(guò)于復(fù)雜與繁重，符合軟件工程的設(shè)計(jì)理念；第二，在不改動(dòng)原有C/S系統(tǒng)的基礎(chǔ)上完成了B/S軟件的數(shù)據(jù)傳輸通信，降低了系統(tǒng)之間的耦合，縮短了開(kāi)發(fā)周期；第三，系統(tǒng)各個(gè)部分職責(zé)明確，便于以后的系統(tǒng)調(diào)試、升級(jí)，降低了維護(hù)成本。

以下是Flex Server的操作界面，如圖5所示。

Flex Server界面主要包含了主菜單、工具條、系統(tǒng)狀態(tài)記錄、任務(wù)欄幾個(gè)主要部分。工具條的按鈕主要包含了開(kāi)啟服務(wù)、關(guān)閉服務(wù)、清空記錄、刷新客戶連接等。狀態(tài)欄包含了和Sysmanager的連接狀態(tài)以及當(dāng)前連接的用戶數(shù)量等信息。

<＼＼192.168.0.25＼$d＼8月＼8-2＼補(bǔ)＼補(bǔ)！現(xiàn)代電子技術(shù)201313＼Image＼38t5.tif>

圖5 Flex Server界面

同時(shí)，基于Web應(yīng)用程序的特點(diǎn)和方便用戶的角度出發(fā)，B/S結(jié)構(gòu)軟件也對(duì)原有C/S版軟件進(jìn)行了一些改動(dòng)，包括用戶操作界面，用戶配置信息管理等方面，使得軟件的風(fēng)格更加緊湊，功能設(shè)置也更加集中，方便用戶操作。

目前，Vision DWCS B/S版大屏幕控制軟件已經(jīng)廣泛應(yīng)用于各類(lèi)大屏幕顯示控制系統(tǒng)中，并取得了良好的應(yīng)用效果。

3 結(jié) 論

由于大屏幕拼接顯示控制軟件是一個(gè)相對(duì)復(fù)雜的調(diào)度系統(tǒng)，其用戶端操作包含大量的窗口信息、信號(hào)信息和設(shè)備信息，由C/S結(jié)構(gòu)轉(zhuǎn)換成B/S結(jié)構(gòu)，采用一般的Web編程技術(shù)難以實(shí)現(xiàn)，而采用Adobe Flex技術(shù)則可以支持相對(duì)復(fù)雜的B/S應(yīng)用。通過(guò)Vision DWCS B/S版本的Adobe Flex編程實(shí)現(xiàn)，說(shuō)明了Adobe Flex的技術(shù)特點(diǎn)。Adobe Flex使得B/S結(jié)構(gòu)實(shí)現(xiàn)、構(gòu)建簡(jiǎn)單、快捷方便，且可以實(shí)現(xiàn)相對(duì)復(fù)雜的系統(tǒng)應(yīng)用。

參考文獻(xiàn)

[1] Microsoft公司.Windows核心編程[M].USA：Microsoft公司，2002.

[2] 張靜，梁澍.Windows多媒體編程基礎(chǔ)[M].北京：清華大學(xué)出版社，2005.

[3] Microsoft公司.Windows網(wǎng)絡(luò)編程[M].USA：Microsoft公司，2002.

[4] 楊淑瑩.VC++圖像處理程序設(shè)計(jì)[M].2版.北京：清華大學(xué)出版社，2006.

[5] Microsoft公司.VC++6.0中文版程序員開(kāi)發(fā)指南[M].USA：Microsoft公司，2002.

[6] [美]孫晗波.Adobe Flex 3程序設(shè)計(jì)指南[M].北京：電子工業(yè)出版社，2009.

[7] [美] TRETOLA Rich，BARBER Simon，ERICKSON Renaun. Adobe Flex高級(jí)編程[M].郝剛，袁永剛，譯.北京：人民郵電出版社，2008.