第11章MATLAB图形用户界面设计概要课件.ppt
第11章 MATLAB图形用户界面设计,11.0 概念 11.1 菜单设计11.2 对话框设计11.3 图形用户界面设计工具,图形用户界面(Graphical User Interface,GUI)是由窗口、光标、按键、菜单、文字说明等对象(Objects)构成的与计算机进行交互的部件。在进行技术、方法的演示、反复使用软件时需制作用户界面。,11.0 概念,设计原则及一般步骤,设计原则简单性(simplicity)一致性(consistency)习常性(familiarity)一般步骤明确设计任务绘出界面草图上机制作编写界面动态功能的程序,11.1 菜单设计,11.1.1 建立用户菜单要建立用户菜单可用uimenu函数,因其调用方法不同,该函数可以用于建立一级菜单项和子菜单项。 建立一级菜单项的函数调用格式为: 一级菜单项句柄=uimenu(图形窗口句柄,属性名1,属性值1,属性名2,属性值2,) 建立子菜单项的函数调用格式为: 子菜单项句柄=uimenu(一级菜单项句柄,属性名1,属性值1,属性名2,属性值2,),11.1.2 菜单对象常用属性 菜单对象具有Children、Parent、Tag、Type、UserData、Visible等公共属性,除公共属性外,还有一些常用的特殊属性。,图形窗的标准菜单,包括:文件File、编辑Edit、视图View、插入Insert、工具Tools、窗口Windows和帮助Help七个菜单。每个都有下拉菜单Pull-down menu。标准菜单受界面菜单MenuBar属性管理,该属性值为none|figure。Figure是缺省设置,改为none时不显示这些菜单,如何隐藏和显示标准菜单,创建图形窗 H_fig=Figure隐去标准菜单使用命令: set(H_fig,MenuBar,none); set(gcf,menubar,menubar);恢复标准菜单使用命令: set(gcf,menubar,figure);,自制的用户菜单,%exm103_2.mfigureh_menu=uimenu(gcf,Label,%为Red菜单设置快捷键R,用户菜单的属性,例:在图形窗上自制一个名为【Test】的“顶层菜单项”;当用鼠标点动该菜单项时,将产生一个带分格的封闭坐标轴。通过本例说明:(A)回调属性的运作机理;(B)用户顶层菜单项的制作(C)uimenu属性的设置方法;(D)复杂字符串的构成方法和注意事项。,(1)产生图1界面的uimenu的书写格式一:uimenu(Label,Test,Callback,grid on,set(gca,box,on),) (2)产生图1界面的uimenu的书写格式二:uimenu(Label,Test, .Callback,grid on, , . set(gca,box,on);) (3)产生图1界面的uimenu的书写格式三:Lpv=Test;Cpv=grid on,set(gca,box,on),;uimenu(Label, Lpv, Callback , Cpv) (4)产生图1界面的uimenu的书写格式四:PS.Label=Test;PS.Callback=grid on;,set(gca,box,on);uimenu(PS),图1 通过顶层菜单Test形成的带分格的封闭坐标轴,11.1.3 快捷菜单快捷菜单是用鼠标右键单击某对象时在屏幕上弹出的菜单。这种菜单出现的位置是不固定的,而且总是和某个图形对象相联系。在MATLAB中,可以使用uicontextmenu函数和图形对象的UIContextMenu属性来建立快捷菜单,具体步骤为:(1) 利用uicontextmenu函数建立快捷菜单。(2) 利用uimenu函数为快捷菜单建立菜单项。(3) 利用set函数将该快捷菜单和某图形对象联系起来。,例 绘制一条曲线y=sin(t)/t ,创建一个与之相联系的现场菜单,用以控制曲线的颜色,%exm103_4.mt=(-3*pi:pi/50:3*pi)+eps;y=sin(t)./t;hline=plot(t,y);%绘制曲线cm=uicontextmenu;%创建现场菜单%制作具体菜单项,定义相应的回调uimenu(cm,label,Red,callback,set(hline,color,r),)uimenu(cm,label,Blue,callback,set(hline,color,b),)uimenu(cm,label,Green,callback,set(hline,color,g),)set(hline,uicontextmenu,cm) %使cm现场菜单与Sa曲线相联系,11.2.1 对话框的控件在对话框上有各种各样的控件,利用这些控件可以实现有关控制。下面先介绍这些控件。 (1) 按钮(Push Button)。 (2) 双位按钮(Toggle Button)。 (3) 单选按钮(Radio Button)。 (4) 复选框(Check Box)。 (5) 列表框(List Box)。 (6) 弹出框(Popup Menu)。 (7) 编辑框(Edit Box)。 (8) 滑动条(Slider)。 (9) 静态文本(Static Text)。 (10) 边框(Frame)。,11.2 对话框设计,11.2.2 对话框的设计1建立控件对象 MATLAB提供了用于建立控件对象的函数uicontrol,其调用格式为: 对象句柄=uicontrol(图形窗口句柄,属性名1,属性值1,属性名2,属性值2,)其中各个属性名及可取的值和前面介绍的uimenu函数相似,但也不尽相同,下面将介绍一些常用的属性。,2控件对象的属性 MATLAB的10种控件对象使用相同的属性类型,但是这些属性对于不同类型的控件对象,其含义不尽相同。除Children、Parent、Tag、Type、UserData、Visible等公共属性外,还有一些常用的特殊属性。 控件对象例子,%exm104_1.mclf resetset(gcf,menubar,none)set(gcf,unit,normalized,position,0.2,0.2,0.64,0.32);set(gcf,defaultuicontrolunits,normalized)%设置用户缺省控件单位属性值h_axes=axes(position,0.05,0.2,0.6,0.6); t=0:pi/50:2*pi;y=sin(t);plot(t,y);set(h_axes,xlim,0,2*pi);set(gcf,defaultuicontrolhorizontal,left);htitle=title(正弦曲线);set(gcf,defaultuicontrolfontsize,12);%设置用户缺省控件字体属性值,1 双位按钮、无线电按键、控件区域框例子,uicontrol(style,frame,.%创建用户控件区 position,0.67,0.55,0.25,0.25);uicontrol(style,text,.%创建静态文本框 string,正斜体图名:,. position,0.68,0.77,0.18,0.1,. horizontal,left);hr1=uicontrol(gcf,style,radio,.%创建“无线电”选择按键 string,正体,.%按键功能的文字标识正体 position,0.7,0.69,0.15,0.08); %按键位置set(hr1,value,get(hr1,Max); %因图名缺省使用正体,所以小圆圈应被点黑set(hr1,callback,.set(hr1,value,get(hr1,max),.%选中将小圆圈点黑set(hr2,value,get(hr2,min),.%将互斥选项点白set(htitle,fontangle,normal),. %使图名字体正体显示);,hr2=uicontrol(gcf,style,radio,. %创建“无线电”选择按键 string,斜体,. %按键功能的文字标识斜体position,0.7,0.58,0.15,0.08,. %按键位置callback,.set(hr1,value,get(hr1,min),.set(hr2,value,get(hr2,max),. set(htitle,fontangle,italic),. %使图名字体斜体显示); ht=uicontrol(gcf,style,toggle,.%制作双位按键 string,Grid,. position,0.67,0.40,0.15,0.12,. callback,grid);,%exm104_2.mclf resetset(gcf,unit,normalized,position,0.1,0.2,0.64,0.35);set(gcf,defaultuicontrolunits,normalized);set(gcf,defaultuicontrolfontsize,12);set(gcf,defaultuicontrolfontname,隶书);set(gcf,defaultuicontrolhorizontal,left);str=归一化二阶系统阶跃响应曲线;set(gcf,name,str,numbertitle,off);%书写图形窗名h_axes=axes(position,0.05,0.2,0.6,0.7); %定义轴位框位置 set(h_axes,xlim,0,15);%设置时间轴长度,2 静态文本、滑动条、检录框示例,str1=当前阻尼比=;t=0:0.1:10;z=0.5;y=step(1,1 2*z 1,t);hline=plot(t,y);htext=uicontrol(gcf,style,text,.%制作静态说明文本框 position,0.67,0.8,0.33,0.1,. string,str1,sprintf(%1.4g,z);hslider=uicontrol(gcf,style,slider,.%创建滑动键 position,0.67,0.65,0.33,0.1,. max,2.02,min,0.02,. %设最大阻尼比为2,最小阻尼比为0.02 sliderstep,0.01,0.05,. %箭头操纵滑动步长1%,游标滑动步长5% Value,0.5);%缺省取阻尼比等于0.5,hcheck1=uicontrol(gcf,style,checkbox,.%创建峰值检录框 string,最大峰值 ,. position,0.67,0.50,0.33,0.11);vchk1=get(hcheck1,value); %获得峰值检录框的状态值hcheck2=uicontrol(gcf,style,checkbox,. %创建上升时间检录框 string,上升时间(0-0.95),. position,0.67,0.35,0.33,0.11);vchk2=get(hcheck2,value); %获得上升时间检录框的状态值set(hslider,callback,. %操作滑动键,引起回调 z=get(gcbo,value);,. %获得滑动键状态值 callcheck(htext,str1,z,vchk1,vchk2); %被回调的函数文件,set(hcheck1,callback,. %操作峰值检录框,引起回调 vchk1=get(gcbo,value);,. %获得峰值检录框状态值 callcheck(htext,str1,z,vchk1,vchk2); %被回调的函数文件set(hcheck2,callback,. %操作峰值检录框,引起回调 vchk2=get(gcbo,value);,. %获得峰值检录框状态值 callcheck(htext,str1,z,vchk1,vchk2); %被回调的函数文件,function exm104_3( )global hedit hpop hlistclf resetset(gcf,unit,normalized,position,0.1,0.4,0.85,0.35);%设置图形窗大小set(gcf,defaultuicontrolunits,normalized);set(gcf,defaultuicontrolfontsize,11);set(gcf,defaultuicontrolfontname,隶书);set(gcf,defaultuicontrolhorizontal,left);set(gcf,menubar,none);%删除图形窗工具条str=通过多行指令绘图的交互界面;set(gcf,name,str,numbertitle,off);%书写图形窗名,3 可编辑框、弹出框、列表框、按键示例,h_axes=axes(position,0.05,0.15,0.45,0.70,visible,off);%定义轴位框位置 uicontrol(gcf,Style,text,.%制作静态文本框 position,0.52,0.87,0.26,0.1,. String,绘图指令输入框);hedit=uicontrol(gcf,Style,edit,.%制作可编辑文本框 position,0.52,0.05,0.26,0.8,. Max,2);%取2,使Max-Min1,而允许多行输入hpop=uicontrol(gcf,style,popup,.%制作弹出菜单 position,0.8,0.73,0.18,0.12,. string,spring|summer|autumn|winter);%设置弹出框中选项名,hlist=uicontrol(gcf,Style,list,.%制作列表框 position,0.8,0.23,0.18,0.37,. string,Grid on|Box on|Hidden off|Axis off,. %设置列表框中选项名 Max,2);%取2,使Max-Min1,而允许多项选择hpush=uicontrol(gcf,Style,push,. %制作与列表框配用的按键 position,0.8,0.05,0.18,0.15,string,Apply);set(hedit,callback,calledit1);%编辑框输入引起回调set(hpop,callback,calledit1);%弹出框选择引起回调set(hpush,callback,calledit1);%按键引起的回调,11.3 图形用户界面设计工具MATLAB的用户界面设计工具共有6个,它们是:(1) 图形用户界面设计窗口:在窗口内创建、安排各种图形对象。(2) 菜单编辑器(Menu Editor):创建、设计、修改下拉式菜单和快捷菜单。(3) 对象属性查看器(Property Inspector):可查看每个对象的属性值,也可修改设置对象的属性值。(4) 位置调整工具(Alignment Tool):可利用该工具左右、上下对多个对象的位置进行调整。(5) 对象浏览器(Object Browser):可观察当前设计阶段的各个句柄图形对象。(6) Tab顺序编辑器(Tab Order Editor):通过该工具,设置当用户按下键盘上的Tab键时,对象被选中的先后顺序。,11.3.1 图形用户界面设计窗口1GUI设计模板在MATLAB主窗口中,选择File菜单中的New菜单项,再选择其中的GUI命令,就会显示图形用户界面的设计模板。MATLAB为GUI设计一共准备了4种模板,分别是Blank GUI(默认) 、GUI with Uicontrols(带控件对象的GUI模板) 、GUI with Axes and Menu(带坐标轴与菜单的GUI模板)与Modal Question Dialog(带模式问话对话框的GUI模板)。当用户选择不同的模板时,在GUI设计模板界面的右边就会显示出与该模板对应的GUI图形。,2GUI设计窗口在GUI设计模板中选中一个模板,然后单击OK按钮,就会显示GUI设计窗口。选择不同的GUI设计模式时,在GUI设计窗口中显示的结果是不一样的。GUI设计窗口由菜单栏、工具栏、控件工具栏以及图形对象设计区等部分组成。GUI设计窗口的菜单栏有File、Edit、View、Layout、Tools和Help 6个菜单项,使用其中的命令可以完成图形用户界面的设计操作。,3GUI设计窗口的基本操作在GUI设计窗口创建图形对象后,通过双击该对象,就会显示该对象的属性编辑器。例如,创建一个Push Button对象,并设计该对象的属性值。,11.3.2 对象属性查看器利用对象属性查看器,可以查看每个对象的属性值,也可以修改、设置对象的属性值,从GUI设计窗口工具栏上选择Property Inspector命令按钮,或者选择View菜单下的Property Inspector子菜单,就可以打开对象属性查看器。另外,在MATLAB命令窗口的命令行上输入inspect,也可以看到对象属性查看器。在选中某个对象后,可以通过对象属性查看器,查看该对象的属性值,也可以方便地修改对象属性的属性值。,11.3.3 菜单编辑器利用菜单编辑器,可以创建、设置、修改下拉式菜单和快捷菜单。从GUI设计窗口的工具栏上选择Menu Editor命令按钮,或者选择Tools菜单下的Menu Editor子菜单,就可以打开菜单编辑器。菜单编辑器左上角的第一个按钮用于创建一级菜单项。第二个按钮用于创建一级菜单的子菜单。菜单编辑器的左下角有两个按钮,选择第一个按钮,可以创建下拉式菜单。选择第二个按钮,可以创建Context Menu菜单。选择它后,菜单编辑器左上角的第三个按钮就会变成可用,单击它就可以创建Context Menu主菜单。在选中已经创建的Context Menu主菜单后,可以单击第二个按钮创建选中的Context Menu主菜单的子菜单。与下拉式菜单一样,选中创建的某个Context Menu菜单,菜单编辑器的右边就会显示该菜单的有关属性,可以在这里设置、修改菜单的属性。菜单编辑器左上角的第四个与第五个按钮用于对选中的菜单进行左移与右移,第六与第七个按钮用于对选中的菜单进行上移与下移,最右边的按钮用于删除选中的菜单。,11.3.4 位置调整工具利用位置调整工具,可以对GUI对象设计区内的多个对象的位置进行调整。从GUI设计窗口的工具栏上选择Align Objects命令按钮,或者选择Tools菜单下的Align Objects菜单项,就可以打开对象位置调整器。对象位置调整器中的第一栏是垂直方向的位置调整。对象位置调整器中的第二栏是水平方向的位置调整。在选中多个对象后,可以方便的通过对象位置调整器调整对象间的对齐方式和距离。,11.3.5 对象浏览器利用对象浏览器,可以查看当前设计阶段的各个句柄图形对象。从GUI设计窗口的工具栏上选择Object Browser命令按钮,或者选择View菜单下的Object Browser子菜单,就可以打开对象浏览器。例如,在对象设计区内创建了3个对象,它们分别是Edit Text、Push Button、ListBox对象,此时单击Object Browser按钮,可以看到对象浏览器。在对象浏览器中,可以看到已经创建的3个对象以及图形窗口对象figure。用鼠标双击图中的任何一个对象,可以进入对象的属性查看器界面。,11.3.6 Tab顺序编辑器利用Tab顺序编辑器(Tab Order Editor),可以设置用户按键盘上的Tab键时,对象被选中的先后顺序。选择Tools菜单下的Tab Order Editor菜单项,就可以打开Tab顺序编辑器。例如,若在GUI设计窗口中创建了3个对象,与它们相对应的Tab顺序编辑器。,例11-1 建立图11-1所示的图形演示系统菜单。菜单条中含有3个菜单项:Plot、Option和Quit。Plot中有Sine Wave和Cosine Wave两个子菜单项,分别控制在本图形窗口画出正弦和余弦曲线。Option菜单项的内容如图11-1所示,其中Grid on和Grid off控制给坐标轴加网格线,Box on和Box off控制给坐标轴加边框,而且这4项只有在画有曲线时才是可选的。Window Color控制图形窗口背景颜色。Quit控制是否退出系统。例11-2 绘制曲线y=2sin(5x)sinx,并建立一个与之相联系的快捷菜单,用以控制曲线的线型和曲线宽度。,例11-4 建立如图11-11所示的图形演示对话框。在编辑框输入绘图命令,当单击“绘图”按钮时,能在左边坐标轴绘制所对应的图形,弹出框提供色图控制,列表框提供坐标网格线和坐标边框控制。,例11-5 利用GUI设计工具设计图11-23所示的用户界面。该界面包括一个用于显示图形的轴对象,显示的图形包括表面图、网格图或等高线图。绘制图形的功能通过3个命令按钮来实现,用户通过单击相应的按钮,即可绘制相应图形。绘制图形所需要的数据通过一个弹出框来选取。在弹出框中包括3个选项,分别对应MATLAB的数据函数peaks、membrane和用户自定义的绘图数据sinc,用户可以通过选择相应的选项来载入相应的绘图数据。在图形窗口缺省的菜单条上添加一个菜单项Select,Select下又有两个子菜单项Yellow和Red,选中Yellow项时,图形窗口将变成黄色,选中Red项时,图形窗口将变成红色。,