Matlab及应用 - 第8章MATLAB 图形用户界面

1、Institute of Information Theory & Technology Center(ITTC)12Information Theory & Technology Center(ITTC) 什么是MATLAB图形用户界面设计？ 所谓图形用户界面所谓图形用户界面GUI (Graphical User Interfaces) 是指由是指由窗口、菜单、对话框等各种窗口、菜单、对话框等各种图形对象图形对象组成的用户界面组成的用户界面 在这种用户界面下，用户的命令和对程序的控制是通过在这种用户界面下，用户的命令和对程序的控制是通过“选择选择”各种图形对象来实现的。各种图

2、形对象来实现的。 图形对象 MATLAB图形用户界面设计Figure(图形窗口图形窗口)Uicontrol(用户控件用户控件)Axes(坐标轴坐标轴)Uimenu(用户菜单用户菜单)Line(曲曲线线)Surface(曲曲面面)Rectangle(方框方框)Patch(区域块区域块)Image(图像图像)Text(文字文字) Light(光源光源) Root(屏幕屏幕)3Information Theory & Technology Center(ITTC)菜单设计 对话框设计 可视化图形用户界面设计 主要内容34Information Theory & Technology

3、Center(ITTC) MATLAB的图形窗口有默认的菜单栏，也允许用户设计自己所需要的菜单系统 菜单对象是图形对象的子对象，菜单设计总在某一图形窗菜单对象是图形对象的子对象，菜单设计总在某一图形窗口中进行。口中进行。 建立用户菜单 uimenu函数函数 建立一级菜单项的函数调用格式为：建立一级菜单项的函数调用格式为： 一级菜单项句柄一级菜单项句柄=uimenu(图形窗口句柄图形窗口句柄，属性名，属性名1，属性值，属性值1，属性名属性名2，属性值，属性值2，) 建立子菜单项的函数调用格式为：建立子菜单项的函数调用格式为： 子菜单项句柄子菜单项句柄=uimenu(一级菜单项句柄一级菜单项句柄，

4、属性名，属性名1，属性值，属性值1，属性名属性名2，属性值，属性值2，)菜单设计可以缺省，缺省为当前窗口可以缺省，缺省为当前窗口必须指定必须指定5Information Theory & Technology Center(ITTC) 菜单对象具有Children、Parent、Tag、Type、UserData、Visible等公共属性，除公共属性外，还有一些常用的特殊属性。 菜单条的提示名称菜单条的提示名称 Label：它可以是一个任意字符串。在菜单项提示的它可以是一个任意字符串。在菜单项提示的字符串中允许用户使用字符串中允许用户使用 标志，以表示该符号后面的字符在显示时有标志，以

5、表示该符号后面的字符在显示时有一个下划线修饰，这使得用户可以用一个下划线修饰，这使得用户可以用Alt键加该字符键来激活相应的菜键加该字符键来激活相应的菜单项。单项。 回调函数回调函数 Callback：它可以为一个函数名称，也可以是一组它可以为一个函数名称，也可以是一组 MATLAB 命命令。在该菜单被选中以后，令。在该菜单被选中以后， MATLAB将自动地调用此回调函数来作出对将自动地调用此回调函数来作出对相应菜单项的响应，如果没有设置一个合适的回调函数，则此菜单项也相应菜单项的响应，如果没有设置一个合适的回调函数，则此菜单项也将失去其应有的意义。将失去其应有的意义。快捷键快捷键accele

6、rator：取值为任意字母，定义菜单的快捷键为取值为任意字母，定义菜单的快捷键为CTRL+字母字母使能状态使能状态enabled：取值为取值为on/off，若为，若为off,则菜单项呈灰色，不能使用则菜单项呈灰色，不能使用该菜单该菜单分隔符分隔符separator:取值为取值为on/off,若为若为on,则在该菜单项上方添加一条分隔则在该菜单项上方添加一条分隔线线菜单对象常用属性6Information Theory & Technology Center(ITTC) 建立图形演示系统菜单。菜单条中含有3个菜单项：Plot、Option和Quit。Plot中有Sine Wave和Cos

7、ine Wave两个子菜单项，分别控制在本图形窗口画出正弦和余弦曲线。Option菜单项包含Grid on， Grid off， Box on，Box off和Window Color子项，其中Grid on和Grid off控制给坐标轴加网格线，Box on和Box off控制给坐标轴加边框，而且这4项只有在画有曲线时才是可选的。Window Color控制图形窗口背景颜色。Quit控制是否退出系统。 程序如下：figure(Color,1,1,1,. Name,图形演示系统,NumberTitle,off,MenuBar,none);菜单设计举例7Information Theory &a

8、mp; Technology Center(ITTC)%定义Plot菜单项hplot= uimenu(gcf,Label,Plot); uimenu(hplot,Label,Sine Wave,Call,. t=-pi:pi/20:pi;,plot(t,sin(t);,. set(hgon,Enable,on);,. set(hgoff,Enable,on);,. set(hbon,Enable,on);,. set(hboff,Enable,on);); uimenu(hplot,Label,Cosine Wave,Call,. t=-pi:pi/20:pi;,plot(t,cos(t);,

9、. set(hgon,Enable,on);,. set(hgoff,Enable,on);,. set(hbon,Enable,on);,. set(hboff,Enable,on););菜单设计举例（续）8Information Theory & Technology Center(ITTC)%定义Option菜单项hoption=uimenu(gcf,Label,Option);hgon=uimenu(hoption,Label,Grid on,.Call,grid on,Enable,off);hgoff=uimenu(hoption,Label,Grid off,.Call,

10、grid off,Enable,off);hbon=uimenu(hoption,Label,Box on,.separator,on,Call,box on,Enable,off);hboff=uimenu(hoption,Label,Box off,.Call,box off,Enable,off);hwincor=uimenu(hoption,Label,&Window Color,Separator,on);uimenu(hwincor,Label,Red,Accelerator,r,.Call,set(gcf,Color,r););uimenu(hwincor,Label,B

11、lue,Accelerator,b,.Call,set(gcf,Color,b););uimenu(hwincor,Label,Yellow,Call,.set(gcf,Color,y);); uimenu(hwincor,Label,White,Call,.set(gcf,Color,w);); 菜单设计举例（续）9Information Theory & Technology Center(ITTC)%定义Quit菜单项uimenu(gcf,Label,Quit,Call,close(gcf);菜单设计举例（续）10Information Theory & Technolo

12、gy Center(ITTC) 快捷菜单是用鼠标右键单击某对象时在屏幕上弹出的菜单 这种菜单出现的位置是不固定的，而且总是和某个图形对象相联系。 在MATLAB中，可以使用uicontextmenu函数和图形对象的UIContextMenu属性来建立快捷菜单，具体步骤为：(1) 利用利用uicontextmenu函数建立快捷菜单。函数建立快捷菜单。(2) 利用利用uimenu函数为快捷菜单建立菜单项。函数为快捷菜单建立菜单项。(3) 利用利用set函数将该快捷菜单和某图形对象联系起来。函数将该快捷菜单和某图形对象联系起来。快捷菜单11Information Theory & Techn

13、ology Center(ITTC) 例 绘制曲线 y=2e-0.5xsin(2x)，并建立一个与之相联系的快捷菜单，用以控制曲线的线型和曲线宽度。x=0:pi/100:2*pi;y=2*exp(-0.5*x).*sin(2*pi*x);hl=plot(x,y);hc=uicontextmenu; %建立快捷菜单hls=uimenu(hc,Label,线型); %建立菜单项hlw=uimenu(hc,Label,线宽);uimenu(hls,Label,虚线,Call,set(hl,LineStyle,:););uimenu(hls,Label,实线,Call,set(hl,LineStyle

14、,-););uimenu(hlw,Label,加宽,Call,set(hl,LineWidth,2););uimenu(hlw,Label,变细,Call,set(hl,LineWidth,0.5););set(hl,UIContextMenu,hc); %将该快捷菜单和曲线对象联系起来 快捷菜单示例12Information Theory & Technology Center(ITTC)菜单设计 对话框设计 可视化图形用户界面设计 主要内容13Information Theory & Technology Center(ITTC) 对话框是重要的信息显示和获取输入数据的用户

15、界面对象 是用户与计算机进行信息交流的临时窗口是用户与计算机进行信息交流的临时窗口 主要通过主要通过用户控件用户控件对象建立对话框对象建立对话框 对话框的控件按钮(Push Button)双位按钮(Toggle Button)单选按钮(Radio Button)复选框(Check Box)列表框(List Box)弹出框(Popup Menu) 编辑框(Edit Box) 滑动条(Slider) 静态文本(Static Text) 边框(Frame)对话框14Information Theory & Technology Center(ITTC)MATLAB提供了用于建立控件对象的函数

16、uicontrol，调用格式为： 对象句柄对象句柄=uicontrol(图形窗口句柄，属图形窗口句柄，属性名性名1，属性值，属性值1，属性名，属性名2，属性值，属性值2，) 各个属性名及可取的值和前面介绍的各个属性名及可取的值和前面介绍的uimenu函数相似函数相似控件对象的属性 公共属性公共属性 控件对象作为图形对象所具有的属性控件对象作为图形对象所具有的属性对话框的设计15Information Theory & Technology Center(ITTC) 公共属性 Children、Parent、Tag、Type、UserData、Visible 控件对象的基本控制属性 St

17、yle取值可以是pushbutton, togglebutton,radiobutton, checkbox, edit, text, slider, frame, popupmenu 或listbox Callback取值为字符串,可以是某个M文件名或一小段MATLAB语句，当用户激活某个控件对象时，应用程序就运行该属性定义的子程序。 String定义控件对象的说明文字，取值为字符串矩阵或数组 BackgroundColor定义对象的背景色，取值为颜色的预定义字符或RGB数值 ForegroundColor定义控件对象说明文字的颜色，取值为颜色的预定义字符或RGB数值 Units取值可以是p

18、ixelsz(像素）, normalized（相对单位）, inches（英寸）, centimeters（厘米）或points（磅） Max、Min:取值都为数值，默认值分别为1和0，不同的对象类型其意义不同。 Value取值可以是矢量，也可以是数值，其含义及解释依赖于控件对象的类型控件对象的属性16Information Theory & Technology Center(ITTC) 控件对象的修饰控制属性FontAngle取值为normal, italic, oblique,FontName取值为控件标题等字体的字库名FontSize取值为数值，FontWeight取值为poi

19、nts, normalized, inches, centimeters或pixelsHorizontalAligment取值为left,right,定义对齐方式 控件对象的辅助属性ListboxTop取值为数量值SliderStop取值为两元素矢量minstep,maxstep,用于slider控件Selected取值为on 或off控件对象的属性（续）17Information Theory & Technology Center(ITTC) 建立图形演示对话框。在编辑框输入绘图命令，当单击“绘图”按钮时，能在左边坐标轴绘制所对应的图形，弹出框提供色图控制，列表框提供坐标网格线和坐

20、标边框控制。clf;set(gcf,Unit,normalized,Position,0.2,0.3,0.55,0.36);set(gcf,Menubar,none,Name,图形演示,NumberTitle,off);axes(Position,0.05,0.15,0.55,0.7);%静态文本uicontrol(gcf,Style,text, Unit,normalized,. Posi,0.63,0.85,0.2,0.1,String,. 输入绘图命令,Horizontal,center);%编辑框hedit=uicontrol(gcf,Style,edit,Unit,normalize

21、d,. Posi,0.63,0.15,0.2,0.68,. Max,2); %Max取2，使Max-Min1，从而允许多行输入对话框设计示例18Information Theory & Technology Center(ITTC)%弹出框hpopup=uicontrol(gcf,Style,popup,Unit,normalized,. Posi,0.85,0.8,0.15,0.15,String,. Spring|Summer|Autumn|Winter,Call,. COMM(hedit,hpopup,hlist);%列表框hlist=uicontrol(gcf,Style,li

22、st,Unit,normalized,. Posi,0.85,0.55,0.15,0.25,String,. Grid on|Grid off|Box on|Box off,Call,. COMM(hedit,hpopup,hlist);%绘图按钮hpush1=uicontrol(gcf,Style,push,Unit,normalized,. Posi,0.85,0.35,0.15,0.15,String,. 绘 图,Call,COMM(hedit,hpopup,hlist);对话框设计示例（续）19Information Theory & Technology Center(ITT

23、C)%关闭按钮uicontrol(gcf,Style,push,Unit,normalized,. Posi,0.85,0.15,0.15,0.15,String,. 关 闭,Call,close all); COMM.m函数文件：function COMM(hedit,hpopup,hlist)com=get(hedit,String);n1=get(hpopup,Value);n2=get(hlist,Value);if isempty(com) %编辑框输入非空时eval(com); %执行从编辑框输入的命令 chpop=spring,summer,autumn,winter; chli

24、st=grid on,grid off,box on,box off; colormap(eval(chpopn1); eval(chlistn2);end对话框设计示例（续）20Information Theory & Technology Center(ITTC)菜单设计 对话框设计 可视化图形用户界面设计 主要内容21Information Theory & Technology Center(ITTC) MATLAB提供了可视化的用户界面开发环境(GUI Development Environment, GUIDE),实现“所见即所得” GUIDE可方便的创建GUI应用

25、程序, 它可以根据用户设计的GUI布局，自动生成M文件的框架，用户使用这一框架编制自己的应用程序。可视化图形用户界面设计22Information Theory & Technology Center(ITTC) GUI设计模板在MATLAB主窗口中，选择File菜单中的New菜单项，再选择其中的GUI命令，就会显示图形用户界面的设计模板。4种模板Blank GUI(默认) GUI with Uicontrols(带控件对象的GUI模板) GUI with Axes and Menu(带坐标轴与菜单的GUI模板) Modal Question Dialog(带模式问话对话框的GUI模板

26、) 当用户选择不同的模板时，在GUI设计模板界面的右边就会显示出与该模板对应的GUI图形。可视化图形用户界面设计23Information Theory & Technology Center(ITTC) 在GUI设计模板中选中一个模板，然后单击OK按钮，就会显示GUI设计窗口。选择不同的GUI设计模式时，在GUI设计窗口中显示的结果是不一样的。 GUI设计窗口组成部分 菜单栏 File（文件）、Edit（编辑）、View（查看）、Layout（布局）、Tools（工具）和Help（帮助） 6个菜单项，使用其中的命令可以完成图形用户界面的设计操作。 工具栏 Align Objects(

27、位置调整器、对齐)、Menu Editor(菜单编辑器)、Tab Order Editor (Tab顺序编辑器)、M-file Editor(M文件编辑器)、Property Inspector(属性查看器)、Object Browser(对象浏览器)和Run等15个命令按钮，通过它们可以方便地调用需要使用的GUI设计工具和实现有关操作。 控件工具栏 Push Button、Slider、Radio Button、Check Box、Edit Text、Static Text、Popup Menu、Listbox、Toggle Button、Axes等控件对象，它们是构成GUI的基本元素。 图

28、形对象设计区GUI设计窗口24Information Theory & Technology Center(ITTC)GUI设计窗口（续）25Information Theory & Technology Center(ITTC) 添加控件 从控件工具栏中选择一个对象，然后以拖拽方从控件工具栏中选择一个对象，然后以拖拽方式在该对象设计区建立该对象式在该对象设计区建立该对象 设置属性 双击该对象，就会显示该对象的属性编辑器。双击该对象，就会显示该对象的属性编辑器。 在选中对象的前提下，单击鼠标右键，会弹出一个快捷菜单，可以从中选择某个子菜单进行相应的操作。在对象设计区右击鼠标，会

29、显示与图形窗口有关的快捷菜单。GUI设计窗口的基本操作26Information Theory & Technology Center(ITTC) MATLAB的用户界面设计工具共有5个 对象属性查看器(Property Inspector)：可查看每个对象的属性值，也可修改设置对象的属性值。 菜单编辑器(Menu Editor)：创建、设计、修改下拉式菜单和快捷菜单 位置调整工具(Alignment Tool)：可利用该工具左右、上下对多个对象的位置进行调整。 对象浏览器(Object Browser)：可观察当前设计阶段的各个句柄图形对象。 Tab顺序编辑器(Tab Order E

30、ditor)：通过该工具，设置当用户按下键盘上的Tab键时，对象被选中的先后顺序。图形用户界面设计工具27Information Theory & Technology Center(ITTC) 对象属性查看器 功能： 查看每个对象的属性值，也可以修改、设置对象的属性值 打开方式 从GUI设计窗口工具栏上选择Property Inspector命令按钮， 选择View菜单下的Property Inspector子菜单 在MATLAB命令窗口的命令行上输入inspect对象属性查看器28Information Theory & Technology Center(ITTC) 菜单

31、编辑器 功能 创建、设置、修改下拉式菜单和快捷菜单。 打开方式 从GUI设计窗口的工具栏上选择Menu Editor命令按钮 选择Tools菜单下的Menu Editor子菜单菜单编辑器结构结构左上角左上角u第一个按钮用于创建一级菜单项，第二个第一个按钮用于创建一级菜单项，第二个按钮用于创建一级菜单的子菜单；第四个与按钮用于创建一级菜单的子菜单；第四个与第五个按钮用于对选中的菜单进行左移与右第五个按钮用于对选中的菜单进行左移与右移，第六与第七个按钮用于对选中的菜单进移，第六与第七个按钮用于对选中的菜单进行上移与下移，最右边的按钮用于删除选中行上移与下移，最右边的按钮用于删除选中的菜单。的菜单。

32、左下角左下角u第一个按钮创建下拉式菜单。第二个按钮第一个按钮创建下拉式菜单。第二个按钮创建创建Context Menu菜单。菜单。29Information Theory & Technology Center(ITTC) 位置调整工具 功能功能 对对GUI对象设计区内的多个对象对象设计区内的多个对象的位置进行调整。的位置进行调整。 打开方式打开方式 从从GUI设计窗口的工具栏上选择设计窗口的工具栏上选择Align Objects命令按钮命令按钮 选择选择Tools菜单下的菜单下的Align Objects菜单项菜单项 组成结构组成结构 第一栏是垂直方向的位置调整。第一栏是垂直方向的位

33、置调整。 第二栏是水平方向的位置调整。第二栏是水平方向的位置调整。位置调整工具30Information Theory & Technology Center(ITTC) 对象浏览器 功能功能 查看当前设计阶段的各查看当前设计阶段的各个句柄图形对象。个句柄图形对象。 打开方式打开方式 从从GUI设计窗口的工具设计窗口的工具栏上选择栏上选择Object Browser命令按钮命令按钮 选择选择View菜单下的菜单下的Object Browser子菜单子菜单 用鼠标双击图中的任用鼠标双击图中的任何一个对象，可以进何一个对象，可以进入对象的属性查看器入对象的属性查看器界面。界面。对象浏览器3

34、1Information Theory & Technology Center(ITTC) Tab顺序编辑器(Tab Order Editor) 功能功能 设置用户按键盘上的设置用户按键盘上的Tab键时，对象被选中键时，对象被选中的先后顺序。的先后顺序。 打开方式打开方式 选择选择Tools菜单下的菜单下的Tab Order Editor菜单项菜单项Tab顺序编辑器32Information Theory & Technology Center(ITTC) 例 利用GUI设计工具设计用户界面 该界面包括一个用于显示图形的坐标轴对象，显示的图形包括表面图、网格图或等高线图。 绘制

35、图形的功能通过3个命令按钮来实现，用户通过单击相应的按钮，即可绘制相应图形。 绘制图形所需要的数据通过一个弹出框来选取。在弹出框中包括3个选项，分别对应MATLAB的数据函数peaks、membrane和用户自定义的绘图数据sinc，用户可以通过选择相应的选项来载入相应的绘图数据 在图形窗口缺省的菜单条上添加一个菜单项Select，Select下又有两个子菜单项Yellow和Red，选中Yellow项时，图形窗口将变成黄色，选中Red项时，图形窗口将变成红色。可视化设计应用实例33Information Theory & Technology Center(ITTC) 第一步： 打开G

36、UI设计窗口，添加有关控件对象 在在MATLAB命令窗口输入命令命令窗口输入命令guide，将打开，将打开GUI设计窗口。单击设计窗口。单击GUI设计窗口控件工具栏中的设计窗口控件工具栏中的Axes按钮按钮，并在图形窗口中拖出一个，并在图形窗口中拖出一个矩形框矩形框，调，调整好大小和位置。再添加整好大小和位置。再添加3个按钮个按钮、一个、一个静态文静态文本框本框和和一个弹出框一个弹出框，并调整好大小和位置。必要，并调整好大小和位置。必要时可利用位置调整工具将图形对象对齐。时可利用位置调整工具将图形对象对齐。可视化设计应用实例（续）34Information Theory & Techn

37、ology Center(ITTC) 第二步： 利用属性编辑器，设置图形对象的属性。 将图形窗口的MenuBar属性设为figure 利用属性编辑器把3个按钮的Position属性的第3和第4个分量设为相同的值，以使3个按钮宽和高都相等。3个按钮的String属性分别是说明文字Mesh、Surf和Contour3，FontSize属性设为10。 双击弹出框，打开该对象的属性设置对话框。为了设置弹出框的String属性，单击String属性名后面的图标，然后在打开的文本编辑器中输入3个选项：peaks、membrane、sinc。注意，每行输入一个选项。 将静态文本框的String属性设置为Ch

38、oose Data of Graphics。可视化设计应用实例（续）35Information Theory & Technology Center(ITTC) 第三步： 编写代码，实现控件功能。 如果实现代码较为简单，可以直接修改控件的Callback属性。对于较为复杂的程序代码，最好还是编写M文件。右键单击任一图形对象，在弹出的快捷菜单中选择View Callbacks，再选Callback子菜单，将自动打开一个M文件，这时可以在各控件的回调函数区输入相应的程序代码。本例需要添加的代码如下(注释部分和函数引导行是系统M文件中已有的)：可视化设计应用实例（续）36Informatio

39、n Theory & Technology Center(ITTC)在打开的函数文件中，添加用于创建绘图数据的代码：function ex8_5_OpeningFcn(hObject, eventdata, handles, varargin)% This function has no output args, see OutputFcn.% hObject handle to figure% eventdata reserved - to be defined in a future version of MATLAB% handles structure with handles

40、 and user data (see GUIDATA)% varargin command line arguments to ex8_5 (see VARARGIN)handles.peaks=peaks(35);handles.membrane=membrane(5); % membrane函数产生MATLAB标志x,y=meshgrid(-8:0.5:8);r=sqrt(x.2+y.2);sinc=sin(r)./(r+eps);handles.sinc=sinc;handles.current_data=handles.peaks;可视化设计应用实例（续）37Information

41、Theory & Technology Center(ITTC) 为Mesh按钮编写响应函数代码如下：% - Executes on button press in pushbutton1.function pushbutton1_Callback(hObject, eventdata, handles)% hObject handle to pushbutton1 (see GCBO)% eventdata reserved - to be defined in a future version of MATLAB% handles structure with handles an

42、d user data (see GUIDATA)mesh(handles.current_data);可视化设计应用实例（续）38Information Theory & Technology Center(ITTC) 为Surf按钮编写响应函数代码如下： % - Executes on button press in pushbutton2. function pushbutton2_Callback(hObject, eventdata, handles) % hObject handle to pushbutton2 (see GCBO) % eventdata reserve

43、d - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) surf(handles.current_data);可视化设计应用实例（续）39Information Theory & Technology Center(ITTC) 为Contour3按钮编写响应函数代码如下：% - Executes on button press in pushbutton3.function pushbutton3_Callback(hObject, eventdata, handles)% hObject handle to pushbutton3 (see GCBO)% eventdata reserved - to be defined in a future version