第9章图形用户界.ppt

第9章 图形用户界面设计,图形用户界面 (Graphical User Interface，GUI)是指人与计算机或计算机软件之间的图形化的交互方式一个设计良好的GUI，能够极大地方便用户操作，用户可以通过窗口、菜单、图标、按钮等方式操作计算机和运行软件在GUI中，计算机画面上显示的窗口、菜单、按钮等图形表示不同目的和动作，用户通过键盘、鼠标等设备进行选择或参数输入利用MATLAB进行各类科学研究的读者，如果需要向别人提供应用程序，或进行某种技术、方法的演示，或制作一个供反复使用且操作简单的专用工具，设计一个图形用户界面就成为一项必不可少的工作MATLAB为表现其基本功能而设计的演示程序demo 是使用图形界面的良好范例在Command Window窗口中运行Demo 打开图形用户界面后，只要用鼠标进行选择和点击，就可以浏览其丰富多彩的内容学习目标】熟悉GUIDE开发环境；掌握GUI的设计方法，学会设计包含菜单与常用控件的较复杂的GUI,9.1使用GUIDE创建GUI,MATLAB提供的图形用户界面开发环境是GUIDE（Graphical User Interface Development Environment），它提供了一组丰富的图形用户界面创建工具。

我们可以利用GUIDE对图形用户界面进行布局和编程本节对GUIDE的使用方法进行初步介绍9.1.1 GUIDE编辑界面简介,进入到GUIDE开发环境通常有如下三种方法：1.在MATLAB主窗口中，选择File菜单中的“New”菜单项，再选择其中的“GUI”；2.在Command Window中输入Guide，按【Enter】键；3.点击Matlab主界面工具栏上的Guide按钮首先会弹出“Guide Quick Start”对话框，如图9.1所示，其中的两个选项分别为“Create New GUI”（创建新的GUI）和“Open Existing GUI”（打开已经存在的GUI）Create New GUI”分别有以下GUIDE模板：Blank GUI(Default)（空GUI）；GUI with Uicontrols（带Uicontrols的GUI）；GUI with Axes and Menu（带坐标轴和菜单的GUI）；Model Question Dialog（模板提问对话框）点击相应的选项时可以在右侧看到相应的预览（Preview）选择“Save on startup as”时可选择改变生成文件的默认存储路径。

选择第一项：Blank GUI(Default)，并单击OK，可得如图2所示的布局编辑器（Layout Editor）界面，正在编辑的是一个空的GUI模板编辑器的各主要组成部分已经标注在图中选中组件面板（Component Palette）中的某一个组件，按下鼠标左键，拖曳，就可以把它放置在布局工作区（Layout Area）中布局编辑界面菜单栏（Menu Bar）下面是工具栏（Toolbar），其上是一些常用的快捷按钮，当鼠标停留在快捷按钮上方片刻，会弹出提示框提示按钮的名称下面介绍部分快捷按钮 Align Objects ：用来调整组件在GUI中的分布和排列，点击后界面如图9.3 所示；,Menu Editor：菜单编辑器用于给GUI添加并编辑菜单；Tab Order Editor：Tab顺序编辑器用于设置在GUI处于运行状态时，按下键盘的【Tab】键依次选择组件的顺序；M-File Editor：M文件编辑器设计好的GUI运行后一般会对应生成两个文件，一个是图形（.fig）文件，另一个是程序（.m）文件M文件编辑器可以打开程序文件进行编辑；Property Inspector：属性编辑器，用于设置在你设计当中各组件的各种属性，如名称、背景、颜色等；Object Browser：对象浏览器，用于浏览工作区中所有对象的层次结构；Run：运行GUI。

9.1.2菜单设计实例,菜单一般置于GUI的最上方，应用程序的几乎全部功能都包含其中按下 按钮，进入Menu Editor编辑器如图9.4所示，Menu Editor的快捷按钮从左至右依次为：,New Menu（新菜单） New Menu Item（新子菜单） New Context Menu（新右键菜单） Move Selected Item Backward Move Selected Item Forward Move Selected Item Up Move Selected Item Down（以上四项用来更改菜单项的前、后级别及上、下位置） Delete Selected Item（删除菜单）,点击菜单编辑器工具条中的 （New Menu）来创建父菜单；若要创建子菜单项，先选中父菜单项，点击（New Menu Item）按钮假设我们创建了如图9.5的菜单单击鼠标左键选定“Untitled 2”时同时选定右侧的选项“Check mark this item”（ 勾选此选项），而选定“Untitled 3”时同时选定右侧的“Separator above this item”（在此选项上方添加分割线）。

关闭“Menu Editor”并运行，得到如图9.6的结果鼠标单击菜单项“Utitled 1”时出现如图9.7 的结果注意“Untitled 2”之前的对号和“Untitled 3”上方的分割线细心的读者可能会发现，在“Menu Editor”中还有一个选项“Context Menus”，意思是右键菜单，可以给GUI中的某个对象定义Context MenuGUI处于运行状态时，当用户鼠标右键点击定义了文本菜单的对象后，会弹出相应的菜单，进而可选择菜单中的选项执行对应操作点击菜单编辑器工具条中的 （New Context Menu）来创建右键菜单注意之前要选择菜单编辑器的“Context Menus”标签界面子菜单项的创建方法同前通过修改GUI窗口某一组件的“UiContextMenu”属性的值可以建立组件和右键菜单之间的联系9.1.3包含控件的GUI设计实例,,如图9.8所示，组件面板中包含的控件有：Select：用来指示在GUIDE中控件的选中状态严格意义上说它不是一个独立的控件；Push Button：命令按钮，其作用是对用户的鼠标单击操作做出反应并触发相应的操作，其上的文本标识按钮的名称（下同）； Toggle Button： 切换按钮，又称开关按钮，通过鼠标点击它有两种状态，压下和复原，对应触发两种不同的操作；Radio Button：单选按钮，一般都是成组出现的，具有互斥的性质，即同组单选按钮中只能有一个是被选中的。

当单选按钮处于选择状态时，会在圆圈中显示一个黑色实心圆；,Check Box：复选框，通常用来标示一种选择状态，可以有选中、不选中两种状态；当一个选择框处于选择状态时，在小方框内会出现一个“√”；Static Text：静态文本，用于在GUI中显示特定的标识文本；Edit Text：文本编辑框，用户可在其中输入文本；Slider：滚动条，包括三个独立的部分，分别是滑槽、滑块和滑槽两端的箭头；使用该控件，用户可以沿着滚动槽拖动滑块来选择一个值；一般用于滚动其它控件，比如列表框、文本框等；,Panel：面板，用于将其它控件分组，面板内的控件将成为面板的子对象；可以给面板设定自己的名称和边界；Button Group：按钮组，类似于面板，但通常只用于容纳一组互斥的单选或切换按钮；Listbox：列表框，其内容一般是一组选项的列表，用户可以从列表中进行选择一项或多项；Pop-up Menu：弹出式菜单，当鼠标点击箭头时，会弹出一组互斥的选项清单，供用户选择其中的一项；Axes：坐标轴，可以在其中绘制二维或三维图形向GUI窗口中添加控件有两种方法：1. 从组件面板选择一个控件，按下鼠标左键不放，把它拖曳到设计工作区的合适位置，松开鼠标；2. 选中组件面板的一个控件，放开鼠标，这时光标变为十字形状，移动光标到合适位置，点击鼠标。

控件放置好后，选中它，可以通过拖曳控件大小缩放句柄改变控件所占区域的大小下面我们来创建一个简单的带控件的GUI首先分别添加一个Toggle Button、一个Checkbox、一个Radio Button，并将它们同时选中，如图9.9 所示然后选择“Align Objects” 把这这三个控件呈垂直居中对齐排列，如图9.10所示接下来双击Toggle Button（或先选择Toggle Button，再点击按钮），这时会弹出属性编辑器（Property Inspector）将其中的BackgroundColor属性值改为黄色（如图9.12），并将String属性的值改为“toggle_first”再来看设计工作区，我们发现Toggle Button控件的标识字符及背景颜色都发生了变化如图9.13所示,点击运行按钮，我们就可以看到运行后的GUI效果了（图9.14）每一个控件都有自己的属性常规属性有：1.控件风格和外观 1）BackgroundColor：设置控件背景颜色，通过3元素的RGB向量或MATLAB一个预先定义的颜色名称设置缺省为浅灰色2）CData：在控件上显示的真彩色图像，使用矩阵表示。

3）ForegroundColor：控件前景（文本）颜色，缺省为黑色4）String属性：控件上的文本内容，以及列表框和弹出菜单的各个选项5）Visible：控件是否可见2.对象的常规信息1）Enable属性： 表示此控件的使能状态，设置为“on”，表示可选，为“off”时则表示不可选 2）Style：控件对象类型，即常用的控件名称3）Tag：控件标识，相当于给每一个控件起的个性化的名字，由用户定义4）TooltipString：为控件设置的提示信息当鼠标指针停留在某一控件上时，显示设置的提示信息5）UserData：用户定义的与控件关联的数据，可通过命令“set”和“get”访问6）Position：控件对象的尺寸和位置，通常用一个四元向量[left bottom width height]表示7）Units：计量单位可设置为pixels、normalized、inches、centimeters、points、characters等，Guide环境下默认为normalizedNormalized为相对单位，规定父对象（如设计工作区窗体）左下角点坐标为（0, 0），右上角点坐标为（1.0, 1.0）;其它单位为绝对单位 (1 point = 1/72 inch) 。

8）有关字体的属性，如 FontAngle（字体倾斜）、FontName（字体名称）、FontSize（字体大小）和FontUnits（字体大小计量单位）等3.控件回调函数（Callback Routine）回调函数是指对控件施加一个动作时被执行的函数（对应一段程序），例如鼠标点击按钮，或用鼠标移动滚动条的滑块等经常用到的回调函数有：1）BusyAction：回调中断响应函数当控件的另一个回调函数正在执行时，又对此控件有触发动作，对此动作的相应处理，它属于一种中断响应有两种选项：即Cancel（取消中断事件）和queue（排队），后者为默认设置2）ButtonDownFcn：当在控件周围5个像素范围内按下鼠标键时执行的回调函数3）CallBack：与控件密切相关的标准回调函数，实现的功能因控件的不同而有不同的定义当对控件施加标准的动作时，执行该函数4）CreateFcn：在创建对象过程中执行的回调函数5）DeleteFcn：在删除对象过程中执行的回调函数6）Interruptible属性：指定当前的回调函数在执行时是否允许中断，去执行其它的函数。