面向业务的敏捷界面定制构件的设计

王 刚 ，程建平

（1.山东师范大学 信息科学与工程学院，山东 济南 250014；2.中创软件工程股份有限公司，山东 济南 250014）

随着计算机的广泛应用和网络技术的快速发展，企业的运营和管理发生了重大的变革，企事业单位都在逐步实施和普及信息化系统。信息化系统中的大量业务都需要通过表单的形式来实现，但是传统的表单模式由于表单的样式固定、开发周期长，并不能适应信息化系统中业务需求的经常性变更。为了让表单能够适应企业业务的灵活性需求，表单定制的概念应运而生[1-2]。

本文为了解决传统表单定制存在的问题，提出一种面向业务的表单定制构件。可以有效地弥补传统表单定制的缺点，方便软件开发人员开发软件，节省大量的项目资源。

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.