第七章 MATLAB的GUI 程序设计
Chapter 8: Design of MATLAB of GUI program
GUI(Graphical User Interfaces):由各种图形对象组成的用户界面,在这种用户界面下,用户的命令和对程序的控制是通过“选择”各种图形对象来实现的。目前90%以上的应用程序和软件都是在GUI下运行的。
MATLAB有两种GUI用户界面控件的创建方式,基于命令行的方式用程序来制作和基于GUI的方式制作。这里主要介绍基于GUI的方式。
MATLAB 的GUI的基本图形对象分为控件对象和用户界面菜单对象(包括固定菜单和现场菜单),简称控件和菜单。
1. GUI控件对象类型(The mode of controller object)
控件对象是事件响应的图形界面对象。当某一事件发生时,应用程序会做出响应并执行某些预定的功能子程序(Callback).
常用的基本控件:
(10)弹出式菜单(Popup Menus): 让用户从一列菜单项中选择 一项作为参数输入;
(11)坐标轴(Axes): 用于显示图形和图象
MATLAB中的控件大致可分为两种,一种为动作控件,鼠标点击这些控件时会产生相应的响应。一种为静态控件,是一种不产生响应的控件,如文本框等。
每种控件都有一些可以设置的参数,用于表现控件的外形、功能及效果,既属性。属性由两部分组成:属性名和属性值,它们必须是成对出现的。
控制对象的属性包括公共属性、基本控制属性、修饰控制属性、辅助属性和callback管理属性。
3. 控件对象的属性(Attributes of controller object)
用户可以在创建控件对象时,设定其属性值,未指定时将使用系统缺省值。
两大类控件对象属性:第一类是所有控件对象都具有的公共属性,第二类是控件对象作为图形对象所具有的属性。
A, 控件对象的公共属性
Children 取值为空矩阵,因为控件对象没有自己的子对象
Parent取值为某个图形窗口对象的句柄,该句柄表明了控件对象所在的图形窗口
Tag取值为字符串,定义了控件的标识值,在任何程序中都可以通过这个标识值控制该控件对象
Type 取值为uicontrol,表明图形对象的类型
UserDate取值为空矩阵,用于保存与该控件对象相关的重要数据和信息
Visible取值为no 或off,
B,控件对象的基本控制属性
BackgroundColor取值为颜色的预定义字符或RGB数值
Callback取值为字符串,可以是某个M文件名或一小段MATLAB语句,当用户激活某个控件对象时,应用程序就运行该属性定义的子程序。
Enable取值为on(缺省值),inactive和off
Extend取值为四元素矢量[0,0,width, height],记录控件对象标题字符的位置和尺寸
ForegroundColor取值为颜色的预定义字符或RGB数值
Max,Min取值都为数值
String取值为字符串矩阵或数组,定义控件对象标题或选项内容
Style取值可以是pushbutton, radiobutton, checkbox, edit, text, slider, frame, popupmenu 或listbox
Units取值可以是pixels, normalized, inches, centimeters或points
Value取值可以是矢量,也可以是数值,其含义及解释依赖于控件对象的类型
C,控件对象的修饰控制属性
FontAngle取值为normal, italic, oblique,
FontName取值为控件标题等字体的字库名
FontSize取值为数值,定义字号
FontWeight取值为normal, light, demi或bold
HorizontalAligment取值为left,right,定义对齐方式
D, 控件对象的辅助属性
ListboxTop取值为数量值
SliderStop取值为两元素矢量[minstep,maxstep],用于slider控件
Selected取值为on 或off
SlectionHoghlight取值为on 或off
E, Callback管理属性
BusyAction取值为cancel或queue
ButtonDownFun取值为字符串,一般为某个M文件名或一小段MATLAB程序
CreateFun 取值为字符串,一般为某个M文件名或一小段MATLAB程序
DeletFun取值为字符串,一般为某个M文件名或一小段MATLAB程序
HandleVisibility取值为on, callback或off
Interruptible取值为on 或off
二.GUI开发环境(GUI Development Environment, GUIDE)
MATLAB提供了一套可视化的创建图形窗口的工具,使用这个用户界面开发环境可方便的创建GUI应用程序, 它可以根据用户设计的GUI布局,自动生成M文件的框架,用户使用这一框架编制自己的应用程序。
MATLAB可视化的创建图形用户接口(GUI)工具包括:
*布局编辑器(Layout Edtor)-------在图形窗口中加入及安排对象。
*几何排列工具(Alignment Tool)-----调整各对象相互之间的几何关系和位置
*属性编辑器(Property Inspector)-----查询并设置属性值
*对象浏览器(Object Browser)-----用于获得当前MATLAB图形用户界面程序中所有的全部对象信息,对象的类型,同时显示控件的名称和标识,在控件上双击鼠标可以打开该控件的属性编辑器。
*菜单编辑器(Menu Editor)-----建立窗口菜单条的菜单和任何构成布局的弹出菜单
在MATLAB中, GUI的设计是以 M文件的编程形式实现的,GUI的布局代码存储在M文件和MAT文件中,而在MATLAB6中有了很大的改变,MATLAB6将GUI的布局代码存储在 FIG文件中,同时还产生一个M文件用于存储调用函数,在M文件中不再包含GUI的布局代码,在开发应用程序时代码量大大减少。
1、布局编辑器(Layout editor)的使用: 在命令窗口输入GUIDE命令或点击工具栏中的guide图标都可以打开空白的布局编辑器,在命令窗口输入GUIDE filename 可打开一个已存在的名为filename图形用户界面。
布局编辑器可以启动用户界面的控制面板,上述工具都必须从布局编辑器中访问。使用用户界面开发环境的一般步骤为:
(1)布局编辑器参数设置
选File菜单下的Preferences菜单项打开参数设置窗口,点击树状目录中的GUIDE,既可以设置布局编辑器的参数。
(2)布局编辑器的弹出菜单
在任一控件上按下鼠标右键,会弹出一个菜单,通过该菜单可以完成布局编辑器的大部分操作。
(3)将控件对象放置到布局区
(4)激活图形窗口
选Tools菜单中的Activate Figure(Run)项或点击工具条上的ActivareFigure(Run)按钮, 在激活图形窗口的同时将存储M 文件和FIG文件,如所建立的布局还没有进行存储,用户界面开发环境将打开一个Save As对话框,按输入的文件的名字,存储一对同名的M文件和带有.fig扩展名的FIG文件。
(5)运行GUI程序
在命令窗口直接键入文件名或用openfig, open或hgload命令运行GUI程序。
可以通过选择工具栏中的排列工具图标打开排列工具窗口,用于调节各控件对象之间相对的水平和垂直位置。
设置控件属性,在属性编辑器中提供了所有可设置的属性列表并显示出当前的属性。
(1)打开属性编辑器(Opening Property Inspector):三种方法:1. 用工具栏上的图标打开;2. 从View菜单中选择Property Inspector菜单项;3. 在按鼠标右键弹出的Property Inspector菜单中选择菜单项。
(2)使用属性编辑器(Using Property Inspector):属性编辑器中包含了控件的基本属性,都可以在编辑器中填写或更改属性值,一般情况下许多属性可采用默认值,只对与制作目的直接相关的属性进行编辑。
菜单编辑器的下方有两个可选择的页面,分别用于设计主菜单和鼠标右键菜单,鼠标右键菜单为主程序窗口和控件上的弹出菜单,可设计多个鼠标右键菜单,每个控件可以通过属性查询器中UIContextMenu选择一个鼠标右键菜单,UIContextMenu的缺省选项为(None)
三、GUI程序设计(GUI Program design)
GUI设计包括图形界面的设计和功能设计两个方面。
一般步骤:
*分析界面所要实现的主要功能,明确设计任务
*在稿纸上绘制界面草图,优化草图
*按设计草图上机制作静态界面*
*编写界面动态功能的程序,
例1: 制作一个可进行图形显示、绘图启动和做3D 旋转操作的GUI:
例2:设计一个简单信号分析仪的程序,要求根据输入的两个频率和时间间隔,计算函数x=sin(2πf1t)+sin(2πf2t) 的值,并对函数进行快速傅立叶变换,最后分别绘制时域和频域的曲线。
设计步骤:
控件的标识(Tag)是对于各控件的识别,每个控件载创建时都会由开发环境自动产生一个标识,在程序设计中,为了编辑、记忆和维护的方便,一般为控件设置一个新的标识。本例设置第一个坐标轴的标识为:frequency_axes, 用于显示频域图形; 第二个坐标轴的标识为:time_axes, 用于显示时域图形。三个文本编辑框的标识为f1_input, f2_input, t_input,分别用于输入两个频率和自变量时间的间隔.
3. 编写代码(Edit code)
GUI图形界面的功能,还是要通过一定的设计思路和计算方法,由特定的程序来实现。为了实现程序的功能,还需要在运行程序前编写一些代码,完成程序中变量的赋值、输入输出、计算及绘图等工作。
一般内容为:
%(1) 设置对象的初始值;
%分别设置三个文本编辑框的初始值为:
f1_input=20
f2_input=50
t_input=0:0.001:0.5
%(2) 编写代码:
%1) 从GUI获得用户输入的数据,本例中输入的三个数据
%分别为频率1、频率2和时间间隔。
f1=str2double(get(handles.f1_input,'String'));
f2=str2double(get(handles.f2_input,'String'));
t=eval(get(handles.t_input,'String'));
%2) 计算数据,计算函数值,按指定点进行快速傅立叶变
%换,并计算频域的幅值和频域分辨率。
x=sin(2*pi*f1*t)+sin(2*pi*f2*t);
y=fft(x,512);
m=y.*conj(y)/512;
f=1000*(0:256)/512;
%3) 在第一个坐标轴中绘制频域曲线。
axes(handles.frequency_axes)
plot(f,m(1:257))
set(handles.frequency_axes,'XminorTick','on')
grid on
%4) 在第二个坐标轴中绘制时域曲线。
axes(handles.time_axes) %选择适当的坐标轴
plot(t,x)
set(handles.time_axes,'XminorTick','on')
grid on
运行程序(Running program)
例3 :制作一个曲面光照效果的演示界面,如图所示,三个弹出式菜单分别用于选择曲面形式、色彩图、光照模式和反射模式,三个滚动条用于确定光源的位置,一个按钮用于退出演示。
制作要点:
(1)建立一个静态文本,用于显示界面的标题:光照效果演示;
(2)建立坐标轴对象,用于显示图形;
(3)建立四个下拉菜单,分别用于选择绘图表面的形状、色图、光照模式和反射模式,每个下拉菜单的上方都有一个静态文本用于说明菜单的作用;
(4)在一个frame上建立三个滑条用于确定光源的位置,并在frame上方加一说明;
(5)建立一个按钮用于退出演示;
callback函数的内容为:
function varargout = pushbutton1_Callback(h, eventdata, handles, varargin)
delete(handles.figure1)
% --------------------------------------------------------------------
function varargout = popupmenu1_Callback(h, eventdata, handles, varargin)
val=get(h,'value');
switch val
case 1
surf(peaks);
case 2
sphere(30);
case 3
membrane
case 4
[x,y]=meshgrid(-4:.1:4);
r=sqrt(x.^2+y.^2)+eps;
z=sinc(r);
surf(x,y,z)
case 5
[x,y]=meshgrid([-1.5:.3:1.5],[-1:0.2:1]);
z=sqrt(4-x.^2/9-y.^2/4);
surf(x,y,z);
case 6
t=0:pi/12:3*pi;
r=abs(exp(-t/4).*sin(t));
[x,y,z]=cylinder(r,30);
surf(x,y,z);
end
shading interp
light('Position',[-3 -2 1]);
axis off
% --------------------------------------------------------------------
function varargout = radiobutton1_Callback(h, eventdata, handles, varargin)
set(h,'value',1)
set(handles.radiobutton2,'value',0)
set(handles.radiobutton3,'value',0)
set(handles.radiobutton4,'value',0)
lighting flat
% --------------------------------------------------------------------
function varargout = radiobutton2_Callback(h, eventdata, handles, varargin)
set(h,'value',1)
set(handles.radiobutton1,'value',0)
set(handles.radiobutton3,'value',0)
set(handles.radiobutton4,'value',0)
lighting gouraud
% --------------------------------------------------------------------
function varargout = radiobutton3_Callback(h, eventdata, handles, varargin)
set(h,'value',1)
set(handles.radiobutton1,'value',0)
set(handles.radiobutton2,'value',0)
set(handles.radiobutton4,'value',0)
lighting phong
% --------------------------------------------------------------------
function varargout = radiobutton4_Callback(h, eventdata, handles, varargin)
set(h,'value',1)
set(handles.radiobutton1,'value',0)
set(handles.radiobutton3,'value',0)
set(handles.radiobutton3,'value',0)
lighting none
% --------------------------------------------------------------------
function varargout = popupmenu2_Callback(h, eventdata, handles, varargin)
val=get(h,'value');
switch val
case 1
colormap(jet)
case 2
colormap(hot)
case 3
colormap(cool)
case 4
colormap(copper)
case 5
colormap(pink)
case 6
colormap(spring)
case 7
colormap(summer)
case 8
colormap(autumn)
case 9
colormap(winter)
end
% --------------------------------------------------------------------
function varargout = popupmenu3_Callback(h, eventdata, handles, varargin)
val=get(h,'value');
switch val
case 1
lighting flat
case 2
lighting gouraud
case 3
lighting phong
case 4
lighting none
end
% --------------------------------------------------------------------
function varargout = popupmenu4_Callback(h, eventdata, handles, varargin)
val=get(h,'value');
switch val
case 1
material shiny
case 2
material dull
case 3
material metal
case 4
material default
end
% --------------------------------------------------------------------
function varargout = slider1_Callback(h, eventdata, handles, varargin)
val=get(h,'value');
set(handles.edit1,'string',num2str(val));
lx==val; ly=get(handles.slider2,'value'); ly=get(handles.slider3,'value');
light('Position',[x y z]);
% --------------------------------------------------------------------
function varargout = edit1_Callback(h, eventdata, handles, varargin)
str=get(h,'string');
set(handles.slider1,'value',str2num(str));
lx==str2num(str); ly=get(handles.slider2,'value'); ly=get(handles.slider3,'value');
light('Position',[x y z]);
% --------------------------------------------------------------------
function varargout = slider2_Callback(h, eventdata, handles, varargin)
val=get(h,'value');
set(handles.edit2,'string',num2str(val));
lx=get(handles.slider1,'value'); lx==val; ly=get(handles.slider3,'value');
light('Position',[x y z]);
% --------------------------------------------------------------------
function varargout = edit2_Callback(h, eventdata, handles, varargin)
str=get(h,'string');
set(handles.slider2,'value',str2num(str));
% --------------------------------------------------------------------
function varargout = slider3_Callback(h, eventdata, handles, varargin)
val=get(h,'value');
set(handles.edit3,'string',num2str(val));
% --------------------------------------------------------------------
function varargout = edit3_Callback(h, eventdata, handles, varargin)
str=get(h,'string');
set(handles.slider3,'value',str2num(str));
*对话框设计:在图形用户界面程序设计中,对话框是重要的信息显示和获取输入数据的用户界面对象。
1、公共对话框:
公共对话框是利用windows资源的对话框,包括文件打开、文件保存、颜色设置、字体设置、打印设置等。
1) 文件打开对话框:用于打开文件
uigetfile
uigetfile(‘FilterSpec’)
uigetfile(‘FilterSpec’,’DialogTitle’)
uigetfile(‘FilterSpec’,’DialogTitle’,x,y)
[fname,pname]=uigetfile(…)
2) 文件保存对话框:用于保存文件
uiputfile
uiputfile(‘InitFile’)
uiputfile(‘InitFile’,’DialogTitle’)
uiputfile(‘InitFile’,’DialogTitle’,x,y)
[fname,pname]=uiputfile(…)
3) 颜色设置对话框:用于图形对象颜色的交互设置
c=uisetcolor(‘h_or_c,’DialogTitle’)
4) 字体设置对话框:用于字体属性的交互式设置
uisetfont
uisetfont(h)
uisetfont(S)
uisetfont(h,’DialogTitle’)
uisetfont(S,’DialogTitle’)
S=uisetfont(…)
5) 打印设置对话框:用于打印页面的交互式设置
dlg=pagesetupdlg(fig)
pagedlg
pagedlg(fig)
6) 打印预览对话框:用于对打印页面进行预览
printpreview
printpreview(f)
7) 打印对话框:
printdlg
printdlg(fig)
printdlg(‘-crossplatform’,fig)
printdlg(-‘setup’,fig)
2、MATLAB专用对话框
1)错误信息对话框:用于提示错误信息
errordlg 打开默认的错误信息对话框
errordlg(‘errorstring’) 打开显示’errorstring’信息的错误信息对话框
errordlg(‘errorstring’,’dlgname’) 打开显示’errorstring’信息的错误信息对话框,对话框的标题由‘dlgname’指定
erordlg(‘errorstring’,’dlgname’,’on’) 打开显示’errorstring’信息的错误信息对话框,对话框的标题由‘dlgname’指定. 如果对话框已存在,’on’参数将对话框显示在最前端。
h=errodlg(…) 返回对话框句柄
例:errordlg('输入错误,请重新输入','错误信息')
H=errordlg('输入错误,请重新输入','错误信息','on')
2) 帮助对话框:用于帮助提示信息
helpdlg 打开默认的帮助对话框
helpdlg(‘helpstring’) 打开显示’errorstring’信息的帮助对话框,
helpdlg(‘helpstring’,’dlgname’) 打开显示’errorstring’信息的帮助对话框, 对话框的标题由‘dlgname’指定
h=helpdlg(…) 返回对话框句柄
例:helpdlg('矩阵尺寸必须相等','在线帮助')
3) 输入对话框:用于输入信息
answer=inputdlg(prompt) 打开输入对话框,prompt为单元数组,用于定义输入数据窗口的个数和显示提示信息,answer为用于存储输入数据的单元数组。
answer=inputdlg(prompt,title) 与上者相同,title确定对话框的标题。
answer=inputdlg(prompt,title,lineNo) 参数lineNo可以是标量、列矢量或m×2阶矩阵,若为标量,表示每个输入窗口的行数均为lineNo;若为列矢量,则每个输入窗口的行数由列矢量lineNo的每个元素确定;若为矩阵,每个元素对应一个输入窗口,每行的第一列为输入窗口的行数,第二列为输入窗口的宽度。
answer=inputdlg(prompt,title,lineNo,defAns) 参数defans为一个单元数组,存储每个输入数据的默认值,元素个数必须与prompt 所定义的输入窗口数相同,所有元素必须是字符串。
answer=inputdlg(prompt,title,lineNo,defAns,Sesize) 参数resize决定输入对话框的大小能否被调整,可选值为on或off.
例:prompt={'Input Name','Input Age'};
title='Input Name and Age';
lines=[2 1]';
def={'John Smith','35'};
answer=inputdlg(prompt,title,lines,def);
4) 列表选择对话框:用于在多个选项中选择需要的值
[selection,ok]=listdlg(‘Liststring’,S,…) 输出参数selection为一个矢量,存储所选择的列表项的索引号,
输入参数为可选项’Liststring’(单元数组), ’SelectionMode’(’single’或’multiple’, ’ListSize’([wight,height]), ’Name’ (对话框标题)等
例: d = dir;
str = {d.name};
[s,v] = listdlg('PromptString','Select a file:',...
'SelectionMode','single','ListString',str)
5) 信息提示对话框:用于显示提示信息
msgbox(message) 打开信息提示对话框,显示message信息。
msgbox(message,title) title确定对话框标题。
msgbox(message,title,’icon’) icon用于显示图标,可选图标包括:none(无图标)/error/help/warn/custom(用户定义)
msgbox(message,title,’custom’,icondata,iconcmap) 当使用用户定义图标时,icondata为定义图标的图像数据,iconcmap为图像的色彩图。
msgbox(…,’creatmode’) 选择模式creatmode,选项为:modal, non_modal, 和replace。
h=msgbox(…) 返回对话框句柄
例: An example which blocks execution until the user responds:
uiwait(msgbox('Start?','Title','modal'));
An example using a custom Icon is:
Data=1:64;Data=(Data'*Data)/64;
h=msgbox('Are you ready?','Title','custom',Data,hot(64))
An example which reuses the existing msgbox window:
CreateStruct.WindowStyle='replace';
CreateStruct.Interpreter='tex';
h=msgbox('X^2 + Y^2','公式','custom',Data,hot(64),CreateStruct);
6) 问题提示对话框:用于回答问题的多种选择
button=questdlg(‘qstring’) 打开问题提示对话框,有三个按钮,分别为:yes,no和cancel,’questdlg’确定提示信息。
button=questdlg(‘qstring’,’title’) title确定对话框标题。
button=questdlg(‘qstring’’title’,’default’) 当按回车键时,返回default值default 必须是yes,no或cancel 之一。
button=questdlg(‘qstring’,’title’,’str1’,’str2’,’default’) 打开问题提示对话框,有两个按钮,分别由str1和str2确定,’qstdlg’确定提示信息,default必须是str1或str2之一。
button=questdlg(‘qstring’, ’title’,’str1’,’str2’,’str3’,’default’) 打开问题提示对话框,有三个按钮,分别由str1, str2和str3确定,’qstdlg’确定提示信息,default必须是str1, str2或str3之一。
例: ButtonName=questdlg('What is your wish?', ...
'Genie Question', ...
'Food','Clothing','Money','Money');
switch ButtonName,
case 'Food',
disp('Food is delivered');
case 'Clothing',
disp('The Emperor''s new clothes have arrived.')
case 'Money',
disp('A ton of money falls out the sky.');
end % switch
7) 进程条:以图形方式显示运算或处理的进程
h=waitbar(x,’title’) 显示以title为标题的进程条,x为进程条的比例长度,其值必须在0到1之间,h为返回的进程条对象的句柄。
waitbar(x,’title’,’creatcancelbtn’,’button_callback’) 在进程条上使用creatcancelbtn参数创建一个撤销按钮,在进程中按下撤销按钮将调用button_callback函数。
waitbar(…,property_name,property_value,…) 选择其它由prompt_name定义的参数,参数值由prompt_value指定。
例:
h=waitbar(0,'pleas wait...');
for i=1:10000
waitbar(i/10000,h)
end
close(h)
8)警告信息对话框:用于提示警告信息
h=warndlg(‘warningstring’,’dlgname’) 打开警告信息对话框,显示warningstring信息,dlgname确定对话框标题,h为返回对话句柄。
例:h=warndlg('Time is over!','运行时间')
Creating Graphical User Interfaces Defining Context MenusA context menu is displayed when a user right-clicks on the object for which the menu is defined. The Menu Editor enables you to define context menus and associate them with objects in the layout. See Defining Menus for the Menu Bar for information about defining menus in general. Creating the Parent MenuAll items in a context menu are children of a menu that is not displayed on the figure menu bar. To define the parent menu, select New Context Menu from the Menu Editor's toolbar. Note You must select the Menu Editor's Context Menus tab before you begin to define a context menu. Select the menu and specify the Tag to identify the context menu (axes_context_menu in this example). Adding Items to the Context MenuCreate the items that will appear in the context menu using New Menu Item on the Menu Editor's toolbar. When you select the menu item, the Menu Editor displays fields for you to enter the Label and Tag properties of the menu item. You can also Select the Separator above this item check box to display a separator above the menu item when the menu is first opened. Select the Check mark this item check box to display a check next to the menu item when the menu is first opened. A check is particularly useful to indicate the current state of the menu item. For example, suppose you have a menu item called Show axes that toggles the visibility of an axes between visible and invisible each time the user selects the menu item. If you want a check to appear next to the menu item when the axes are visible, add the following code to the callback for the Show axes menu item: if strcmp(get(gcbo, 'Checked'),'on')
set(gcbo, 'Checked', 'off');
else
set(gcbo, 'Checked', 'on');
end
This changes the value of the Checked property of the menu item from on to off or vice versa each time a user selects the menu item. If you set the axes to be visible when a user first opens the GUI, make sure to select the Check mark this item check box in the Menu Editor, so that a check will appear next to the Show axes menu item initially. Select the Enable this item check box so that the user can select this item when the menu is first opened. If you deselect this option, the menu item appears dimmed when the menu is first opened, and the user cannot select it. Click the More options button to open the Property Inspector where you can change all uimenu properties. Associating the Context Menu with an ObjectIn the Layout Editor, select the object for which you are defining the context menu. Use the Property Inspector to set this object's UIContextMenu property to the desired context menu. In the GUI M-file, complete the callback subfunction for each item in the context menu. Each callback executes when a user selects the associated context menu item. See Menu Callbacks for information on defining the syntax. Menu Callbacks