（计算机应用技术专业论文）基于svg的手机界面生成工具的研究与实现.pdf

摘要 近年来，随着计算机通讯技术的迅猛发展，手机的应用逐渐深入到人们的日常生活 中，手机对人们学习和工作的重要性不言而喻。可是由于种类繁多的手机具有软硬件上 的差异性，就使得同一应用程序在不同手机上运行不太容易实现。为了解决这一问题， 开发人员通常需要分别为不同的手机设备开发不同版本的用户界面程序，从而导致了重 复性开发，大大增加了开发的成本。所以，为了减轻用户界面开发人员的工作量，提高 用户界面的开发效率，急需一种针对不同设备自动生成界面的用户界面开发工具出现。 本文针对上述问题，提出了复用任务模型的多设备界面开发的新思想。为了实现用 户界面的跨平台性，利用当前各种操作系统平台和移动设备上的s v g 浏览器为基于s v g 应用提供一致的s v g 显示和j a v a s c r i p t 交互体验。并以此为指导开发出了一个基于s v g 的手机界面开发工具( s p i g t ) ，s p i g t 支持从任务模型出发设计用户界面，再针对不同显 示设备的特性，利用自动布局算法自动生成相应的基于s v g 的用户界面，避免了为同一 应用程序重复开发不同设备下的用户晃面，从而提高了用户界面的开发效率。产生的s v g 界面与j a v a s c r i p t 脚本相配合，则可以提供完整的功能。 本文开始综述了课题的研究背景、研究意义、研究目的、研究内容和用户界面开发 工具在国内外的研究现状。接着分析了传统手机界面开发中引发的问题，指出了该问题 的原因( 设备g u i 系统的差异性和不同的开发平台) 。同时也给出了我们的解决方案：通 过复用任务模型来解决手机界面开发当中的问题，然后分析当前几种基于x m l 的用户界 面描述语言的特点，指出了利用s v g 中提供的丰富的图形元素对象来构造用户界面，并 利用s v g 支持的j a v a s c r i p t 来对用户动作作出响应。接下来在上述的基础上，设计和 实现了基于s v g 的手机界面开发工具( s p i g t ) 。最后为了验证本文的研究内容，进行了 s p i g t 可用性测试，通过测试证明该工具具有较高的开发效率与可用性，满足我们的设 计目标。 关键词界面开发工具，可视化设计，用户界面，s v g ，自动布局算法 r e s e a r c ha n di m p l e m e n t a t i o no ns v g b a s e dm o b i l ep h o n e i n t e r f a c eg e n e r a t i o nt o o l a b s t r a c t i nr e c e n ty e a r s 、析mt h er a p i dd e v e l o p m e n to ft h ec o m p u t e rc o m m u n i c a t i o n t e c h n o l o g y , t h ea p p l i c a t i o no fm o b i l ep h o n eh a sg r a d u a l l yp e n e t r a t e di n t op e o p l e sd a i l yl i v e sa n di tp l a y s a ni m p o r t a n tr o l ei nt h e i rs t u d ya n dw o r k h o w e v e r ，d u et ot h e d i f f e r e n ts o f t w a r ea n d h a r d w a r et h a tv a r i o u sk i n d so fm o b i l ep h o n e sh a v e ，i tm a k e sd i f f i c u l tf o rt h es a m ea p p l i c a t i o n t or u n o nd i f f e r e n tt y p e so fm o b i l ep h o n e s s ot h ed e v e l o p e r so f t e nh a v et h en e e dt od e v e l o p d i f f e r e n tv e r s i o n so ft h eu s e ri n t e r f a c ef o rd i f f e r e n tm o b i l ed e v i c e s ，w h i c hl e dt ot h er e p e t i t i v e d e v e l o p m e n ta n dw h i c hg r e a t l yi n c r e a s e dt h ec o s to fd e v e l o p m e n t t h e r e f o r e ，i no r d e rt o r e d u c et h ew o r k l o a do ft h eu s e ri n t e r f a c ed e v e l o p e ra n dt oe n h a n c et h ee f f i c i e n c yo ft h eu s e r i n t e r f a c ed e v e l o p m e n gi ti se x p e c t e dt h a tat o o lw h i c hc a na u t o m a t i c a l l yg e n e r a t ep r o p e ru s e r i n t e r f a c ea c c o r d i n gt od i f f e r e n td e v i c e ss h o u l db ed e v e l o p e du r g e n t l y t os o l v et h ep r o b l e mw h i c hi sm e n t i o n e da b o v e ，an e wi d e ao fr e u s i n gt a s km o d e lo f m u l t i - d e v i c e si n t e r f a c e d e v e l o p m e n ti sp u tf o r w a r d i nt h i s p a p e r t oa c h i e v e t h e i n t e r o p e r a b i l i t yo ft h eu s e ri n t e r f a c e ，d e v e l o p e r su s et h es v gb r o w s e r so nt h ec u r r e n t o p e r a t i n gs y s t e mp l a t f o r m sa n dav a r i e t yo fm o b i l ed e v i c e st op r o v i d ec o n s i s t e n ts v gd i s p l a y a n di n t e r a c t i v ej a v a s c r i p te x p e r i e n c eb a s e do nt h es v g a p p l i c a t i o n ，a n dd e v e l o pat o o lw h i c h i sb a s e do ns v gp h o n ei n t e r f a c eg e n e r a t i o nt o o l ( s p i g t ) u n d e rt h eg u i d eo fi t s p i g t s u p p o r t sf o rd e s i g n i n gu s e ri n t e r f a c eb ys t a r t i n gf r o mt h et a s km o d e l ，t h e ng e n e r a t i n gt h e a p p r o p r i a t eu s e ri n t e r f a c eb a s e do ns v ga u t o m a t i c a l l yb yu s i n gt h ea u t o m a t i cd i m e n s i o n p l a c e m e n ta l g o r i t h ma c c o r d i n gt ot h ec h a r a c t e r i s t i c so fd i f f e r e n td i s p l a yd e v i c e s ，t h u sa v o i d s t h ed u p l i c a t i o no fd e v e l o p m e n to ft h es a m ea p p l i c a t i o nf o rd i f f e r e n tm o b i l ed e v i c e sa n d t h e r e b yi m p r o v e st h ee f f i c i e n c yo ft h eu s e ri n t e r f a c ed e v e l o p m e n t i tc a l lp r o v i d ec o m p l e t e f u n c t i o n a l i t yb yc o m b i n i n gt h ep r o d u c e ds v g i n t e r f a c ew i t ht h es c r i p t so f j a v a s e r i p t f i r s to fa l l ，t h i sp a p e rr e v i e w st h er e s e a r c hb a c k g r o u n d ，r e s e a r c hm e a n i n g ，r e s e a r c h p u r p o s e ，r e s e a r c hc o n t e n t sa n dr e s e a r c hs t a t u so ft h eu s e ri n t e r f a c ed e v e l o p m e n ta th o m ea n d a b r o a d t h e ni ta n a l y z e st h ep r o b l e m si nt r a d i t i o n a lp h o n ei n t e r f a c ed e v e l o p m e n ta n dp o i n t o u tt h er e a s o no ft h ep r o b l e m s ( t h ed e v i c e sg u is y s t e md i f f e r e n c e sa n dd i f f e r e n t d e v e l o p m e n tp l a t f o r m ) a tt h es a m et i m e ，i tg i v e su sas o l u t i o n ：t h r o u g ht h er e u s et a s km o d e l t os o l v et h ep r o b l e mw i t h i nt h em o b i l ei n t e r f a c ed e v e l o p m e n t , a n db ya n a l y z i n gt h ef e a t u r e s o ft h ed e s c r i p t i v el a n g u a g ei ns e v e r a lc u r r e n tx m l - b a s e du s e ti n t e r f a c e ，i ti n d i c a t e c o n s t r u c t i n gt h eu s e ri n t e r f a c e 谢mt h ea p p l i c a t i o no ft h er i c hg r a p h i ce l e m e n t si ns v ga n d r e s p o n d i n gt ou s e r sa c t i o n sb yu s i n gt h ej a v a s c r i p tw h i c hi ss u p p o r t e db ys v g t h e n , o i lt h e b a s i so ft h em e n t i o n e da b o v e ，i td e s i g n sa n da c h i e v e st h es v g - b a s e di n t e r f a c ed e v e l o p m e n t t o o l sf o rm o b i l ep h o n e s ( s p i g t ) f i n a l l y , t ov m f yt h ec o n t e n t so fs t u d yi nt h i sp a p e r , t h e s p i g tu s a b i l i t y t e s t i n gw a sc o n d u c t e d i tp r o v e st h a t t h et o o lh a sh i g hd e v e l o p m e n t a l e f f i c i e n c ya n da v a i l a b i l i t yt h r o u g ht h et e s t ，w h i c hm e e t so u rd e s i g no b j e c t i v e s k e y w o r d s ：i n t e r f a c ed e v e l o p m e n tt o o l s ，v i s u a ld e s i g n ，u s e ri n t e r f a c e ，s v g ， a u t o m a t i cl a y o u ta l g o r i t h m 西北大学学位论文知识产权声明书 本人完全了解西北大学关于收集、保存、使用学位论文的规定。学校 有权保留并向国家有关部门或机构送交论文的复印件和电子版。本人允许 论文被查阅和借阅。本人授权西北大学可以将本学位论文的全部或部分内 容编入有关数据库进行检索，可以采用影印、缩印或扫描等复制手段保存 和汇编本学位论文。同时授权中国科学技术信息研究所等机构将本学位论 文收录到中国学位论文全文数据库或其它相关数据库。 保密论文待解密后适用本声明。 学位论文作者签名：呈2 重丝指导教师签名：筮丕二 p l oi f - 6 只bb劲l o 年6 只知日 西北大学学位论文独创性声明 本人声明：所呈交的学位论文是本人在导师指导下进行的研究工作及 取得的研究成果。据我所知，除了文中特别加以标注和致谢的地方外，本 论文不包含其他人已经发表或撰写过的研究成果，也不包含为获得西北大 学或其它教育机构的学位或证书而使用过的材料。与我一同工作的同志对 本研究所做的任何贡献均己在论文中作了明确的说明并表示谢意。 学位论文作者签名： l 习髻咎 加加年6 月加日 西北大学硕士学位论文 1 1 研究背景和意义 第一章绪论 伴随着计算机和网络技术的飞速发展，计算机已经深入到人类的日常生活、学习和 工作当中，其中手机更是成为人们日常生活的必备品，手机制造商针对不同人群设计出 种类多样的手机。作为用户与手机沟通的桥梁用户界面，有着举足轻重的作用。正 是有了一个友好的用户界面，我们才能更简单、更有效地使用手机，为我们的生活和学 习提供便捷与方便。但是这些手机的软硬件环境截然不同，有近似于p c 功能的智能手 机，也有功能单一的普通手机，由于开发环境不同、屏幕尺寸大小的差异等诸多因素， 这两种手机设备不能通用同一种用户界面。要将某个用户界面从其中一种手机设备移植 到另一种手机设备，一般需要做出大量的工作，比如修改、编译或测试，甚至需要重新 开发。从而看出传统的用户界面开发方法只能针对特定手机开发其自身的用户界面，即 使这样仍然带来很多的问题，比如，在不同平台和使用环境下进行开发工作，导致了用 户晁面的重复性开发，从而产生了用户界面的一致性和成本问题；在开发工作中，用户 界面开发人员技术的不同熟练程度使得软件质量急剧下降；另外，一旦一种新的手机投 入使用后，必然需要开发适用于该设备的用户界面。一项调查表明【l 】：用户界面的代码 量约占总代码量的4 8 ，在用户界面的设计与实现阶段所花的时间为软件设计与实现总 时间的4 5 5 0 。传统用户界面开发方法已经开始制约着用户界面的开发，因此迫切 需要一种新的用户界面开发方法来解决这些问题。 可伸缩矢量图形( s v g ) 【2 】是一种基于x m l 的标识语言，主要用来描述二维矢量图 形和矢量点阵混合图形，是专门针对网络而设计的基于文本的矢量图像和动画标准。此 外s v g 还具有三个很实用的特性：跨平台性、网络传输性、强交互性，而这些特性支 持了s v g 在广泛应用中的可用性。在实际使用中有以下例子：网页整合、改变网页设 计思想；在w e b g i s 的应用中将地理空间数据用s v g 格式来存储、传输和显示，这样 做一方面可以方便组织、发布地理空间数据，另一方面用户可以获取更具表现力和吸引 力的w e b g i s 服务【3 】；在图像搜索引擎中，s v g 基于纯文本的特性，使得用它描述的图 像具备像文字信息一样的可检索性，从而人们对w e b 图形检索的梦想成为现实【4 】。既然 s v g 有如此优于传统位图的特性，而且已应用于一些领域当中，那么是否可以在手机界 第一章绪论 面的开发中使用s v g 呢? 由于使用简单灵活的标准格式，就可以将不同的数据标记为x m l 格式，所以在不 同的平台上挂有x m l 解析器，然后通过解读被标记的数据就可以得到正确的信息了。 作为基于x m l 的标识语言，s v g 自然继承了x m l 的这一特性，同时s v g 所特有的强 交互能力特性( 支持d o m 操作和j a v a s c r i p t ) 更适应于开发交互式界面。此外，s v g 文档 中元素和属性之间的关系相似于用户界面的各种界面元素间的层次和嵌套关系。从而可 以看出s v g 不仅可以统一描述各种设备界面，而且还能作为各种设备界面信息交换的 中间件。需要特别说明的是，s v g 中的图形对象描述功能极具特色，无论拉伸还是缩小， 图形都能保证原来的质量。这个功能在手机界面开发的过程中体现了强大的灵活性，有 利于设计者设计并实现出更加丰富、更加人性化的用户界面【5 】。 结合s v g 综上的这些特性，设计出基于s v g 的手机界面生成工具s p i g t ( s v g p h o n ei n t e r f a c eg e n e r a t i o nt 0 0 1 ) 。s p i g t 支持从任务模型出发设计用户界面，针对不同 显示设备的特性自动生成相应的用户界面，从而提高用户界面的开发效率。产生的s v g 界面与j a v a s c r i p t 脚本相结合，体现更为完整的功能。s p i g t 支持可视化设计，并极大 地减少重复开发的代码量，从而帮助开发者更快捷地创建用户界面。 从微观角度来看，s p i g t 不仅可以帮助开发人员加快开发进程，而且还避免了重复 性开发。使得开发人员的工作量减少，在提高工作效率的同时也降低了开发成本。而对 于用户来说，通过s p i g t 开发出来的用户界面交互性更强，更利于用户使用，增进了手 机设备在使用当中的易操作性。 从宏观角度来看，无论是在国内还是在国外，用户界面开发研究的重视程度在不断 加深。美国提出的四项2 1 世纪的基础研究，用户界面就在其中。日本的f p i e n d 2 1 计 划( f u t u r ep e r s o n a l i z e di n f o r m a t i o ne n v i r o n m e n td e v e l o p m e n t ) 其实也是开发计算机用户界 面。在国内，为了与国外先进人机交互发展技术相接轨，9 7 3 、8 6 3 、十五计划先后将人 机交互列为主要内容，当然我国的用户界面开发还落后于国际同类研究。我国的用户界 面研究主要体现在支持界面的软件和硬件，还没有深入到用户界面自身的研究。可是用 户界面的研究在软件开发中极其重要，甚至是一门独立的学科，所以发展我们自己的用 户界面开发技术势在必行。希望我们的研究能在我国软件开发中尽一份微小的力量，同 时也希望s p i g t 这个设计思路能为今后的类似工作起到有益的借鉴作用。 本文的研究受到国家“八六三”高技术发展研究计划项目( 编号：2 0 0 6 a a 0 1 2 3 2 8 ) 、 中科院计算机科学国家重点实验室开放课题基金项目( 编号：s y s k f 0 7 0 4 ) 及国家自然 2 西北大学硕士学位论文 科学基金项目( 编号：6 0 8 7 3 0 9 5 ) 的资助。 1 2 研究的现状分析 随着软件更新速度加快，这就需要在软件开发的过程中加快开发速度，以满足用户 对软件的需求。因此在软件开发过程中使用用户界面开发工具将会节省开发人员的大量 时间和精力，以提高软件开发速度。 目前国外的用户界面开发工具大致可以分为：基于代码转换的工具、基于形式化的 工具和基于模型的工具。i b m 的w 曲s p h e r et r a n s e o d i n gp u b l i s h e r i 6 j 就是一种基于代码 转换的用户界面开发工具。如图1 1 所示，这个工具的基本思想是先用x m l 抽象描述 用户界面，再依据目标设备的不同转换与之相适应的代码。例如，如果目标设备是p c ， 那么代码就被转换成h t m l ，如果目标设备是手机，相应的语言会是j 2 m e 或者w m l 。 可以看出这种方法的优点显而易见，但是对于不同类型的设备，必须要开发特定的代码 转换器，使得工作量增多。面向对象描述语言h a d z e 是基于形式化的，是一种具有形式 语义和语法的语言。该语言基于z 和z + + ，提出超媒体应用的规范是建立在概念框架、 结构框架和视图框架三个方面之上，而且应用环境和超媒体平台也适用于这种方式【7 】。 这种方法有很多优点：一、开发过程中可以及时发现错误，避免将错误带到测试阶段； 二、在大幅度缩短开发周期的同时保证了软件的质量；三、提供了精确并且无二义性的 描述以方便理解界面信息。但是形式化方法比较复杂，对于非专业的普通开发者来说， 是很难上手使用的。 抽象层 控制层 表示层( x m l ，h t t p ) 代码转换形式转化 h t m l 绛乃zj 2 m e 协议网关 图1 - 1 代码转换模型 基于模型的思想主要是，g i u l i om 嘶等人根据任务模型，为不同的设备建立相应界 3 第一章绪论 面 8 】。这个方法的好处既考虑了开发平台的差异性，又保证了开发平台的交互性，此外 还使开发平台具有可用性。但是任务模型仍然强调任务分析，因此，任务模型属于领域 相关模型。由于考虑了对象的结构和关系，所以不能对界面的复杂性有一个直观而又全 面的研究，这就影响了模型的描述能力【9 】。 相对于国外成熟的用户界面开发技术，我国在该领域的研究还处于起步阶段，而且 这些研究专注于一般界面的开发，而对外部设备的界面开发极少涉及。例如，基于模型 的多设备用户界面设计是一种f m p 模型，在f m p 模型上结合模型驱动体系结构，建立 了多设备用户界面( m d u i ，m u l t i d e v i c eu s 0 1 i n t e r f a c e s ) 模型的方法，在这种方法中，对 模型间的转换规则做出了定义。还有一种方法是基于任务模型构建用户界面，该方法以 c a m e l e o n 框架为基础，选取任务模型和对话模型为标准，然后逐步向下转换得到最 终的用户界面【1 0 1 。 针对目前常用的图形用户界面系统过度依赖于特定的硬件平台和操作系统，而且在 开发过程中程序代码的复用率较低等一系列问题，许荣斌提出了一种基于多平台的图形 用户界面m p g u i ( m u l t i p l a t f o r i l lc n a p h i e a lu s e ri n t e r f a c e ) 。在这个系统中，为普通桌面 程序设计了一种跨平台的用户界面开发工具包，通过使用这个工具包可以提高图形用户 界面的可移植性【1 l 】。但是m p g u l 只能针对p c 机，却不能解决手机在用户界面方面的 问题。其中，关键的一点是该系统运用标准c + + 类库，实现用户界面开发的跨平台性， 因此，是通过基于代码的方式来解决问题，而对基于数据的要求只能是束手无策。 1 3 本文主要工作 本文所做的主要工作有： ( 1 ) 通过介绍传统用户界面开发方法，指出各种实现方法的局限性。为了更好地实 现用户界面，本文提出采用复用任务模型来解决问题的思想。 ( 2 ) 介绍了s v g 的特性及其主要应用，讨论了用s v g 统一描述各种手机设备界面 的可行性。利用s v g 中丰富的图形元素对象构造用户界面，对于用户动作的响 应可由s v g 支持的j a v a s c r i p t 实现。 ( 3 ) 在上述理论和技术的基础上，设计并实现一个基于s v g 的手机界面生成工具。 该工具支持可视化设计，可以从任务模型的角度设计用户界面，针对不同手机 显示设备的特性，利用自动布局算法自动生成合适的基于s v g 的用户界面，从 4 西北大学硕士学位论文 而解决了为不同的手机分别开发用户界面的问题。 1 4 本文的组织 本文主要分为五个部分： 第一部分：阐述了本文的研究背景和实用价值，分析了该领域在国内外的研究现状， 简要讨论了本文的研究工作和意义。 第二部分：介绍了s v g 的特性及其主要应用，通过介绍传统的用户界面开发方法， 得出这些方法的不足之处。讨论了用s v g 来统一描述各种手机设备界面的可行性，随 之提出一个基于s v g 的手机界面生成方法。 第三部分：首先提出s p i g t 的一个总的设计目标，接着给出具体的设计思想，最后 介绍了关键模型的设计。本章主要是服务于实现阶段，作为实现部分的重要参考。 第四部分：s p i g t 的实现部分。介绍了s p i g t 的基本实现算法和相关开发技术、 开发平台，并给出了s p i g t 主要模块的具体实现，最后通过一个应用实例来体现s p i g t 的完整实现。 第五部分：s p i g t 可用性测试，通过对s p i g t 进行规范的可用性测试，从而得出 s p i g t 具有广泛的实用性，符合我们提出的设计目标。 最后讨论了本文设计的不足和改进之处，对其后续的发展工作进行了展望。 5 西北大学硕士学位论文 第二章相关理论与技术研究 2 1 传统手机界面开发方法 传统手机界面开发方法主要分为三种： 一、针对特定的设备开发其自己的用户界面。也就是从开始设计到最终实现需要一 个完全重新开发的过程，随着设备的更新换代和开发平台的变化，开发过程周而复始的 进行。而之前开发出来的用户界面版本可能很难嵌入到新版本当中，只具有一定的参考 价值。 二、使用跨平台语言开发用户界面。目前最常用的就是j a v a 语言，利用j a v a 当中 的a w t 或s w i n g 设计用户界面，由于j a v a 语言的跨平台性，这种开发方法开发出的用 户界面具有跨平台性。 三、使用浏览器技术开发用户界面。比如，n e t s c a p e9 、f i r e f o x 3 0 ，这些浏览器都 支持不同的操作系统( w i n d o w s 、l i n u x 和m a co sx ) ，所以利用这些浏览器技术开发 出的用户界面也支持不同的操作系统。 2 2 传统手机界面开发过程中的问题 以上这些传统手机界面开发方法虽然在一定程度上实现了用户界面，但是仍然存在 着不少问题。首先，针对特定的设备开发其自己的用户界面，不仅会导致重复性开发， 而且还有可能使版本不一致，这无疑使得界面的开发效率低下，浪费了有限的人力物力， 与我们简化开发工作的初衷是不相符的；其次，在用j a v a 开发用户界面的情况下，由于 界面部分和应用逻辑部分紧密藕合，这就要求开发者必须同时掌握界面设计和应用逻辑 设计方面的技术，所以工作量将大大增加；最后，虽然用浏览器技术开发用户界面相对 比较简单，但是不同浏览器所支持的显示格式不同，所以需要进行代码转换，如果有n 个浏览器，那么这些浏览器之间就需要n * f n 1 ) 种代码转换工具，可见所要做的工作还 是很繁琐的。 其中，重复性开发在传统界面开发方法中是个最为严重的问题，要是能解决这个问 题，界面开发的方法将会很大程度地简化，最终使工作效率可以飞速提升。可是为什么 会导致重复性开发呢? 要解决这个问题我们还是先要了解一下问题的根源。 7 第二章相关理论与技术研究 这个问题主要是由于各种手机设备上的图形用户界面系统的差异而引起的。这些图 形用户界面系统主要有三类：1 、微软的w i n d o w sg u i ；2 、基于操作系统下的嵌入式 g u i ，如q t e m b e d d e d 、m i n ig u i ；3 、u n i x l i n u x 环境下基于x - w i n d o w 的g u i 。 w i n d o w sg u i 建立于操作系统的上层，是操作系统的扩充部分。w i n d o w sg u i 通过 向下调用库函数，实现应用程序的窗口操作，这是一种垂直的调用方式。其中g u i 应用 程序接口的组成部分包括：应用程序接口a p i 、微软基本类库m f c 和w i n d o w s 系统下 的可视化g u i 开发工具。w i n d o w sg u i 的优点是比较容易修改和扩充，但是建立在操 作系统上的特点决定了开发出的应用程序与操作系统紧密相关，所以，如果要对应用程 序进行移植还是比较困难的【1 2 1 。 现在主流的嵌入式g u i 有q t e m b e d d e d 、m i n ig u i ，其设计思想大致是相同的， 采用分层式结构：。如图2 1 所示： 图2 - l 嵌入式g 三层结构 该结构主要分为三层：抽象层、核心层、应用程序层。抽象层主要分为图形抽象层 ( g r a p h i c sa b s t r a c tl a y e r , g a l ) 和输入抽象层( i n p u ta b s t r a c tl a y e r , i a l ) ，抽象层是连接 核心层与硬件的一座桥梁，系统的硬件驱动程序在抽象层中具有极其相关的作用。位于 结构中间的核心层则是整个结构中最重要的一部分，核心层是通过c l i e n t s e r v e r 的运行 模式，在相应功能模块的配合下实现；最上层的应用程序层( a p i ) 是g u i 提供给用户 的编程接口 1 3 j 。 x - w i n d o w 系统在c l i e n t s e r v e r 的结构下，分为相关硬件的服务器部分和不相关硬 件的客户部分。由于客户进程和服务器进程都属于操作系统的用户进程，因此，他们并 不依赖于核心。这类图形的用户界面的主要组成部分为三大部分：显示模型和窗口模型 提供的接口x l i b 库、用户模型提供的xt o o l k i t 库以及m o t i ft o o l k i t 库，依据面向对象 的设计思想下的m o t i f 和o p e n l o o k 构件集，根据不同的功能，可以把构件分成若干个不 同的“类，使用这些“类”可以为用户提供创建和管理具体窗口的构件【1 4 】。这样，如 8 西北大学硕士学位论文 果硬件环境发生改变时，只是修改直接操作硬件的服务器部分，就能实现移植。 v i s i x 可视化界面 g a l a x y开发工具 m o t i ft o o l k i tm f c xt o o l k i tw i n d o w sa p i x l i b xw i n d o ww i n d o w s u n i xw i n d o w s 图2 - 2u n i x 和w i n d o w s 图形用户界面接口层次结构比较图 以上分别简略介绍了各种图形用户界面系统，从中不难看出这些方法有个相似的地 方，都是在某种操作系统上实现的，所以这些g u i 系统上开发的软件很难做出修改，更 不易扩充功能，当然最重要的就是移植性太差。 2 3 各种用户界面描述语言的比较 2 3 1x u l x u l ( x m l u s e ri n t e r f a c el a n g u a g e ) 是一种可用的r i a 技术，是由m o z i l l a 组织开发、 基于x m l 的用户界面描述语言，用于创建具有丰富动态特性用户界面的标记语言【1 5 】。 在x u l 中，定义了丰富的用户界面元素及布局方式，所以，界面元素的外观( 颜色，字 体等等) 可以通过属性设置或应用c s s 、图片进行定制；而对于元素的行为，通过脚本 j a v a s c r i p t 就可以定义，在具体的实现中，代码既可以直接放入s c r i p t 元素中，也可以 通过s c r i p t 元素中的r c f 属性导入。 x u l 复用了许多现存的标准和技术，包括c s s 、d t d 、j a v a s c r i p ta n dr d f 。用c s s 来控制界面风格，用d t d 来替代字符串，方便地实现本地化；用j a v a s c r i p t 来对用户界 面的操作做出反应，提供基本的逻辑编程，通过对象文档接口d o m 来动态控制用户界 面，同时能调用m o z i l l a 提供的丰富的底层a p i 来实现强大的功能，进行文件、网络、 图形等方面的操作，而且这种a p i 是完全跨平台的；用r d f 来存储独立于界面的数据， 传输信息【1 6 1 。 x u l 语言的标签主要由下列四种元素组成：布局元素( 比如h b o x ，v b o x ，g r i d 以及 s t a c k 等) ；构件w i d g e t s ( 比如t n c n u l i s t ，m e n u b a r ，t o o l b a r 以及b u t t o n 等) ； 9 第二章相关理论与技术研究 命令，加速键( 比如c o m m a n d 以及k e y s e t ) ； x u l 模板( 为u i 绑定后台数据，使用 r d f ) 。 目前流行的f i r e f o x 浏览器和t h u n d e r b i r d 邮件客户端都是由x u l 编写的，x u l 应 用可以在浏览器上运行，也可以安装在客户端主机上。当然x u l 应用的运行需要m o z i l l a 的支持，或许是一个限制，但m o z i l l a 提供多个平台的运行版本( w i n d o w s ，l i n u x 等等) 弥补了这一不足。 2 3 2x a m l x a m l 的全称是e x t e n s i b l ea p p l i c a t i o nm a r k u pl a n g u a g e ( 可扩展应用程序标记语 言) 。简单地说，x a m l 是一种基于x m l 的用户界面描述语言，被定制设计来描述应 用程序的用户接口。x a m l 标记和w i n d o w s 的控件很相似，但更加抽象，用途也更广 泛。每个x a m l 标记对应一个n e t 的f r a m e w o r k 类，并包含其中的方法、属性和事件。 在x a m l 脚本中可以设置属性和注册事件，每个t a g 对应的控件在运行时被实例化。 x a m l 可以用来定义文本、图像和控件的布局，这与h t m l 非常相似。使用x a m l 可 以定义应用程序初始的可视界面，并编写用于实现其他功能的代码。可以将程序代码直 接嵌入到x a m l 中，也可以将它保留在一个单独的文件内。 x a m l 描述的页( a v a l o n 中的概念) ，可以通过两种方式进行预览。一种方式是使 用l o n g h o r n 版的i e 进行装载预览，但是如果使用的n e t 语言是通过w i d g e t 来定义行 为，那么不管该w i d g e t 是自定义形式还是x a m l 预定义形式，都要编译应用程序；另 一种方式是直接编译，如同一般的w i n d o w s 程序那样运行，当然，我们也可以设置编译 选项将程序编译放到i e 中运行。相对于x u l 应用程序的运行方式，x a m l 在灵活性方 面有些欠缺，对于能否通过s c r i p t 脚本把应用放在正中直接运行而不需编译，现在看来 还没有实现【1 7 1 。 从当前x a m l 的发展形式来看，微软避开了所有w 3 c 的标准，比如s v g 、d o m ， 在x a m l 的实现上，加入了与w 3 c 的标准相似但不相兼容的技术。由于x a m l 的运 行环境局限在l o n g h o r n 上，所以，用户必须通过升级平台才能使用该技术，而且l o n g h o m 还尚未正式发布，因此，要想让x a m l 成为w e b 技术的扩展，并且被广大用户接受还 尚需时日。 2 3 3m d ( m l f l e x 是m a c r o m e d i a 发布的表示层服务器，在f l e x 的基础上，开发者可以开发新一 1 0 西北大学硕士学位论文 代的r i a ( r i c hi n t e r a c ta p p l i c a t i o n ) 。f l e x 应用程序框架主要由m x m l 、a e t i o n s c r i p t2 0 以及f l e x 类库构成。 m x m l 是一种基于x m l 的标记语言，它提供一种简便方法调用管理可视化元索， 这些可视化要素都是预先建立用于调用的。应用m x m l 可以建立网页的框架，但不能 像结构化语言那样进行计算判断。m x m l 将表示层问题从业务逻辑中剥离出来，从而 有助于开发人员实现应用程序可用性的最大化。 基于e c m a 2 6 2 标准的a c t i o n s c r i p t 是一种类似于j a v a s e r i p t 的强类型面向对象语 言。a e t i o n s e r i p t 可用事件监听器和处理器设置或检索组件属性值以及处理回调函数等， 用于弥补m x m l 不能编程计算的不足，增加组件之间的动态交互。a c t i o n s c r i p t 可以实 现处理事件、处理错误、在m x m l 语句中将数据对象绑定到f l e x 控件上。 开发人员使用m x m l 定义新组件( 可视组件) 的方式类似于建立m x m l 应用，根据 需要将预定义组件、a c t i o n s c r i p t 代码组合到m x m l 文件中，这样，这个经过组合的 m x m l 文件就可以定义了一个新的组件，并且组件名与文件名相同。这种定义方式简 洁直观，有效地提高了代码复用性，同时也可以使用a c t i o n s c r i p t 来定制组件( 非可视的 组件) 。这些扩展方式相当灵活方便，所以，在m x m l 应用中，我们可以直接使用自定 义组件名作为相对应的m x m l 标签【1 7 1 。 2 4s v g 可伸缩矢量图形格式( s v g ) 【2 j 是一种基于x m l 的标识语言，用来描述二维矢量 图形和矢量点阵混合图形。在i n t e m e tw e b 应用飞速发展的形式下，s v g 提出了基于文 本的矢量图像和动画标准来满足网络设计的需要。在s v g 规范中，定义了s v g 的特征、 语法、显示效果，规范中还包括模块化的x m l 命名空间( n a m e s p a e e ) 和s v g 文档对象模 型l o o m ) 。根据功能的异同，s v g 的主要对象分为基本要素对象( 图2 3 所示) 和页面描 述功能对象( 图2 4 所示) 。由于s v g 支持脚本语言，所以通过s c r i p t 编程可以访问s v g d o m 的元素和属性，也就是说，s v g 可以响应特定的事件，因此支持脚本语言的这个 功能增进了s v g 的动态和交互性能。在嵌入方式和脚本方式两种实现方式下，s v g 可 以轻松地采用动态和交互式方式进行绘图，此外，s v g 还具有超链接功能，并且可以定 义丰富多样的事件。可以看得出s v g 其实就是一个图形、图像和文字相结合的整体。 第二章相关理论与技术研究 2 4 1s v g 的特性 图2 3s v g 基本要素对象分类 图2 - 4s v g 页面描述功能对象 ( 1 ) 高品质矢量图 s v g 图像的清晰度适合任何屏幕分辨率或打印分辨率( d p i ) ，无论是2 0 0 d p i ，还是 1 2 西北大学硕士学位论文 5 0 0 d p i 甚至更高，都不会产生位图图像的马赛克现象。根据外部设备窗口的大小，s v g 可以自动进行图像的缩放。这时，我们就会联想到在用户界面开发时的一个难题：在用 户界面开发中由于显示设备的尺寸不同，对图像的处理而导致图像的失真，从而影响了 用户界面给用户的视觉感。如果应用了s v g 的这一特性，这一问题就可以轻松解决。 ( 2 ) 跨平台性 由于s v g 是通过x m l 来表达知识、传递数据，所以s v g 不仅跨越了平台( l 具有天然的与平台无关性) ，还跨越了空间( i n t e