面向業務的敏捷界面定制構件的設計

王 剛 ，程建平

（1.山東師范大學 信息科學與工程學院，山東 濟南 250014；2.中創軟件工程股份有限公司，山東 濟南 250014）

隨著計算機的廣泛應用和網絡技術的快速發展，企業的運營和管理發生了重大的變革，企事業單位都在逐步實施和普及信息化系統。信息化系統中的大量業務都需要通過表單的形式來實現，但是傳統的表單模式由于表單的樣式固定、開發周期長，并不能適應信息化系統中業務需求的經常性變更。為了讓表單能夠適應企業業務的靈活性需求，表單定制的概念應運而生[1-2]。

本文為了解決傳統表單定制存在的問題，提出一種面向業務的表單定制構件?？梢杂行У貜浹a傳統表單定制的缺點，方便軟件開發人員開發軟件，節省大量的項目資源。

1 傳統表單定制

表單是國際通用的商業語言，是結構化的信息載體，是連接企業與客戶的重要紐帶，表單幾乎扮演著企業形象代言人的角色。因此，在應用系統中，表單的開發十分重要[3]。

傳統表單定制出現至今發揮了很大的作用，在一定程度上幫助了開發人員更好地開發軟件，縮短了開發時間，節省了大量的人力、財力。傳統表單實現模式如圖1所示。

1.1 面臨問題

圖1 傳統表單實現模式

隨著信息技術的飛速發展，企業對應用系統的開發要求越來越高，而傳統表單定制存在著大量的問題：（1）不支持靈活的業務定制。表單基本上是針對某個具體應用進行開發的，并且當業務需求發生變更時，客戶沒有能力或者很少有能力進行變更；（2）不支持業務創新。傳統表單定制運用比較單一，很難在業務上實現創新；（3）界面風格不統一。由于開發人員在開發軟件項目的時候會使用不同的表單定制來實現大量的業務定制，造成了在同一個項目中有可能會出現各種各樣的界面風格；（4）開發復雜性高。開發人員可能會運用大量不同的表單定制，增大了其復雜性；（5）重用性差。很多表單定制都是針對某一項目甚至某一業務而開發的，因此有可能導致大量表單定制浪費，無法進行良好的開發再復用，重用性比較差。

而客戶的要求是表單定制工具能夠具備以下功能：滿足業務定制，適應業務變化；穩定運行，維護方便；按時上線，滿足顯性業務需求。

1.2 解決思路

圖2 業務化表單實現模式

針對傳統表單定制所表現出來的問題，提出的解決思路是進行業務化定制：通過界面即時配置進行需求開發，解決從需求到設計的快速切換問題，提高以數據為中心的應用系統設計的質量和效率。業務化表單實現模式如圖2所示。

面向業務表單定制將重點放在了業務域，并不像傳統表單定制那樣將大量的精力放在技術域。業務部門根據需求復用模板、進行繪制表單、檢測表單、部署表單和發布，技術部門則進行技術組件的開發。面向業務的表單定制最突出的特點在于面向業務、能夠復用，軟件開發人員可以復用此構件，實現開發界面的統一風格，使表單使用靈活方便，減少開發成本。

2 面向業務的敏捷界面定制構件

根據業務化表單的實現模式，本文提出了一種面向業務的敏捷界面定制構件——Xcom-Vtemplet。該構件的核心設計理念是屏蔽繁復的技術細節，使開發者僅關注業務處理邏輯，實現快速構建。該構件提供基于業務語言的靈活定制功能；支持業務創新；開發頁面風格統一；降低了軟件開發難度；提高重用性；所見即所得，實現可視化。

2.1 Xcom-Vtemplet構件的體系結構

Xcom-Vtemplet構件設計采用MDD模式，界面靈活動態配置，構建敏捷界面，能夠靈活應對業務變化（隨時增加相應信息項）。其構件體系結構如圖3所示。

圖3 Xcom-Vtemplet構件的體系結構

整個構件內部體系由元數據引擎、表單運行引擎和數據存儲引擎三部分構成。元數據引擎滿足開發人員調用元數據對表單與業務對象進行定義需要；表單運行引擎用來保證設計器所設計表單能正常；數據存儲引擎用來保證設計的模板數據能進行存儲。表單設計器通過服務管理接口與后臺交互，可實現設計器的既有功能。元數據庫存儲表單定義對象、業務對象以及模板對象，供設計器通過元數據引擎使用。設計器生成的XML代碼文件通過XML存儲適配器進行存儲。

Xcom-Vtemplet構件基于Ajax技術，使用戶能方便、快捷、可視化地對表單進行設計。表單模板可由用戶通過可視化界面設計，該表單設計器提供各種控件，用戶可直接拖拽控件至設計域中。將所有控件定義為一個對象列表，用戶拖拽控件時在設計域中增加對應的控件代碼。

2.2 Xcom-Vtemplet構件的設計

（1）定義表單模型

表單模型是該構件運行的基礎，用來定義和描述表單的相關信息。其涵蓋表單相關的所有詳細信息，這些構成了表單模型的子模型，主要包括：數據模型、頁面顯示控件模型、頁面布局模型、控件事件模型以及數據集模型。

表單構件操作這些模型，以此為基礎設計構建表單模板、解析模板、傳輸并處理數據。模型設計的好壞影響表單構件的運行效率和易用性，同時決定了開發表單構件的難易程度。

（2）設計表單模板

表單模板是以表單模型為基礎的一個描述性的文件，包含了一個表單的所有詳細信息。本表單定制構件采用圖形化的所見即所得的方式，使用拖拽的操作方式即可完成表單設計，并不需要手工編寫代碼，避免了手工編程的低效率，同時降低了錯誤率。通過表單設計器代替手工編程完成的工作主要有兩大類：一類是需要使用拖拽的操作方式來完成，包括表單頁面顯示控件、表單頁面顯示控件的布局以及表單的流程設計；另一類則是需要使用配置的方式來完成，包括控件的屬性、控件的事件以及數據集[4]。

表單的設計是使用表單構件進行應用開發的核心，它決定了表單應用進行軟件開發和維護的工作量。好的表單設計器能達到事半功倍的作用，而平庸的表單設計器則發揮不出應有的作用。

（3）解析表單模板

表單模板包含著表單的所有相關信息，是表單應用得以正常運行的基礎。表單構件根據表單模型自行定義表單模板的文件格式和內容，要使表單應用能夠正確運行，實現它具有的功能，這就要求表單模板能夠正確有效地被解析，將表單模板的自定義語言轉換為能夠在應用系統中正確運行的有效宿主語言。包括：解析表單頁面顯示控件、控件的屬性、頁面顯示控件的布局、頁面顯示控件上定義的事件以及數據集。

（4）輸出表單頁面

表單頁面的內容來自于表單模板，表單頁面輸出的工作是在用戶請求表單時動態完成，即表單是動態加載的。當需要修改表單時，只需要使用表單設計器修改表單模板，然后重新部署模板，并不需要手動修改頁面的代碼。在這種實現方式下，頁面的代碼不會物理地存在應用程序系統中。XML的讀取使用DOM技術實現[5]。輸出的表單頁面，不僅僅包含表單的控件和表單的控件布局，同時還包含表單數據的模型、表單控件的事件、表單控件權限控制以及根據數據集的預填充數據。這些輸出的信息通過解析表單模板得到。

2.3 Xcom-Vtemplet構件的開發接口

Xcom-Vtemplet構件的開發接口如圖4所示。圖中，bom為業務對象，對各個元素進行屬性配置，實現數據的存儲，提高擴展性；templet為模板對象，對設計所調用的模板進行屬性配置，實現了靈活定制；bizService為遠程調用，保證構件的穩定運行。在設計器中，實現的界面為設計態中的界面。為了方便用戶實現所見即所得的功能，可以通過預覽界面進行可視化。

圖4 Xcom-Vtemplet構件的開發接口

2.4 Xcom-VTemplet構件的功能及相關技術

2.4.1 功能

（1）實現可視化靈活定制信息項及界面布局，實現業務敏捷開發。

（2）Vtemplet定制的模板具有即時調整、即時生效的快速應用能力。

（3）簡化傳統JSP頁面開發，將模板的顯示和 JSP頁面的交互進行職責分離，使頁面代碼更加簡潔。

（4）便于二次開發及業務產品創新敏捷化以節省項目資源。

2.4.2 相關技術

Xcom-VTemplet構件采用的 Ajax技術，其中 Dojo工具包在本構件中運用。Ajax（Asynchronous javascript and XML）是一種用于創建更好更快以及交互性更強的Web應用程序的技術。Dojo（即 Unified toolkit）是一個用JavaScript語言實現的開源DHTML工具包。

與傳統的Web應用不同，Ajax采用的是一種異步交互的處理方式，其處理過程如圖5所示[6]。

圖5 異步交互方式

Ajax相當于在瀏覽器客戶端與服務器之間架設了一個橋梁、一個媒介，在它的幫助下，可以消除網絡交互過程中的處理—等待—處理—等待等缺陷。在處理過程中，Web服務器響應是將標準的且易于解析的XML格式的數據傳遞給Ajax，然后再轉換成HTML頁面的格式，輔助CSS進行顯示[6]。正是通過Ajax引擎，服務器在返回數據時，不需要更新整個網頁，而只是更新網頁的一部分，讓用戶感覺網頁的反應更快、更靈敏[7]。

Dojo體系主要由以下部分構成：Base-dojo基礎核心、Core-工具模塊、Dijit-界面組件庫、DojoX-擴展庫、Util-構建和測試工具。Dojo可以幫助開發人員開發大型的Ajax項目，并有助于構建健壯的代碼，節省開發時間。Dojo很大程度上屏蔽了瀏覽器之間的差異性，因此不用擔心Web頁面是否在某些瀏覽器中可用。利用Dojo提供的組件，可以提升Web應用程序的可用性和交互能力。

3 面向業務的敏捷界面定制構件的應用

本構件基于業務語言，這為在各種構件以及項目中復用奠定了基礎，使開發者僅需關注業務處理邏輯，就能夠實現業務敏捷構建，項目開發人員可以方便快捷地將此構件jar包安裝部署即可使用。Xcom-Vtemplet構件的應用如圖6所示。

3.1 Xcom-Vtemplet構件在構件中的應用

圖6 Xcom-Vtemplet構件的應用

Xcom-Vtemplet構件成功運用到了合同構件、押品構件、客戶構件、物聯網構件、自定義查詢構件中。開發的構件如果想要實現表單定制無需自開發，開發人員復用Xcom-Vtemplet構件，即可通過業務對象管理對其調用。Xcom-Vtemplet構件內的模板解析類通過與瀏覽器進行數據交互可以生成頁面展示模板文件，同時頁面展示模板文件也可以通過模板解析類展現到瀏覽器中。模板設計器可以將業務對象模板文件展現到瀏覽器中，同時開發人員可將設計的可視化的界面生成業務對象模板文件。基于業務語言的Xcom-Vtemplet構件使軟件開發人員實現了方便、快捷、可視化的表單定制。

3.2 Xcom-Vtemplet構件在項目中的應用

Xcom-Vtemplet構件已成功運用到了交通銀行金融租賃、光大銀行金融租賃、廣發信貸系統等項目中。各個項目可直接通過業務對象管理復用Xcom-Vtemplet構件，也可以通過復用其他的構件間接復用Xcom-Vtemplet構件。其實現過程與在構件中的應用類似。

本文從實際需求出發，設計開發了面向業務的敏捷界面定制構件。通過表單設計器，用戶可以自行設計修改表單模板，實現用戶對表單的頁面動態靈活的配置，靈活應對業務變化，很好地滿足了用戶的需求。面向業務的敏捷界面定制構件可以滿足業務敏捷開發的市場競爭要求，把串行開發變為并行開發。業務化定制有效減小了技術人員和業務人員之間的鴻溝，不再過分依賴資源，分離了技術工作和業務工作，降低了總體開發成本。

[1]楊俊杰.面向SaaS應用的表單定制平臺的研究與實現[D].北京：北京郵電大學，2011.

[2]謝鑫軍，何志均.一種單一表單工作流系統的設計和實現[J].計算機工程，1998，24（9）：53-55.

[3]唐文忠，莫偉棟.面向領域的模型驅動智能表單系統的框架設計 [J].北京航空航天大學學報，2007，33（9）：1086-1089，1126.

[4]徐瑞軍.基于XForms的所見即所得的電子表單工具設計與實現[D].北京：北京交通大學，2008.

[5]NAKHIMOVSKY A，MYERST.ProfessionalJavaXML programming with servlets and JSP[M].Birmingham：Peer Information Inc.， 1999：201-284.

[6]張桂元，賈燕楓，姜波.征服 Ajax—Web2.0快速入門與項目實踐（Java）[M].北京：人民郵電出版社，2007：1-4.

[7]張洪斌.Java程序員的AJAX技術開發[M].北京：機械工業出版社，2007.