《電子技術(shù)應(yīng)用》
您所在的位置:首頁(yè) > 通信與網(wǎng)絡(luò) > 設(shè)計(jì)應(yīng)用 > 可視化表單平臺(tái)的研究與實(shí)現(xiàn)
可視化表單平臺(tái)的研究與實(shí)現(xiàn)
2015《電子技術(shù)應(yīng)用》智能電網(wǎng)增刊
王國(guó)娟,羅 浩,李 猛
(北京中電普華信息技術(shù)有限公司, 北京 100192)
摘要: 針對(duì)Web應(yīng)用在開(kāi)發(fā)過(guò)程中具有表單定制繁瑣、需求變化頻繁、后期維護(hù)難度大等問(wèn)題,提出一種可視化的表單平臺(tái),服務(wù)于軟件開(kāi)發(fā)的全生命周期,做到對(duì)需求變更、軟件實(shí)現(xiàn)的快速響應(yīng),實(shí)現(xiàn)軟件開(kāi)發(fā)過(guò)程中的快速開(kāi)發(fā),同時(shí)對(duì)表單平臺(tái)的整體架構(gòu)、建模設(shè)計(jì)、流程集成、提出了設(shè)計(jì)和實(shí)現(xiàn)思路。
Abstract:
Key words :

  王國(guó)娟,羅   浩,李   猛

  (北京中電普華信息技術(shù)有限公司, 北京 100192)

  摘  要: 針對(duì)Web應(yīng)用在開(kāi)發(fā)過(guò)程中具有表單定制繁瑣、需求變化頻繁、后期維護(hù)難度大等問(wèn)題,提出一種可視化的表單平臺(tái),服務(wù)于軟件開(kāi)發(fā)的全生命周期,做到對(duì)需求變更、軟件實(shí)現(xiàn)的快速響應(yīng),實(shí)現(xiàn)軟件開(kāi)發(fā)過(guò)程中的快速開(kāi)發(fā),同時(shí)對(duì)表單平臺(tái)的整體架構(gòu)、建模設(shè)計(jì)、流程集成、提出了設(shè)計(jì)和實(shí)現(xiàn)思路。

  關(guān)鍵詞: Web應(yīng)用;流程集成;可視化建模;版本控制;表單元件

0 引言

  目前,Web系統(tǒng)[1]廣泛應(yīng)用于社會(huì)各個(gè)行業(yè),尤其是在信息化管理方面,對(duì)各個(gè)行業(yè)的信息管理產(chǎn)生了舉足輕重的作用,但是Web應(yīng)用又因?yàn)槠渥陨淼奶攸c(diǎn),存在需求變化頻繁,前端界面表單樣式、元件布局等修改頻繁,占用了大量的軟件開(kāi)發(fā)時(shí)間,造成項(xiàng)目建設(shè)的資源浪費(fèi),因此,軟件行業(yè)迫切需要解決在前端界面的設(shè)計(jì)、開(kāi)發(fā)、維護(hù)上能夠縮短工期的問(wèn)題,實(shí)現(xiàn)軟件開(kāi)發(fā)中表單快速開(kāi)發(fā),從而使研發(fā)人員的著重點(diǎn)從簡(jiǎn)單而繁瑣的表單界面上解放出來(lái),轉(zhuǎn)到對(duì)業(yè)務(wù)邏輯的具體實(shí)現(xiàn)上。

  目前,市面上存在著眾多表單設(shè)計(jì)器或快速開(kāi)發(fā)平臺(tái)等產(chǎn)品,但是往往只是在快速生成、數(shù)據(jù)庫(kù)建模等單一的著重點(diǎn)進(jìn)行考慮,筆者認(rèn)為一款表單平臺(tái)不能僅僅滿足界面的快速開(kāi)發(fā)的單一功能,還需要在可視化開(kāi)發(fā)、流程集成、擴(kuò)展性等多個(gè)方面進(jìn)行綜合考慮,本文就開(kāi)發(fā)一款可視化表單平臺(tái)進(jìn)行詳細(xì)研究和實(shí)現(xiàn)。

1 相關(guān)定義

  1.1 表單[2-3]

  表單是一個(gè)應(yīng)用系統(tǒng)呈現(xiàn)數(shù)據(jù)給用戶,并實(shí)現(xiàn)和用戶交互的窗口,因此本文中對(duì)所有在Web應(yīng)用中展示給用戶的前端界面統(tǒng)稱(chēng)為表單。在本文中,表單的制作完全是通過(guò)平臺(tái)提供的建模工具,采用的元件拖拽所見(jiàn)即所得的方式來(lái)實(shí)現(xiàn),可以方便快捷制作一個(gè)表單,并保證所制作表的樣式統(tǒng)一。

  1.2 表單元件[3]

  在本文中對(duì)呈現(xiàn)在表單中的展示內(nèi)容,例如:?jiǎn)涡形谋?、多行文本、下拉框等統(tǒng)稱(chēng)為表單元件,為了更好的細(xì)化和區(qū)分,本平臺(tái)對(duì)元件進(jìn)行分為靜態(tài)元件和動(dòng)態(tài)元件兩大類(lèi)。

  靜態(tài)元件:僅用于表單裝飾、布局,不需要用戶輸入輸出,不存在后臺(tái)數(shù)據(jù)庫(kù)交互的一類(lèi)元件,例如:線、矩形、圓、靜態(tài)圖片等。

  動(dòng)態(tài)元件:需要同后臺(tái)數(shù)據(jù)庫(kù)交互數(shù)據(jù),用于數(shù)據(jù)的展示等功能性元件,例如:?jiǎn)涡形谋?、多行文本、下拉框等?/p>

2 可視化表單平臺(tái)設(shè)計(jì)[3-4]

  平臺(tái)總體結(jié)構(gòu)由四部分組成:通用功能組件、原型庫(kù)、表單互動(dòng)化定制、流程互動(dòng)化定制。開(kāi)發(fā)人員或用戶通過(guò)建模工具完成表單和流程的對(duì)象模型定制,定制過(guò)程中采用平臺(tái)提供的通用功能組件,并復(fù)用原型庫(kù)中系統(tǒng)原型。在和用戶交流時(shí),模型解析器解析并顯示已完成定制的對(duì)象模型。其總體結(jié)構(gòu)如圖1所示。

001.jpg

  平臺(tái)用戶通過(guò)訪問(wèn)建模工具,采用“拖拉拽”的方式設(shè)計(jì)開(kāi)發(fā)業(yè)務(wù)表單和業(yè)務(wù)流程,同時(shí)生成表單和流程對(duì)象模型[3],系統(tǒng)將對(duì)象模型發(fā)送到后臺(tái)持久化到數(shù)據(jù)庫(kù)中。在需要瀏覽表單或流程時(shí),觸發(fā)后臺(tái)的模型解析器(Java實(shí)現(xiàn))[4],解析器根據(jù)數(shù)據(jù)庫(kù)中的對(duì)象模型結(jié)合平臺(tái)的開(kāi)發(fā)框架(MVC)[5-6]和組件庫(kù)生成Html/CSS/JS文件[7],最后顯示到客戶瀏覽器中。 其運(yùn)行視圖如圖2所示。

002.jpg

  采用面向?qū)ο蟮乃枷牒头椒?,將所管理的事物都視為?duì)象,唯種類(lèi)不同而已。這些對(duì)象主要包括:表、表關(guān)系、表單、圖形等。建模的過(guò)程也就是定義這些對(duì)象屬性的過(guò)程,并將所定義的對(duì)象屬性保存到數(shù)據(jù)庫(kù)中。系統(tǒng)運(yùn)行時(shí)通過(guò)讀取屬性數(shù)據(jù)將對(duì)象實(shí)例化后展示。

  將常見(jiàn)的頁(yè)面類(lèi)型(例如:樹(shù)、表格、單表記錄維護(hù)表單)做成頁(yè)面域模板,形成展現(xiàn)視圖庫(kù),視圖庫(kù)中的模板已經(jīng)封裝好常用功能。在使用時(shí),通過(guò)對(duì)象模型的屬性數(shù)據(jù)以及頁(yè)面域的類(lèi)型,模型解析器引用模板自動(dòng)生成其頁(yè)面域的內(nèi)容,并提供常用功能。表單自動(dòng)生成視圖如圖3所示。

003.jpg

  業(yè)務(wù)系統(tǒng)在需求分析、業(yè)務(wù)設(shè)計(jì)、原型開(kāi)發(fā)、用戶確認(rèn)四個(gè)階段都可以由用戶參與,在此過(guò)程中,用戶可以隨時(shí)查看開(kāi)發(fā)原型的功能和界面,指出其中不符合業(yè)務(wù)需求的地方,也可以親自設(shè)計(jì)開(kāi)發(fā)原型。其使用過(guò)程視圖如圖4。

004.jpg

3 平臺(tái)關(guān)鍵功能設(shè)計(jì)與實(shí)現(xiàn)

  3.1可視化表單存儲(chǔ)及版本控制

  可視化界面編輯器采用VC++進(jìn)行研發(fā),采用ActiveX控件形式嵌入到業(yè)務(wù)系統(tǒng)中,此種方式在日常使用大幅度降低環(huán)境部署安裝復(fù)雜度,做到使用者可以在線進(jìn)行編輯表單。為了實(shí)現(xiàn)在線進(jìn)行及時(shí)編輯表單的功能,需要對(duì)表單編輯數(shù)據(jù)的存儲(chǔ)及表單的版本控制等關(guān)鍵功能問(wèn)題研究并解決。

  3.1.1 表單模板及運(yùn)行時(shí)數(shù)據(jù)存儲(chǔ)

  本平臺(tái)表單模板內(nèi)容直接存放在數(shù)據(jù)庫(kù)中,此種存儲(chǔ)方式的主要原因是:實(shí)現(xiàn)表單快速的修改,在無(wú)需啟停服務(wù)的情況實(shí)現(xiàn)頁(yè)面的修改后直接在線試用,達(dá)到應(yīng)用修改的零延時(shí)[8]。

  針對(duì)表單模板及其元件的存儲(chǔ),在設(shè)計(jì)上主要涉及到兩張表,一為表單模板基本信息表,主要為表單的創(chuàng)建信息,表單關(guān)聯(lián)業(yè)務(wù)表信息,表單版本信息;二為表單的元件編輯信息,主要為表單元件的位置、樹(shù)形、權(quán)限、數(shù)據(jù)庫(kù)字段綁定等信息,在此設(shè)計(jì)中,重點(diǎn)考慮表單元件的共性屬性,并提取完備,在可視化界面中進(jìn)行固化綁定設(shè)置,表單元件的位置、大小、樣式、運(yùn)行時(shí)存取的元件字段信息均在元件模板表中進(jìn)行一一存放,為了進(jìn)行用戶級(jí)擴(kuò)展,增加用戶自定義信息等維護(hù)入口。為后續(xù)的表單展示引擎讀取提供方便,甚至為以后的系統(tǒng)集成擴(kuò)展提供便利。

  在表單模板設(shè)計(jì)的基礎(chǔ)上,表單平臺(tái)對(duì)業(yè)務(wù)數(shù)據(jù)的存取進(jìn)行自動(dòng)化設(shè)計(jì),即用戶編輯表單過(guò)程中進(jìn)行業(yè)務(wù)數(shù)據(jù)的數(shù)據(jù)庫(kù)存取對(duì)應(yīng)關(guān)系設(shè)置,并完成平臺(tái)級(jí)的統(tǒng)一管理和維護(hù),通過(guò)平臺(tái)的業(yè)務(wù)數(shù)據(jù)表自動(dòng)生成機(jī)制,按照模板信息中的動(dòng)態(tài)元件內(nèi)容,自動(dòng)初始化數(shù)據(jù)庫(kù)表結(jié)構(gòu),同時(shí)綁定表單同數(shù)據(jù)庫(kù)物理表,表單元件同物理表字段的對(duì)應(yīng)關(guān)系,極大降低用戶進(jìn)行重復(fù)開(kāi)發(fā)運(yùn)維的難度和復(fù)雜度。

  3.1.2 表單版本控制

  表單編輯的版本控制方法:由于保障表單的在線編輯,同時(shí)表單信息直接存儲(chǔ)于數(shù)據(jù)庫(kù)層,可以直接生效,因此在實(shí)際使用中難免會(huì)表單編輯中出現(xiàn)操作錯(cuò)誤,因此表單編輯必然要求版本可以追溯,表單編輯驗(yàn)證后方能進(jìn)行發(fā)布使用,因此表單編輯信息分為兩個(gè)類(lèi)別存儲(chǔ),一為編輯修改過(guò)程中的開(kāi)發(fā)版,另一個(gè)為編輯發(fā)布后的運(yùn)行版,同時(shí)兩個(gè)版本的編輯前后、發(fā)布前后,均保存完整的歷史版本,便于歷史版本追溯。

  表單編輯的并行開(kāi)發(fā)問(wèn)題:由于表單編輯直接對(duì)所有編輯人員開(kāi)放,在解決了版本控制的基礎(chǔ)上需要解決多人同時(shí)編輯頁(yè)面的問(wèn)題,目前平臺(tái)采取為搶占式編輯模式,即當(dāng)前的指定版本僅允許一人編輯,編輯前采取簽出操作,鎖定為當(dāng)前人可修改,其他人等待此用戶編輯后方能進(jìn)行二次編輯,此方案可以有效解決在并行開(kāi)發(fā)過(guò)程中多人同時(shí)修改界面造成的覆蓋問(wèn)題,同時(shí)開(kāi)發(fā)過(guò)程中任務(wù)往往相對(duì)清晰,不會(huì)對(duì)并行研發(fā)造成進(jìn)度緩慢問(wèn)題。

  3.2 流程引擎集成

  由于目前的很多業(yè)務(wù)表單設(shè)計(jì)平臺(tái)僅實(shí)現(xiàn)了基本的表單設(shè)計(jì)和展示功能,沒(méi)有就表單平臺(tái)和流程引擎平臺(tái)的集成功能進(jìn)行設(shè)計(jì),造成了目前眾多表單平臺(tái)和流程引擎的集成困難,筆者認(rèn)為可視化表單平臺(tái)不僅僅要實(shí)現(xiàn)表單的編輯功能,同時(shí)應(yīng)該在流程集成上進(jìn)行充分考慮,表單同流程集成過(guò)程主要涉及兩個(gè)方面的關(guān)鍵問(wèn)題,第一是流程實(shí)例運(yùn)行過(guò)程中的表單元件權(quán)限控制問(wèn)題,第二是表單元件數(shù)據(jù)同流程參數(shù)映射問(wèn)題,只有解決了這兩個(gè)核心問(wèn)題,才能真正實(shí)現(xiàn)表單同流程的集成工作。

  3.2.1流程集成體系設(shè)計(jì)

  表單同流程集成[9]過(guò)程主要集中在表單(流程)建模、表單綁定、權(quán)限設(shè)置、參數(shù)映射、運(yùn)行控制幾個(gè)環(huán)節(jié)。集成的主要環(huán)節(jié)內(nèi)容如下:

 ?。?)表單(流程)建模:二者分別按照設(shè)定的標(biāo)準(zhǔn)和規(guī)范進(jìn)行數(shù)據(jù)建模,并實(shí)現(xiàn)二者的獨(dú)立運(yùn)行。

  (2)流程模板同表單模板的業(yè)務(wù)綁定:主要設(shè)置流程中各個(gè)業(yè)務(wù)環(huán)節(jié)處理過(guò)程中的表單展示頁(yè)面,實(shí)現(xiàn)流程實(shí)例運(yùn)行過(guò)程中的頁(yè)面展示[10]。

 ?。?)權(quán)限控制設(shè)置:設(shè)計(jì)流程各個(gè)業(yè)務(wù)環(huán)節(jié)中表單的元件展示權(quán)限,包括:可編輯、可讀、不可見(jiàn)等。

 ?。?)流程參數(shù)映射:設(shè)置流程流轉(zhuǎn)過(guò)程需要的業(yè)務(wù)參數(shù)變量,并同業(yè)務(wù)表單元件值進(jìn)行映射對(duì)應(yīng),實(shí)現(xiàn)表單創(chuàng)建、提交等操作過(guò)程中隊(duì)流程參數(shù)的映射、賦值功能。

  (5)運(yùn)行時(shí)控制:運(yùn)行時(shí)由流程引擎進(jìn)行控制表單的訪問(wèn)入口,查詢對(duì)應(yīng)的表單文件,并進(jìn)行表單運(yùn)行呈現(xiàn),同時(shí)進(jìn)行表單的權(quán)限控制操作。

  3.2.2 流程參數(shù)映射操作過(guò)程

  流程實(shí)例中的流程參數(shù)賦值時(shí)機(jī)主要在流程創(chuàng)建和提交環(huán)節(jié),二者的操作機(jī)制是相通的,在流程的創(chuàng)建和提交環(huán)節(jié)過(guò)程中,由表單平臺(tái)發(fā)起操作過(guò)程,首先檢查流程引擎同表單的參數(shù)映射關(guān)系,延后統(tǒng)一封裝表單中的元件數(shù)據(jù)為統(tǒng)一格式,提交到流程引擎中,流程引擎接收數(shù)據(jù)并寫(xiě)入具體的流程參數(shù),完成流程實(shí)例運(yùn)行時(shí)的業(yè)務(wù)判定[11]。流程參數(shù)的整個(gè)映射操作過(guò)程發(fā)生流程實(shí)例的所有操作(不含流程實(shí)例的創(chuàng)建)之前,為流程實(shí)例的分支判定等內(nèi)容提供必要的數(shù)據(jù)來(lái)源,整個(gè)操作過(guò)程的流程如圖5所示。

005.jpg

  經(jīng)過(guò)以上映射過(guò)程,可以實(shí)現(xiàn)流程實(shí)例中流程參數(shù)的及時(shí)賦值和修改,保證流程實(shí)例進(jìn)行必要的分支流轉(zhuǎn)和條件判定。

4 可視化表單平臺(tái)的實(shí)現(xiàn)

  按照以上的設(shè)計(jì)體系和關(guān)鍵技術(shù)的研究,筆者實(shí)現(xiàn)了J2EE環(huán)境下的可視化表單平臺(tái)的研發(fā)工作,該平臺(tái)是集表單設(shè)計(jì)建模、權(quán)限控制、流程集成、統(tǒng)一展示運(yùn)行為一體的快速開(kāi)發(fā)平臺(tái),極大地解決了目前J2EE環(huán)境下軟件開(kāi)發(fā)的效率問(wèn)題,并成功的應(yīng)用于二十余個(gè)中小型項(xiàng)目的建設(shè),為項(xiàng)目建設(shè)過(guò)程降低了大量研發(fā)時(shí)間,有效的加快了項(xiàng)目建設(shè)進(jìn)度。

  可視化表單平臺(tái)的在快速建模上完全實(shí)現(xiàn)所見(jiàn)即所得,研發(fā)過(guò)程中的表單編輯工作量明顯降低,表單建模界面如圖6所示。

006.jpg

  表單建模之后的流程集成工作亦采用可視化操作風(fēng)格,并實(shí)現(xiàn)流程節(jié)點(diǎn)的表單元件控制集成,有效解決了表單元件的權(quán)限控制和流程過(guò)程權(quán)限控制的統(tǒng)一,流程集成操作界面及最終表單運(yùn)行時(shí)顯示狀態(tài)如圖7、圖8所示。

5 結(jié)語(yǔ)

  為了解決Web應(yīng)用在表單界面研發(fā)方面的嚴(yán)重不足,本文結(jié)合當(dāng)前Web表單頁(yè)面展示中的基本原理,在ActiveX控件可視化技術(shù)及J2EE環(huán)境下給出了可視化表單平臺(tái)的設(shè)計(jì)和實(shí)現(xiàn)思路。通過(guò)實(shí)踐證明了該表單平臺(tái)可以在項(xiàng)目生命周期的多個(gè)環(huán)節(jié)提供快速建設(shè)保障:

 ?。?)需求階段:需求討論中快速搭建原型,進(jìn)行系統(tǒng)原型確認(rèn),原型可以直接保留指導(dǎo)下一步設(shè)計(jì)研發(fā),需求階段界面可以直接被研發(fā)階段借鑒使用;

 ?。?)設(shè)計(jì)階段:底層技術(shù)架構(gòu)在表單平臺(tái)上進(jìn)行落實(shí),設(shè)計(jì)人員無(wú)需擔(dān)心應(yīng)用系統(tǒng)的技術(shù)架構(gòu);

 ?。?)開(kāi)發(fā)階段:開(kāi)發(fā)人員可以只關(guān)注自己負(fù)責(zé)的業(yè)務(wù)功能的代碼,從前端界面的繁瑣、低效的過(guò)程解脫出來(lái);

 ?。?)運(yùn)行階段:運(yùn)維人員直接進(jìn)行系統(tǒng)更新維護(hù),無(wú)需啟停服務(wù)即可實(shí)現(xiàn)運(yùn)行時(shí)的更新。

參考文獻(xiàn)

  [1]伊雯雯. 基于MVC的Java Web開(kāi)發(fā)項(xiàng)目式教程[M].北京:人民郵電出版社,2014.

  [2]張佳強(qiáng),王士同.信息管理系統(tǒng)動(dòng)態(tài)表單技術(shù)的研究與實(shí)現(xiàn)[J]. 計(jì)算機(jī)應(yīng)用與軟件,2010,27(8):29-32.

  [3]董宗然 ,孫斌 ,張盈謙.面向BREW平臺(tái)的可視化UI設(shè)計(jì)工具開(kāi)發(fā)[J].計(jì)算機(jī)工程與設(shè)計(jì),2012,33(7) :2883-2889.

  [4]呂瑞 ,孫林夫 ,劉述雅.面向產(chǎn)業(yè)鏈協(xié)同SaaS平臺(tái)的表單動(dòng)態(tài)配置技術(shù)[J].計(jì)算機(jī)應(yīng)用,2013,33(10) :2984-2988.

  [5]楊樹(shù)林,胡潔萍. JAVA EE企業(yè)級(jí)架構(gòu)開(kāi)發(fā)技術(shù)與案例[M].北京:機(jī)械工業(yè)出版社,2011.

  [6]計(jì)文柯.Spring技術(shù)內(nèi)幕-深入解析 Spring架構(gòu)與設(shè)計(jì)原理[M].北京:機(jī)械工業(yè)出版社,2010.

  [7]李東博. HTML5+CSS3從入門(mén)到精通[M].北京:清華大學(xué)出版社,2013.

  [8]潘華,孫林夫,劉述雅.面向SaaS平臺(tái)的動(dòng)態(tài)表單定制技術(shù)研究[J].計(jì)算機(jī)應(yīng)用研究,2013,30(10) :3026- 3029.

  [9]徐宏,  邰偉鵬.面向工作流的RBAC模型研究[J].計(jì)算機(jī)工程與設(shè)計(jì),2012,33(4):1295-1299.

  [10]郭先超 ,林宗繆 ,姚文勇.基于規(guī)則庫(kù)與消息驅(qū)動(dòng)機(jī)制的工作流[J].計(jì)算機(jī)應(yīng)用,2014,33(A01) :270- 272, 276.

  [11]范會(huì)聯(lián).基于自定義表單的工作流過(guò)程定義分析與設(shè)計(jì)[J].計(jì)算機(jī)應(yīng)用研究,2009,26(9):3371-3374.


此內(nèi)容為AET網(wǎng)站原創(chuàng),未經(jīng)授權(quán)禁止轉(zhuǎn)載。