山大人机交互技术课件06人机交互界面的表示模型与功能实现

1、第六章 人机交互界面的表示模型与功能实现 山东大学计算机学院第一节 人机交互界面模型分类与转换 山东大学计算机学院山东大学计算机学院3目的在界面设计的早期阶段，研究建立一种用户界面表示模型利用形式化的设计语言来分析和表达用户任务以及用户和系统之间的交互情况；使界面表示模型能方便地映射到实际的设计实现。 山东大学计算机学院4界面模型分类任务分解和分析能力模型（competence model）描述用户的目的行为模型（performance model）预测和描述用户合法的交互行为序列结构模型 constructional model系统组成模型山东大学计算机学院5本章主要内容 掌握三种模型：行为

2、模型主要从用户和任务的角度考虑如何来描述人机交互界面，将详细介绍GOMS，UAN及LOTOS模型。结构模型主要从系统的角度来表示人机交互界面。重点介绍状态转换网络（STN-State Transition Network）和产生式规则 ( Production Rule )。事件-对象模型是一种面向对象的表示模型，它将人机交互活动归结为事件与对象的相互作用。掌握如何由界面的行为表示模型转换到系统的结构模型。人机交互界面表示模型行为模型山东大学计算机学院7GOMS简介1983年由Card, Morgan和Newell 提出的。通过目标 (Goal)、操作 (Operator)、方法 (Metho

3、d) 以及选择规则 (Selection) 四个元素来描述用户的行为。GOMS是在交互系统中用来分析建立用户行为的模型。它采用“分而治之”的思想，将一个任务进行多层次的细化。山东大学计算机学院8GOMS1.目标 Goals 目标就是用户执行任务最终想要得到的结果,它可以在不同的层次中进行定义。 eg:“编辑一篇文章”-“编辑文章”（高层）； “删除字符”（低层） 2. 操作 Operators 操作是任务分析到最低层时的行为，是用户为了完成任务所必须执行的基本动作。 操作不能被分解，在GOMS模型中是原子动作。山东大学计算机学院9GOMS3. 方法 Methods 方法是描述如何完成目标的过程

4、。一个方法本质上来说是内部的算法，用来确定子目标序列及完成目标所需要的操作。关闭（最小化）窗口GOAL: ICONSIZE-WINDOW select GOAL: USE-CLOSE-METHOD MOVE-MOUSE-TO-WINDOW-HEADER POP-UP-MENU CLICK-OVER-CLOSE-OPTION GOAL: USE-L7-METHOD PRESS-L7-KEY山东大学计算机学院10GOMS4选择 Selection选择是用户要遵守的判定规则，以确定在特定环境下所要使用的方法。当有多个方法可供选择时，GOMS中并不认为这是一个随机的选择，而是尽量来预测会使用哪个方法,

5、这需要根据特定用户、系统的状态、目标的细节来预测要选择哪种方法。用户Sam: Rule 1: Use the CLOSE-METHOD unless another rule applies Rule 2: If the application is GAME, use L7-METHOD山东大学计算机学院11任务Editing的GOMS描述实例Task:EditingGOAL:EDIT-MANUSCRIPT GOAL:EDIT-UNIT-Task repeat until no more unit tasks GOAL:ACQUIRE-UNIT-TASK GET-NEXTif at end

6、of manuscript GET-NEXT-TASK GOAL:EXECUTE-UNIT-TASK GOAL:LOCATE-LINE select:USE-QS-METHED USE-LF-METHOD GOAL:MODIFY-TEXT select:USE-S-METHOD USE-M-METHOD VERIFY-EDIT 子目标间关系：顺序关系，选择关系山东大学计算机学院12GOMS应用GOMS是一种人机交互界面表示的理论模型，被称为最成熟的工程典范，该模型在计算机系统的评估方面也有广泛的应用。GOMS can save money!美国电话公司NYNEX利用GOMS分析一套即将被采用的

7、新的计算机系统的应用效果，结果发现效果不理想，放弃了使用新系统，为公司节约了数百万的资金。山东大学计算机学院13GOMS的局限性GOMS没有清楚的描述错误处理的过程，假设用户完全按一种正确的方式进行人机交互，因此只针对那些不犯任何错误的专家用户。GOMS对于任务之间的关系描述过于简单,只有顺序和选择.事实上任务之间的关系还有很多种（具体参见6.1.2节中LOTOS的介绍），另外选择关系通过非形式化的附加规则描述，实现起来也比较困难。GOMS把所有的任务都看作是面向操作目标的，而忽略了一些任务所要解决的问题本质以及用户间的个体差异，它的建立不是基于现有的认知心理学，无法代表真正的认知过程。 山东

8、大学计算机学院14LOTOS简介 LOTOS -Language Of Temporal Ordering Specification， T.Bolognesi, H.Brinskma, Introduction to the ISO Specification Language LOTOS”， 1987.国际标准形式描述语言，无二义性，适于描述具有并发、交互、反馈和不确定性等特点的并发（concurrent）系统中的行为。开始作为一种描述网络协议的语言，由于交互系统、特别是多通道交互系统有并发系统的特点，因此成为用来描述交互系统的行为模型。山东大学计算机学院15LOTOS基本思想系统的外部可

9、见行为可以看作是由一个有时序关系的交互序列组成。系统由一系列进程组成，进程同环境之间通过称为“关口”（gates）的交互点进行交互。两个以上的进程在执行同一个外部可见的行为时会发生交互操作，进行数据交换、信息传递、协调同步等操作。进程行为用“行为表达式”来描述，复杂的行为由简单的行为表达式通过表示时序关系的LOTOS算符组合而成。在将LOTOS思想用于人机交互的行为模型时，用进程之间的约束关系来描述交互子任务之间的关系。 山东大学计算机学院16LOTOS算符LOTOS算符主要有以下几种：T1 | T2（交替Interleaving)T1 T2（选择Choice)T1 | a1,.,an | T

10、2（同步Synchronization)T1 T2 （禁止Deactivation)T1 T2（允许Enabling)山东大学计算机学院17LOTOS实例山东大学计算机学院18中国象棋的LOTOS任务分解实例山东大学计算机学院19LOTOS与GOMS的结合LOTOS模型很好的描述了任务之间的时序约束关系，这些时序约束关系能更好的描述GOMS中子目标之间的关系。用GOMS模型描述任务的分解过程，而用LOTOS给出子任务之间的约束关系，这样就可以增加两种表示模型的表示能力。 山东大学计算机学院20结合GOMS和LOTOS的中国象棋程序的行为描述GOAL:中国象棋 : GOAL:运行 |: *GOA

11、L:走棋 ACTION:自动记录棋谱 : GOAL:当前方走 : OPRATOR:拾取棋子 OPRATOR:放置棋子 GOAL:对弈方走 OPRATOR:拾取棋子 OPRATOR:放置棋子 *GOAL:打谱 : OPRATOR:加速 OPRATOR:减速 OPRATOR:暂停 OPRATOR:恢复 GOAL:退出山东大学计算机学院21总结LOTOS与GOMS结合，可以清楚地了解整个目标层次及各目标之间的约束关系。但与GOMS同样存在无法描述目标异常结束的缺陷，同时当任务进行选择时用什么规则进行选择并未涉及。LOTOS最大的优越性在于可以构造一套现成的自动化工具，利用这些工具，可自动进行错误检测

12、，但它过于形式化的记法比较晦涩难懂。GOMS和LOTOS的结合可以很好地描述人机交互的较高级的任务，对于原子任务的形式化描述，上述模型并没有给出一个比较清晰的描述，下面讨论的UAN模型主要用于原子目标的描述。 山东大学计算机学院22UAN模型UANUser Action Notation, Hartson et al 1990.UAN是一种简单的符号语言，主要描述用户的行为序列以及在执行任务时所用的界面物理对象。 尽管UAN属于一种行为模型，但作为一种任务描述语言，它又涉及一定程度的系统行为的描述，因而它兼有行为模型和结构模型的一些特点。山东大学计算机学院23UAN模型的基本思想预定义一些标志

13、符：用户动作标志符条件标志符采用一种表格结构来表示任务界面被分解成一些类似层次结构的异步任务，每个任务的实现都用表格来描述，用户动作的关联性和时序关系由表格的行列对齐关系和从上到下、从左到右的阅读顺序来确定。任务（task）：任务名称（the name of task）用户行为界面反馈界面状态山东大学计算机学院24UAN预定义的动作标志符（部分）用户动作标志符：move_mouse(x,y) 移动鼠标至(x,y)release_button(x,y)在(x,y)位置释放鼠标按钮；highlight(icon) 使icon高亮显示；de_highlight(icon) 取消icon的高亮显示。用

14、户动作标志符：X，在某个图形对象上移动鼠标；， 按下鼠标；，释放鼠标；!, 使对象高亮显示；-!， 取消对象的高亮显示Display,显示图形对象；Erase, 取消显示对象。山东大学计算机学院25UAN预定义的条件标志符（部分）while(condition) TASK当条件condition为真时，循环执行任务TASK；if(condition) then TASK如果条件condition满足，则执行任务TASK；iteration A* or A+ 表示迭代操作；waiting 表示等待，可以等待一个条件满足，也可以等待任务中的一个操作执行。 山东大学计算机学院26UAN实例-单通道交

15、互任务：把文件拖入垃圾箱用户行为界面反馈界面状态mouse_down(x,y)drag_icon(x,y)mouse_up(x,y)then highlight(icon)show_outline(icon)then highlight(bin)then hide(icon) show_bin_full()if intersect(icon,x,y)icon=selectedif intersect(bin,x,y)if intersect(bin,x,y)山东大学计算机学院27UAN实例-多通道任务：drag and drop a file to the recycle bin用户行为界面反

16、馈界面状态2D鼠标语音then highlight(icon)show_outline(icon)then highlight(bin)then hide(icon)show_bin_full()if intersect(icon, x,y)icon=selectedif intersect(bin,x,y)if intersect(bin,x2,y2)mouse_down(x,y)drag_icon(x,y)mouse_up(x,y)PronounceMove_to+recycle_bin山东大学计算机学院28UAN实例-多通道任务：在桌面上把文件A拖入文件B用户行为界面反馈界面状态2D鼠标

17、语音then highlight(iconA)show_outline(iconA)then highlight(folderB)then hide(iconA)if intersect(iconA, x,y)iconA=selectedif intersect(folderB,x,y)if intersect(folderB,x2,y2)mouse_down(x,y)drag_icon(x,y)mouse_up(x,y)PronounceMove_to+B山东大学计算机学院29UAN总结UAN模型更接近于实现，界面状态和界面反馈用一般的程序语言描述，实现起来比较方便，当然这种描述由于接近于程

18、序语言，因此设计时需要一定的编程基础UAN模型在精确刻画各成分之间的各种平行和串行的时序关系方面尚显不足，任务之间的时序关系没有明确表示出来，当所描述的界面使用多种输入设备和有若干可选交互路径时，比较繁琐。 山东大学计算机学院30层次化的界面描述方法人机交互界面表示模型结构模型界面表示的行为模型和结构模型行为模型行为模型是从用户任务和完成目标角度描述界面模型描述任务或目标为了完成任务或达到目标所进行的行为序列结构模型结构模型从系统组成角度，描述如何通过交互序列完成交互任务。着重描述系统的反应和行为。从用户角度看，行为模型强调做什么，结构模型强调怎么做结构模型产生式规则-Production R

19、ule状态转换网络-State Transition Network产生式规则 又称为上下文无关文法，将人机交互对话看作是一种语言，运用基于语法的方法来描述交互对话。产生式集合定义了用户与计算机交互所运用的语言。产生式规则的一般形式是：if condition then action这些规则可以表示为不同的形式，如condition actioncondition：action 产生式规则系统不断用产生式规则来检测用户的输入是否与这些条件相匹配。若匹配则激活相应的动作，这些动作可以是执行应用程序的一个过程，也可以是直接改变某些系统状态的值。一般来说，组成界面描述的产生式规则很多，所有的规则都是

20、有效的，规则定义的顺序并不重要，只要与规则中的条件相匹配，就可以激活相应的动作。产生式规则系统可以是事件引导；状态引导；混合引导事件引导的系统 用户在屏幕上绘制直线Sel-line start-line C-point start-line rest-line C-point rest- line rest-line D-point rest- line 事件引导的系统产生式规则的条件和动作部分都以事件的方式进行表示。事件主要有三种类型：用户事件（user event），Sel-line表示从菜单中选择line命令，C-point 和D-point表示用户在绘图平面上单击和双击鼠标。内部事件，

21、用于保持对话状态，如start-line 表示开始画线后的状态，rest- line表示选择了第一个点之后的状态。系统响应事件，以尖括号表示可见或可听的系统响应，如，把菜单项line高亮度显示，表示在屏幕上显示直线， 表示橡皮筋绘制方式打开，表示橡皮筋绘制方式关闭。 事件引导实现方法保存内部事件序列构造一个对话控制器，主要负责事件的产生和规则的匹配规则的匹配算法影响系统的性能状态引导的系统事件引导的系统中的内部事件，是事件还是状态？在系统内存保存的不再是动态的随时进出的事件，而是一些表示系统的当前状态的属性，这些属性在不同的时刻有不同的值。状态定义Mouse:mouse-null, selec

22、t-line, click-point, double-clickLine-state:menu, start-line, rest-lineRubber-band:rubber-band-on, rubber-band-offMenu:highlight-null, highlight-line, highlight-circleDraw:draw-nothing, draw-line产生式规则Select-linemouse-null start-line highlight-lineClick-point start-linemouse-null rest-line rubber-ban

23、d-onClick-point rest- linemouse-null draw-lineDouble-click rest-linemouse-null menu draw-line rubber-band-off混合引导的系统可以将两者结合起来，采用下面的形式：event: condition action 来描述一个产生式规则。事件用来激活产生式规则，如果条件不满足，即当前系统内存中的状态和产生式的规则不匹配，则无法激活规则。当状态改变时，产生式规则中的action本身也可以产生新的事件，从而可以激活另一条规则。 混合引导的系统 系统有三个属性：Bold: off, onItalic:

24、 off, onUnderline:off, on混合引导系统的产生式select- bold:Bold = off Bold = onselect- bold:Bold = on Bold = offselect-italic: Italic = off Italic = onselect-italic: Italic = on Italic = offselect-under:Underline = off Underline = onselect-under:Underline = on Underline = off产生式规则总结描述操作时序能力强，并发顺序均可无法描述误操作界面复杂时

25、，状态、事件复杂，产生式过多，要求产生式匹配算法性能高状态转换网络状态转换网络（STN）的基本思想是定义一个具有一定数量状态的转换机，称之为有限状态机-Finite State Machine(FSM)。FSM从外部世界中接收到事件，并能使FSM从一个状态转换到另一个状态。这里介绍两种最基本的状态转换网络，状态转换网络（State Diagrams）和扩展状态转换网络(State Charts)，后者是前者的一个扩展。传统的状态转换网络当发生一个外部或内部事件时，系统就会从一个状态转换到另外一个状态，这称为状态转换。外部事件主要由用户操作外部输入设备来产生。内部事件可以是系统产生的事件，如时钟

26、事件，也可以是为了改变系统的状态和行为而产生的事件，如当一个任务完成后可以激活另一个任务等。一个状态转换与一对状态相关联。一般的系统具有很多个状态，假设系统由n个状态组成，状态之间的转换最多可能有n*(n-1)个。简单的三状态FSM最多可能有6个状态转换带条件和动作的状态转换选项条件(conditions)，表示导致状态的改变的条件；选项动作(actions)，表示系统在改变状态时将执行什么动作。带条件的状态转换实例带条件的状态转换实例基于鼠标的画图工具draw circle单击在圆周上rubber band单击在中心点highlight circle选择 circle Circle1Menu

27、Finish Circle2draw line双击rubber band单击在第一点highlight line选择 lineLine1Finish Line2传统状态转换模型的优缺点状态转换网络的优点比相应的文本解决方案更易于设计、理解、修改和文档化它给出了对行为的精确的、甚至是格式化的定义。存在着一定的局限性最大的缺陷是需要定义出系统的所有状态，这对于小型的系统是没有问题的，但是在一个较大的系统中，系统会很快崩溃状态的数目是呈指数级增长的，同时状态的增长直接导致了状态转换网络过于复杂、无法实际应用。 扩展状态转换网络弹出 graphics子菜单选择 graphics主菜单 graphics

28、 子菜单弹出text 子菜单选择 text text 子菜单弹出 paint 子菜单选择 paint paint 子菜单山东大学计算机学院54带有取消功能的状态转换图弹出 graphics子菜单选择 graphics主菜单 graphics 子菜单弹出text 子菜单选择 text text 子菜单弹出 paint 子菜单选择 paint paint 子菜单ESC正常完成正常完成正常完成ESCESC山东大学计算机学院55带有帮助功能的状态转换按下HELP按钮按下HELP按钮从菜单出发draw circle单击在圆周上rubber band单击在中心点Circle1Finish Circle2帮

29、助子系统帮助子系统状态转换模型的优缺点优点具有良好的描述串行和顺序行为的能力比相应的文本解决方案更易于设计、理解、修改和文档化它给出了对行为的精确的、甚至是格式化的定义缺点状态的爆发式增长问题并发及其他行为的描述能力差虽然是一个结构模型，但难以实现行为模型和结构模型的转换 转换算法 行为模型(G-U-L) 结构模型State ChartsGOMSUANLOTOS约束规则用户Domain ExpertDesigner 模型转换整体框架山东大学计算机学院58模型转换整体框架 整个框架分为三个部分：行为模型使用G-U-L模型，在这一层将产生一个基本的预测性的行为模型。 结构模型采用层次状态转换网络，

30、它涉及到的元素有状态、转换、事件、层次结构。不考虑状态转换网络在转换中条件和同步，可以简化转换工作。 用户包含两种用户，领域专家和设计者。G-U-L模型的创建主要是由领域专家和设计者合作来完成的，然后通过模型转换算法转换成为结构模型，最后提供给设计者使用。 山东大学计算机学院59转换算法 1.基本思想 2.基本步骤 3.实例应用 山东大学计算机学院601.基本思想 采用G-U-L以层次化结构对任务进行建模，包括目标（包括循环属性）、行为、关系。状态转换网络表示的是状态之间的转换，也采用层次化表示，涉及到的主要是状态、转换、事件、行为。在G-U-L中体现的层次关系转换到状态转换网络中也体现出层次

31、的关系，G-U-L中的每个目标都对应一个状态转换网络。如果一个目标下层有子目标，对子目标来说，它所对应的状态网络应该嵌套在上层目标对应的状态网络中。 山东大学计算机学院611.基本思想在产生的状态转换网络中，有两类事件起作用：一类是外部由用户激活的事件，如“按下鼠标” 事件、“点击键盘” 事件等；另一类是内部由目标产生的内部事件，这里只定义了“目标正常结束”，表示目标正常结束时产生的事件。在进行从G-U-L到状态的转换时，这些事件只是形式上的一个定义，没有具体的实现过程，如要在某一层出现的第i个外部事件用“外部事件i”来代替，而由某个目标Ti执行时产生的内部事件也仅仅用类似于“Ti正常结束事件

32、”来表示，而具体的事件还需要由状态网络进行，系统实现时通过专门的事件管理器来定义和管理。 对G-U-L中的行为在转换后就成为对应的状态转换网络中的一个行为。 山东大学计算机学院62 事件产生过程G产生“G正常结束”事件S0F图 中描述了一个目标层次中产生事件的过程。山东大学计算机学院632.基本步骤对转换后的数据，存储的是状态转换网络中表示转换的弧，如下图所示： 状态转换网络中弧的表示结构 其中的触发事件就是触发从出发状态到目的状态转换的事件；父状态表示的是当前弧所在状态网络的上层状态，可以是一个抽象出来的状态名；出发状态目的状态触发事件父状态行为山东大学计算机学院642.基本步骤转换基本步骤

33、（1）读取存储G-U-L模型的数据文件，进行解析，定义一个数组stn用于存储状态网络中的弧。获取G-U-L模型中的最高目标，设为G0，然后调用(2)中的Translate函数，在Translate执行完毕后，stn中便存储了转换后的状态网络的数据。函数示意如下：main()定义一个存储弧的数组stn读取G-U-L文件GOAL G0”: 允许关系处理 case “|”: 交替关系处理 case “”: 禁止关系处理 /对所有的子目标进行递归调用 for(int I;I(G0,G1)，在这种关系中完成目标G的路径只有一条，当G0成功结束后才允许G1执行，这是一个顺序执行的过程。在转换成状态转换网络

34、后如图6-17所示。 图6-17 允许”关系状态网络G1正常结束事件G0正常结束事件外部事件S1S2S0产生G正常结束事件“允许”关系状态网络G2正常结束事件G0正常结束事件外部事件S1S3S0产生G正常结束事件S2G1正常结束事件(G0，G1，G2)山东大学计算机学院73从状态S0在外部事件激发转换至S1，在S1状态等待“G0正常结束事件”发生后转换至S2；然后在S2处等待“G1正常结束事件”转换至S0，这样表示目标G执行完毕，同时发生动作“产生G正常结束事件”，处理转换过程中存储所有的弧。这种约束关系允许同一层次下有多个目标存在，如(G0,G1,Gn)，这些目标都是顺序执行。 山东大学计算

35、机学院74设目标G下的子目标关系为|(G0,G1)，表示两个目标之间一种任意的组合来执行完成。在转换到状态网络后，如图6-18所示，有S0-S1-S4-S0和S0-S2-S3-S0两条途径可以完成目标G的一次执行。 图6-18 “交替”关系状态网络G0正常结束事件S2G1正常结束事件G0正常结束事件 外部事件0S0S3S4S1产生G正常结束事件产生G正常结束事件G1常结束事件 外部事件1“交替” 关系状态网络山东大学计算机学院75从S0状态，如果产生“外部事件0”，依次等待“G0正常结束事件”、“G1正常结束事件”并最终回到S0状态，同理，若产生“外部事件1”，则会沿着另一条路径回到S0。记录

36、下所有状态转换的弧。在有交替关系的层次中最多只允许有两个状态存在。 山东大学计算机学院76设目标G下的子目标关系为(G0,G1)，一旦G1任务被执行，G0便无效（不活动）。这个关系在转换到状态网络以后与前面不同的是，在状态S2被“G1正常结束事件”激活以后，不会再回到S0,而是转到了一个新的状态F。在有禁止关系的层次中最多只允许有两个目标状态存在。一个典型的例子是G0=”运行”，G1=”退出”。在执行退出以后整个程序结束，也就无法再回到运行状态了。 G0正常结束事件产生G正常结束事件G1正常结束事件外部事件0外部事件1S2S0F图6-19 “禁止”关系状态网络产生G正常结束事件S1“禁止” 关

37、系状态网络山东大学计算机学院773.实例应用 根据上面的转换算法，在图6-24a-c中给出了中国象棋的最高层目标、运行、走棋三个目标的状态转换网络，它们之间通过事件的产生和激活完成其层次间的通信。其他目标的状态网络表示与这三个图类似，在这里没有列出。山东大学计算机学院78运行正常结束事件外部事件1外部事件0退出正常结束事件S0S1S2F图6-20a 最高层目标状态转换网络最高层目标 山东大学计算机学院79运行 产生运行正常结束事件产生运行正常结束事件走棋正常结束事件打谱正常结束事件S02外部事件1打谱正常结束事件走棋正常结束事件外部事件0S00S03S04S01图6-20b “运行”目标状态转

38、换网络山东大学计算机学院80走棋 图6-20c “走棋”目标状态转换网络走棋 对弈方走正常结束事件产生走棋正常结束事件当前方走正常结束事件外部事件S001S002S000山东大学计算机学院81习题1.设计一个“在图书馆借阅图书”任务的GOMS模型。要求：结合任务设计的背景知识，熟练运用GOMS原理，从GOMS的四个方面完成任务模型的创建。2、对上题中的GOMS模型中的原子目标，创建UAN模型，从而进一步了解UAN模型的在行为模型中的地位和作用。结合LOTOS算符，用G-U-L进一步完善任务的描述。 第二节 人机交互界面表现模型与描述语言 山东大学计算机学院人机交互界面表示模型1）行为模型：该模

39、型主要从用户和任务的角度考虑如何来描述人机交互界面。2）结构模型：该模型主要从系统的角度来表示人机交互界面。本节将重点介绍产生式规则和状态转换网络。3）模型转换：主要介绍行为模型到结构模型的转换。4）表现模型：主要介绍人机界面表现的具体描述方法。课程目标掌握表现模型了解界面描述语言山东大学计算机学院85表现模型表现模型(PM)描述了用户界面的表现形式，由层次性的交互对象组成。交互对象一般由抽象交互对象(AIO - Abstract Interactive Object)和具体交互对象(CIO - Concrete Interactive Object)组成。管理信息系统的交互界面：填表界面界面

40、元素：界面元素属性，对几何对象、内容对象、绘制对象的描述面板：界面元素的模型定义+界面元素的列表和布局的定义XML描述面板用户界面逻辑组织结构森林的结构每棵树是一个面板叶结点是单位界面元素对象 (a)面板用户界面的图形显示 (b)面板用户界面的数据结构表示 (c)面板用户界面的绘制靠链表的头部越近，在屏幕上显示的排列顺序越靠前Eg:选中了面板C面板内部的事件分发及响应方式指点设备事件的响应当鼠标落在了An和By的相交的图形表示区域时搜索当前面板链表中的面板，判断鼠标是否落在了某一面板内部，发现鼠标落在了面板A内事件处理中心采用树的广度优先搜索算法或是深度优先搜索算法，判断鼠标是否落在了面板A中

41、某一界面元素交互对象内部，发现鼠标指针的位置在交互对象An区域内部检验An是否添加了对鼠标事件的监听， 如果An存在对鼠标事件的监听， 那么去完成事件要执行的任务用户产生了一个动作后，事件处理中心就获得了用户的动作和屏幕上的一个坐标(x, y)。使用链表搜索算法遍历链表中每个节点 if (坐标落在了某个面板区域内部) 显示该面板及面板内包含的所有界面元素，其余面板按照原来的先后顺序排列； 使用树的搜索算法遍历面板内的每个的单位界面元素 if (坐标落在了某个单位界面元素的区域内部) then if(Succeed(聚焦并激活单位界面元素) if (选中的单位界面元素添加了特定事件的响应) th

42、en 将控制权交给单位界面元素交互对象，执行该事件要执行的任务，返回； 所有面板失去焦点，聚焦到系统要显示的默认界面；面板间的关系Logical Window (LW)：任意AIO的组合，一个物理窗口、子窗口区域、对话框和面板。Presentation Unit (PU)：一个PU被定义为一个完整的表现环境需要实现一个特定的交互任务。每个PU可以分解为一个或许多同时、交替或是以某种组合的形式在屏幕上显现的 LW。每个PU至少存在一个主窗口，允许其它窗口导航。基于面板的用户界面表现模型面板间的关系面板间的关系并列关系:两个面板在功能上独立的，没有任何其他关系。嵌套关系:面板A在面板B的内部，面板

43、A包含面板B。依赖关系分为两种，一种是界面内部的依赖，即父子关系的面板，父子关系是指面板B依赖于面板A的某个界面元素开启显现活动的命令开关，这样，就称面板A是面板B的父面板。对服务的依赖，即分布式应用中的面板。触发窗口是指面板依赖于某个服务的存在而显现面板界面分类独立显现的自由面板(FreePanel)、面板面板(PanelPanel)、原子面板 (ComponentPanel)独立显现的面板一般是可以单独运行的应用程序界面，具有依赖性的面板是可独立显现的自由面板的一种特殊的形式面板面板是用户定义的可以嵌套到任意面板的而且不能独立显示的界面块原子面板是面板中的最小单位，是不可再分的面板。界面描

44、述语言命令式语言要求编程人员明确指定如何执行任务C+, android陈述式语言要求编程人员只需要指定任务要做什么（抽象）从XML获取语法和句法界面描述语言界面：使用陈述性知识描述界面，使用过程进一步解释。陈述性知识：给出事物本身的属性及事物之间的相互关系，对问题的解答隐含在知识中。过程性知识：给出解决一个问题的具体过程。陈述性语言用户界面标记语言(UIML)由结构(structure)、样式(style)、内容(content)、行为(behavior)四个方面来描述用户界面标记语言(UIML)结构：列举了一系列界面部件何在不同的平台中对应的组织；样式：定义界面部件中各种属性对应的值；类似H

45、TML样式表；内容：讲文本、声音、图片与界面部件做关联，使得不同用户组的界面国际化或自定义更为便利；行为：定义起作用的用户界面事件和应该做什么。陈述性语言扩展界面标记语言(XIML)由组件(Components)、关系(Relations)和属性(Attributes)三部分构成组件：定义了任务、域、用户、表现和对话五类扩展界面标记语言(XIML)任务：描述界面支持的业务流程或用户任务，定义任务和子任务层次性的分解，在任务之间定义期望的流程和任务的属性。域：数据对象的集合，有层次结构的类对象，该层次结构类似于本体的本质，但只在基本层次上，对象通过“属性-值对”组成。 用户：定义一个等级树，等级

46、中的一个用户，可以表示一个用户组或是用户个体。Eg: 用户为 医生，也可以是Smith医生表现：由层次性的交互元素组成用户界面中与用户通信的具体对象。Eg:窗体，按钮，滑块等对话：定义了有结构的元素集对使用界面的用户有效的交互动作，例如单击、声音、手势等，对话指定了交互动作流，组成用户界面的导航，在本质上与任务组件类似，但在具体层次上执行，任务组件处在抽象层次上。关系：连接了一个组件内的或跨组件的两个或更多的XIML元素的定义，这些关系即时控制了组成用户界面的操作。属性：被赋予值的元素的特征。陈述性语言XML用户界面语言XULXUL提供创建现代图形界面大多数元素的能力。可以被创建的元素有：输入

47、控制，eg: Textbox, checkboxButtons或其他内容的Toolbar菜单栏上的菜单或上下文菜单Tab对话框，层次或制表信息的树控件、快捷键等第三节 窗口系统和用户界面管理系统山东大学计算机学院主要内容对交互应用系统实现三个层次上的支持窗口系统对交互应用系统实现的支持；软件开发环境对交互应用系统实现的支持；用户界面管理系统UIMS课程目标掌握窗口系统结构，交互事件处理方法，了解交互组建开发包和交互框架，掌握MVC模式。掌握UIMS的对话独立性和表示方法。6.3 窗口系统 窗口系统强调为程序员提供硬件设备独立性可以使交互系统的开发变得简单使交互系统的移植非常方便窗口系统为单一输

48、入输出设备建立多个抽象设备来实现其资源的共享6.3.1窗口系统结构 三种不同结构在各个应用程序内部实现和管理多任务移植起来不方便应用程序处理复杂在操作系统核心集中处理多任务管理 过分的依赖操作系统移植起来不方便多任务的管理可由独立的管理程序进行管理应用程序通过调用该管理程序提供的接口来实现对多任务的管理和设备的独立性操作 最容易移植的 客户应用程序客户应用程序客户应用程序客户抽象终端抽象终端抽象终端资源管理器设备驱动程序服务器设备鼠标窗口1窗口2窗口n键盘独立的管理程序的客户/服务器结构窗口系统由在服务器端运行的三部分程序组成资源管理器，是整个窗口系统的核心，负责多任务的管理，并通过设备驱动程

49、序来管理外部设备。设备驱动程序，负责外部设备的驱动，接受输入设备的输入，并将输入数据转换成统一的格式，通过设备驱动程序实现设备的独立性。抽象终端，负责和客户应用程序的接口，对每个应用程序由窗口管理程序为其分配一个抽象终端。6.3.2交互事件处理1）应用程序内部事件处理循环 服务器把用户的输入作为事件送给客户应用程序客户应用程序对传给它的所有的事件都做出响应，不同的事件采取不同的处理 早期的基于窗口系统的开发往往采用这种方式设备客户应用程序开始读输入处理输入退出?结束服务器应用程序事件处理循环交互事件处理2）事件注册方式事件处理过程事件处理中心负责事件的处理 应用程序登记处理的事件事件处理中心接

50、收事件，把事件和控制转向该事件注册的回应过程处理完后，回应过程把控制返还给事件处理中心 优点：应用程序不需要设计事件处理循环 事件处理中心处理事件的效率相对比较高 Java事件处理机制示例程序 应用程序开始启动通知者处理事件读输入请求回应退出？是否通知者 事件注册方式处理流程图发送给正确的回调函数向通知者注册回调函数结束6.3.3交互系统开发软件包 从用户角度讲，图形用户界面WIMP非常重要的特征就是将输入和输出行为与屏幕上的一个独立的对象连接在一起。从程序员的角度讲，即使是窗口系统，输入和输出也是分离的。为了帮助程序员实现输入和输出融合，需要在窗口系统之上，提供更高层的对交互系统实现的支持交

51、互系统开发软件包。交互系统开发软件包在窗口系统之上，提供更高层的对交互系统实现的支持提供一组已经定义好的交互对象使用这些组件编写应用程序根据需要定制交互对象使用交互系统开发软件包编程，可以增强界面的一致性交互系统开发软件包特性 这些组件可以被定义为一类交互对象这类交互对象可以在一个应用中多次激活不同的实例可以有微小的区别；复杂的交互对象可以由简单的交互对象构建 Java交互软件开发包抽象窗口工具包AWT （abstract window toolkits）将交互对象，如按钮、菜单、对话框等映射到Java类Button,Menu,DialogJava交互软件开发包-Swing组件JCompone

52、nt |AbstractButton|JToggleButton|JCheckBox |JColorChooser |JButton |JRadioButton |JFileChooser |JMenuItem |JLabel |JMenu |JMenuBar |JRadioButtonMenuItem |JPanel |JCheckButtonMenuItem |JToolBar |JScrollPane |JTextCompoment|JTextArea |JOptionPane |JTextFieldJPasswordField |JScrollPane |JEditorPaneJTex

53、tPane 6.3.4交互框架桌面方式下拉式菜单主要为用户提供相应的交互命令，一般在下拉式菜单下面还有一行图标表示的命令选择项，这些命令选择项是为了使用户快速选择命令而从下拉式菜单命令集合中选择的常用的命令，交互过程中经常用到的一些状态修改也会出现在菜单和工具栏中。工具栏有固定方式，也有浮动方式固定方式一般在框架的顶部位置，这种情况适应于工具栏中的命令较少，而且对屏幕空间不渴求的应用，像一般的信息管理信息系统的应用，浮动框可以贴合在框架的任何一边，即可以是一行，也可以是一列，或者是一个小的矩形网格面板，这种工具栏可以根据应用的要求设置多个，也可以根据实际情况由用户根据实际的需要打开和关闭浮动的

54、工具栏大部分应用在命令状态很多交互设计相对复杂的系统中，如图形图象像编辑设计软件和字处理软件，还有软件开发设计工具等。菜单按着模块组织成一个树性结构，树形菜单节点可以根据需要进行部分展开，这可以使得菜单区域即不受菜单空间的限制，又可以当菜单的层次比较深时不用每次像下拉式菜单那样逐层的从最高层到页节点，提高了交互命令选择的效率。状态栏，一般用于显示一些常用的静态信息和动态信息，状态栏一般分成几个部分，用于不同信息的显示，这种信息主要给用户一些对当前所处的环境的提示，如当前用户，时间、在线人数等等，当前正在进行的交互任务等等，当然系统开发者的某些信息一般也显示在这里，包括开发单位、联系电话和版本号

55、等，这个区域还有一个重要的应用就是用于显示需要较长时间才能完成的进度提示。工作空间多个窗口可以并列排列在框架中标签（table）页交互框架浏览器方式6.3.5MVC模型及Structs结构MVC模型模型视图控制用户显示键盘鼠标MVC模型 MVC模型视图 (View) View代表用户交互界面一个应用可能有很多不同的视图 对于视图的处理仅限于视图上数据的采集和处理，以及用户的请求 模型 (Model) Model负责业务流程/状态的处理以及业务规则的制定 是MVC最主要的核心，模型包含完成任务所需要的所有的行为和数据 MVC模型控制 (Controller) 控制器处理用户的输入 控制器在需要时还负责创建其它的界面和控制器 控制器决定哪些界面和模型组件在某个给定的时刻应该是活动的MVC模型优点可以为一个模型在运行时建立和使用多个视图 视图与控制器的可接插性模型的可移植性不足系统结构和实现的复杂性 视图与控制器间的连接过于紧密视图对模型数据的低效率访问Struts，MVC 的一种实现Struts 是一组相互协作的类、servlet 和 JSP 标记，它们组成一个可重用的 MVC设计。视图（View）JSP页面和表示组件基于Struts的应用程序中的视图部分通常使用JSP技术来构建。每一视图都是采用了定制标签库的JSP页面，这些定制标签库由Str