基于XML的图形用户界面
概述
由于构成图形用户界面的各种元素(统称为控件)间天生所具有的层次和嵌套关系,与XML文档中元素和属性之间的关系十分相似,使用XML来描述图形用户界面是十分自然和有效的方法。其实,早在HTML中就融合着这样的想法。但是,HTML表单的表现力相对于目前越来越复杂的应用还过于贫乏。因此,一些全新的,功能更为强大的XML语言纷纷出现。
Micromedia公司针对其独有的Flash技术,发布了一种描述图形用户界面的XML语言MXML,并发行了基于MXML的开发环境Flex;Microsoft公司也宣称在其下一代的Windows 操作系统Longhorn中将嵌入使用XAML语言的图形用户界面引擎Avalon;Mozilla开发小组专门为Mozilla浏览器的定义开发了一种用于描述用户界面的语言XUL。在Java环境下,也有许多相关成果。例如,在Sun Microsystem公司推出的Java集成编辑环境NetBeans 3.5及以上版本中,图形用户界面的编辑器就采用一种自定义的XML格式描述图形用户界面开发的中间结果。另外,一种基于Java AWT工具包的图形用户界面描述工具Bambookit已经进入了商业化阶段。
本文介绍的GUI XML,与上面提到的各种XML语言都有一定的相似之处。但是,它们之间也存在着最根本的不同,也是提出和定义GUI XML规范最重要的目的——在多种图形用户界面工具包之上,实现高抽
象的统一描述机制。众所周知,图形用户界面工具包作为一种高级编程语言的核心特性,在各种语言中都有其专有的实现。仅仅Java语言就拥有多种图形用户界面工具包,包括AWT,Swing以及SWT。虽然这些图形用户界面工具包的用途完全一致,但是它们可能使用截然不同的元素和结构来表现图形用户界面。经过仔细的比较和归纳,并吸取其他多种XML图形界面描述语言的优点,我们提出了机遇XML的图形用户界面描述方法和语言GUI XML。
XML从被提出一直发展至今,也经历了不断修改和增强的过程。这些修改和增强 GUI
最直观的体现就是GUI XML的语言规范的升级。GUI XML从最初的1.0版本,到目前正在制定的1.3版本,逐渐将XML技术的各种优势发挥得淋漓尽致。本文接下来的章节便按照GUI XML语言规范的发展历程简单介绍其各种先进和强大的功能。
GUI XML 1.0
GUI
XML语言采用抽象程度比较高的语法结构来描述图形用户界面。1.0版本的语法的主要结构可以用图1部分概括。图中的节点都表示XML中的元素(Element),其属性没有给出,还有部分元素作为辅助功能也没有在图中给出。可以很容易地看出,<interface>元素是整个GUI XML规范的主要部分,而<st
ructure>和<behavior>元素是描述图形用户界面的重点。简单来说,<style>元素预定义控件的样式特征,例如颜、位置、大小等等;<content>元素下定义包括字符串、图像、音频等等资源,并可以在其他部分通过唯一标识引用;<structure>元素是定义图形界面的主体,其下嵌套、并列的<part>元素抽象描述了构成图形界面的控件之间的关系以及各自的样式特征;<behavior>元素则定义控件触发的事件和处
理逻辑之间的映射关系。
图1 GUI XML 1.0基本语法结构图
如果给定一个图形用户界面的照片,利用GUI XML 1.0的描述能力,可以将其完整地复制出来。但是,图形用户界面程序不是一张永远不会改变的照片——绝大多数的图形界面依靠运行时所提供的数据而建立,并且大多是动态数据。因此,缺乏动态数据集成能力的GUI XML 1.0不可能在充满着不可预料数据的网络应用中占有一席之地。具体来说,GUI XML 1.0的缺陷体现在如下两个方面:
首先,控件关系采用静态定义,不能根据运行时数据动态改变。从前面的语法介绍可以看到,控件之间的相对位置和从属关系完全取决于<part>元素的嵌套、并列关系。而在运行时,GUI XML没有定义任何机制用于修改这些关系,因此,GUI XML 1.0描述的图形用户界面永远只能是一模一样的,不论运行时的数据如何变化。
其次,缺乏与外界交换数据的有效手段。包括构造界面的字符串、图像和音频等资源必须在GUI XML文件中预先定义,无法在运行时从其他途径获得这些资源。同时,GUI XML 1.0没有为界面操作所产生的数据定义任何数据处理功能,开发人员不得不编写全套的数据管理和通讯代码。相比于处理数据所花费的庞大精力,GUI XML 1.0所带来的一点点便利已经变得似乎微不足道。
虽然由于上面的缺陷,使得GUI XML 1.0很难具备很高的实际应用价值,但是,我们需要承认它具有很高的发展潜力。
GUI XML 1.1
为了使GUI XML能够适应RIA应用的要求,GUI XML 1.1在很多方面,尤其是动态数据处理方面作了比较大的增强。就语法而言,GUI XML变得更加灵活,图2给出了GUI XML 1.1的语法框架:
图2 GUI XML 1.1语法框架图
比较GUI XML 1.0的语法图可以发现,主要的改变都发生于<interface>元素之下:新增了<datamodel>, <template-set>和<logic>三个子元素。当然,一些1.0规范中定义的元素也作了部分修改。
界面描述的增强定义
为了弥补1.0规范中动态构造界面能力不足的缺陷,1.1规范中引入了“模板(template)”的概念,对应于语法结构中的<template>元素。所谓模板,是一套预先定义的界面元素,例如一个按钮,一个包含多个控件的面板(panel),甚至是一个完整的对话框。模板定义的界面可以在运行时根据需要进行选择和显示,并且可以被整个应用共享。<template-set>元素是一个模板容器,其下可以定义多个模板,每一个模板都有一个唯一标示它的id属性。
为了灵活地使用模板定义,1.1规范对<part>元素也作了比较大的改动。与1.0规范相比,<part>元素的子元素除了<part>元素本身,还允许出现<repeat>, <rule>, <switch>和<behavior>四个辅助元素(语法结构图中并未标出)。前三者的功能比较相似,都可以根据逻辑条件控制是否调用,或者调用哪些预定义的模板(template)和控件定义(part)。如果用高级语言做一个比较,它们依次对应于for, if和switch语句。最后的<behavior>元素则定义了控件的行为。
数据模型
数据模型是1.1规范中的核心内容之一。GUI XML 1.1规范中采用标准的XForms数据模型。XForms规范于2003年10月成为W3C组织的推荐标准,目前版本为1.0。W3C组织力图将XForms制定成为HTML表单的替代标准。XForms规范主要包括数据模型定义、抽象控件定义以及事件处理机制等几个部分。
1. 模型定义
GUI XML 1.1规范中的数据模型定义,由<datamodel>元素下直接嵌入XForms的<model>元素定义,如下面的例子所示:
<datamodel>
id="catOrder">
<xfm:model
method="post"
id="submit1"
<xfm:submission
action="diapoli:8080/xforms/request"/> <xfm:submission id="submit12" method2="postxml" localfile="l"
/>
target2="www.hut.fi/"
/>
src="l"
<xfm:instance
nodeset="/Order/RequestedDeliveryDate"
type="xsd:date"/> <xfm:bind
nodeset="/Order/IssueDate"
type="xsd:date"/>
<xfm:bind
</xfm:model>
</datamodel>
清单1 数据模型定义示例
该数据模型,或者说XForms数据模型定义包含三个主要部分:模型实例(instance)数据、数据约束(bind),和数据提交(submission)定义。
该模型直接将XML作为存储和操作数据的对象。例如在清单1的例子中,所有的数据都存放于名为l的XML文档中,即被称为模型的实例数据。运行时,XForms处理引擎将XML文档读入,构造DOM对象树;所有的数据操作,例如读取,修改,验证等等,都直接在这棵DOM对象树上完成。
清单1示例中的<xfm:bind>元素定义了数据约束。数据约束的对象是DOM对象树上的节点集(nodeset)。这些节点集通过XPath表达式来指定,例如“/Order”就指定了根节点下所有名为“Order”的元素节点。约束的类型可以是数据类型(type)、读写属性(readonly)、计算关系(calculate)等。
同时,数据模型还定义了数据提交的部分细节,例如提交方式、地址等,如上面示例中<xfm:submission>元素所示。
2. 数据绑定
GUI XML定义的控件可以通过XPath与DOM对象树中的某个节点集绑定,称之为数据绑定。例如清单2给出的定义片断粗体部分就将一个控件的背景颜属性值与某个DOM 节点值绑定在一起:
<part id=”button”>
<style>
name=”rendering”>java.swing.JButton</property>
<property
<property name=”background”>
dataModelId=”catOrder”
<reference
type=”xml”
constant-name=”/Order/Property/Color”
force-data-fresh=”true“/>
</property>
</style>
</part>
清单2 数据帮定示例一
另外,也可以将一个控件本身,而不是其某个属性,与对象树的某节点绑定。这种逻辑上的绑定不会对该控件本身有任何影响,但是可以使得该控件内部的“孩子”控件在定义绑定时使用相对形式的XPath表达式。例如下面的清单3给出一个简单的例子:
<part id=”panel”>
<style>
name=”rendering”>java.swing.JPanel</property>
<property
<property name=”dataModelId”>catOrder</property>
<property
name=”binding”>/Order/Property</property>
</style>
id=”button”>
<part
<style>
name=”rendering”>java.swing.JButton</property> <property
<property name=”background”>
constant-name=”Color”/>
type=”xml”
<reference
</property>
</style>
</part>
网络上xml是什么意思<part>
清单3 数据帮定示例二
如此灵活的数据定义和引用机制,再配合前面介绍的增强控制功能,用户界面就可以根据数据(XML文档)的不同而呈现不同的样式和内容。
3. 数据交互
由于有XForms强大的数据模型和灵活的数据帮定定义,运行时的数据交互显得十分简单:只需要根据数据帮定关系,将界面控件上的数据写入到DOM对象树相应的节点上,一切的验证、计算、更新等等操作都将自动完成。当然,为了使得设计人员自由地控制何时采集数据,何时更新数据,又何时进行计算,GUI XML 1.1还预定义了一套数据交互函数(function)供设计人员调用。
逻辑定义
逻辑<logic>部分是1.1规范完全新增的一个功能。其主要目的是定义运行时环境中,特定情形下需要执行的一系列特定行为,例如对用户界面中控件状态的修改和对方法的调用等。
网络通讯
作为网络应用,通讯方式或者说通讯协议是比较重要的一环。前言中介绍的MXML和Bambookit在网络环境下使用时,都需要通过编写脚本或者Java程序,并借助HTTP或者直
接使用更底层的TCP协议来传输数据。显然,这并不是最好的选择。虽然GUI XML 1.1规范中并没有明确指定所采用的通讯协议。但是,考虑到企业应用对跨越防火墙等特性的要求,最后Web Services被作为应用中的缺省通讯手段。换句话说,XML数据采用SOAP/HTTP 协议在网络上传输。
然而,Web Services实现中拥有许多不同类型的数据编码和传输方式,例如基于RPC (Remote Proc
ess Call)的Web Services采用RPC规范序列化和编码数据;基于文档(Document)结构的Web Services采用XML文档作为数据格式,等等。很显然,由于数据模型的特点,基于文档结构的Web Services更适合GUI XML应用的要求。
在实现层面上,网络通讯模块需要做的事情十分简单:从数据模型通过简单的接口获得表示数据的XML文档,然后按照模型中定义的数据提交信息,例如Web Services调用地址等,调用服务端的Web Services并获得返回的XML文档数据,如图3所示。如此,便完成一次通讯过程。GUI XML 1.1规范的实现过程也证明了这项选择的正确性。
图3 网络通讯实现
结论
XML发展到1.1版本,已经具有了很强的实用价值。它为RIA应用的开发提供了 GUI
一种全新的,也是更高效的手段。当然,GUI XML还有其薄弱的地方,例如企业级应用的开发框架。特别是针对针对RIA应用,从开发阶段到测试、部署以及最终客户端体验和安全性问题等都需要做进一步考虑。这也正是目前正在制定的1.3版规范所要解决的问题。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论