用户图形界面设计.ppt

《用户图形界面设计.ppt》由会员分享，可在线阅读，更多相关《用户图形界面设计.ppt（40页珍藏版）》请在得力文库 - 分享文档赚钱的网站上搜索。

1、用户图形界面设计 Still waters run deep.流静水深流静水深,人静心深人静心深 Where there is life,there is hope。有生命必有希望。有生命必有希望本章目标l理解用户图形界面的用途l掌握图形用户界面的设计开发工具GUIDEl理解图形对象的常用句柄命令2主要内容l7.1图形用户界面设计工具图形用户界面设计工具GUIDEl7.2控件控件l7.3 GUIDE常用工具常用工具l7.4使用使用GUIDE的的GUI设计设计l7.5句柄图形句柄图形l7.6图形对象句柄命令图形对象句柄命令37.1图形用户界面设计工具GUIDEl可视化图形界面开发环境可视化图形界

2、面开发环境GuideGraphical User Interface Development Environment4用户界面开发环境组成（1）菜单栏；）菜单栏；（2）Guide工具栏；工具栏；（3）图形控件面板；）图形控件面板；（4）界面编辑客户区。）界面编辑客户区。57.2 控件1静态文本（静态文本（Static Text）2编辑框（编辑框（Edit Text）控件）控件3列表框（列表框（Listbox）控件）控件4滚动条（滚动条（Slider）控件）控件5按钮（按钮（Push Button）控件）控件6开关按钮（开关按钮（Toggle Button）控件）控件7单选按钮（单选按钮（Rad

3、io Button）控件）控件8按钮组（按钮组（Button Group）控件）控件9检查框（检查框（Check Box）控件）控件10列表框（列表框（Listbox）控件）控件11弹出式菜单（弹出式菜单（Popup Menu）控件）控件12坐标轴（坐标轴（Axes）控件）控件13面板（面板（Panel）控件）控件67.3 GUIDE常用工具常用工具lLayout Editor：布局编辑器；：布局编辑器；lAlignment Tool：对齐工具；：对齐工具；lProperty Inspector：对象属性观察器；：对象属性观察器；lObject Browser：对象浏览器；：对象浏览器；lMe

4、nu Editor：菜单编辑器。：菜单编辑器。71布局编辑器（1）Cut：对选中的控件进行剪切操作。：对选中的控件进行剪切操作。（2）Copy：复制选中的控件。：复制选中的控件。（3）Paste：粘贴复制的控件。：粘贴复制的控件。（4）Delete：删除选中的控件。：删除选中的控件。（5）Duplicate：对选中的控件进行复制并粘贴。：对选中的控件进行复制并粘贴。（6）Property Inspector：对选中的控件打开属性检查器。：对选中的控件打开属性检查器。（7）Object Browser：打开对象浏览器。：打开对象浏览器。（8）ButtonDownFcn：按下鼠标时控件回调的函数。

5、：按下鼠标时控件回调的函数。（9）Callback：单击鼠标时控件回调的函数或功能。：单击鼠标时控件回调的函数或功能。（10）CreateFcn：定义控件在创建阶段执行的回调例程。：定义控件在创建阶段执行的回调例程。（11）DeleteFcn：定义在对象的删除阶段执行的回调例程。：定义在对象的删除阶段执行的回调例程。82对齐工具93对象属性观察器对象属性观察器一、控件风格和外观一、控件风格和外观（1）BackgroundColor：设置控件背景颜色，使用：设置控件背景颜色，使用R G B或颜色定义。或颜色定义。（2）CData：在控件上显示的真彩色图像，使用：在控件上显示的真彩色图像，使用矩阵

6、表示。矩阵表示。（3）ForegroundColor：文本颜色。：文本颜色。（4）String属性：控件上的文本，以及列表框和弹属性：控件上的文本，以及列表框和弹出菜单的选项。出菜单的选项。（5）Visible：控件是否可见。：控件是否可见。103对象属性观察器对象属性观察器二、对象的常规信息二、对象的常规信息（1）Enable属性：属性：表示此控件的使能状态，设置为表示此控件的使能状态，设置为on”，表示可选，为表示可选，为“off”时则表示不可选。时则表示不可选。（2）Style：控件对象类型。：控件对象类型。（3）Tag：控件表示（用户定义）。：控件表示（用户定义）。（4）Tooltip

7、String属性：提示信息显示。当鼠标指针位于此属性：提示信息显示。当鼠标指针位于此控件上时，显示提示信息。控件上时，显示提示信息。（5）UserData：用户指定数据。：用户指定数据。（6）Position：控件对象的尺寸和位置。：控件对象的尺寸和位置。（7）Units：设置控件的位置及大小的单位：设置控件的位置及大小的单位（8）有关字体的属性，如）有关字体的属性，如 FontAngle，FontName等。等。113对象属性观察器对象属性观察器三、控件回调函数的执行三、控件回调函数的执行（1）BusyAction：处理回调函数的中断。有两种选项：即：处理回调函数的中断。有两种选项：即Can

8、cel：取消中断事件，：取消中断事件，queue：排队（默认设置）。：排队（默认设置）。（2）ButtonDownFcn属性：按钮按下时的处理函数。属性：按钮按下时的处理函数。（3）CallBack属性：是连接程序界面整个程序系统的实质属性：是连接程序界面整个程序系统的实质性功能的纽带。该属性值应该为一个可以直接求值的字符性功能的纽带。该属性值应该为一个可以直接求值的字符串，在该对象被选中和改变时，系统将自动地对字符串进串，在该对象被选中和改变时，系统将自动地对字符串进行求值。行求值。（4）CreateFcn：在对象产生过程中执行的回调函数。：在对象产生过程中执行的回调函数。（5）Delete

9、Fcn：删除对象过程中执行的回调函数。：删除对象过程中执行的回调函数。（6）Interruptible属性：指定当前的回调函数在执行时是否属性：指定当前的回调函数在执行时是否允许中断，去执行其他的函数。允许中断，去执行其他的函数。123对象属性观察器对象属性观察器四、控件当前状态信息四、控件当前状态信息（1）ListboxTop：在列表框中显示的最顶层的字符：在列表框中显示的最顶层的字符串的索引。串的索引。（2）Max：最大值。：最大值。（3）Min：最小值。：最小值。（4）Value：控件的当前值。：控件的当前值。134对象浏览器对象浏览器对象浏览器里面列出了所有对象的树状结构，对象浏览器里

10、面列出了所有对象的树状结构，这些结构就是当前正在设计的这些结构就是当前正在设计的GUI程序中用到的程序中用到的所有对象。所有对象。145菜单编辑器菜单编辑器l菜单编辑器提供了两种菜单类型的编辑功能：菜单编辑器提供了两种菜单类型的编辑功能：l下拉式菜单（MenuBar）l弹出式菜单（ContextMenu）15例7-2 编写一个3D立体图的演示程序167.4使用使用GUIDE的的GUI设计设计l使用使用Guide进行进行GUI的界面设计，就像在纸上绘的界面设计，就像在纸上绘制界面一样简单。制界面一样简单。l界面编辑工具设计出界面的大体方案l事件过程编辑器编写各个对象的事件代码17例7-3 建立一

11、个图形界面来显示和处理三维图形 基本功能要求如下。基本功能要求如下。（1）建立一个坐标系，以备以后来绘制三维图形；）建立一个坐标系，以备以后来绘制三维图形；（2）建立三个按钮，用于启动绘图功能；）建立三个按钮，用于启动绘图功能；（3）建立一个组合框（）建立一个组合框（Popup Menu），用于显示不同的），用于显示不同的图形。图形。18解题步骤：（1）打开布局编辑器）打开布局编辑器（2）增加组件）增加组件（3）对齐工具）对齐工具（4）设置每个组件的属性；）设置每个组件的属性；（5）设置）设置Guide应用程序选项，采用默认属性。应用程序选项，采用默认属性。（6）激活图形）激活图形19程序代码

12、：程序代码：function varargout=My0703(varargin)gui_Singleton=1;gui_State=struct(gui_Name,mfilename,.gui_Singleton,gui_Singleton,.gui_OpeningFcn,My0703_OpeningFcn,.gui_OutputFcn,My0703_OutputFcn,.gui_LayoutFcn,.gui_Callback,);if nargin&ischar(varargin1)gui_State.gui_Callback=str2func(varargin1);endif nargo

13、ut varargout1:nargout=gui_mainfcn(gui_State,varargin:);else gui_mainfcn(gui_State,varargin:);end20程序代码：程序代码：function My0703_OpeningFcn(hObject,eventdata,handles,varargin)handles.peaks=peaks(35);handles.membrane=membrane;x,y=meshgrid(-8:0.5:8);r=sqrt(x.2+y.2)+eps;sinc=sin(r)./r;handles.sinc=sinc;hand

14、les.current_data=handles.peaks;surf(handles.current_data);handles.output=hObject;guidata(hObject,handles);function varargout=My0703_OutputFcn(hObject,eventdata,handles)varargout1=handles.output;function Surf_pushbutton_Callback(hObject,eventdata,handles)surf(handles.current_data);function Mesh_pushb

15、utton_Callback(hObject,eventdata,handles)mesh(handles.current_data);21程序代码：程序代码：function Contour_pushbutton_Callback(hObject,eventdata,handles)contour(handles.current_data);function data_popup_Callback(hObject,eventdata,handles)val=get(hObject,Value);str=get(hObject,String);switch strvalcase peaks h

16、andles.current_data=handles.peaks;case membrane handles.current_data=handles.membrane;case sinc handles.current_data=handles.sinc;endguidata(hObject,handles);227.5句柄图形句柄图形l句柄图形是对底层图形命令集合的总称，句柄图形是对底层图形命令集合的总称，它实际上进行生成图形的工作。它实际上进行生成图形的工作。237.5.1句柄图形的层次关系句柄图形的层次关系247.5.2图形窗口对象的属性图形窗口对象的属性1Color属性属性2Men

17、uBar属性属性3Name属性属性4NumberTitle属性属性5Units 属性属性6Position属性属性7Resize属性属性8Visible属性属性9NextPlot属性属性10打印纸属性打印纸属性11各种回调函数各种回调函数257.6图形对象句柄命令图形对象句柄命令l句句柄柄系系统统可可以以从从底底层层(1ow level)创创建建和和操操作作线线、面、文字、图像等基本图形对象指令。面、文字、图像等基本图形对象指令。267.6.1建立图形对象的函数1figure函数：创建一个新的图形对象。函数：创建一个新的图形对象。2newplot函数：做好开始画新图形对象的准备。函数：做好开始

18、画新图形对象的准备。3axes函数：创建坐标轴图形对象。函数：创建坐标轴图形对象。4line函数：画线。函数：画线。5patch函数：填充多边形。函数：填充多边形。6surface函数：绘制三维曲面。函数：绘制三维曲面。7image函数：显示图片对象。函数：显示图片对象。8uicontrol函数：生成用户控制图形对象。函数：生成用户控制图形对象。9uimenu函数：生成图形窗口的菜单中层次菜单与下一函数：生成图形窗口的菜单中层次菜单与下一级子菜单。级子菜单。27例7-4 显示曲线图程序程序：h=figure();t=0:pi/10:2*pi;line(t,sin(t);line(t,cos(t

19、);28例7-5显示多边形。程序程序：x=0:pi/4:2*pi;patch(sin(x),cos(x),r)297.6.2图形对象句柄的获得和删除图形对象句柄的获得和删除lgcf函数：获得当前图形窗口的句柄函数：获得当前图形窗口的句柄lgca函数：获得当前坐标轴的句柄函数：获得当前坐标轴的句柄lgco函数：获得当前对象的句柄函数：获得当前对象的句柄lgcbo函数：获得当前正在执行调用的对象的句柄函数：获得当前正在执行调用的对象的句柄lgcbf函数：获取包括正在执行调用的对象的图形函数：获取包括正在执行调用的对象的图形句柄句柄ldelete函数：删除句柄所对应的图形对象函数：删除句柄所对应的图

20、形对象lfindobj函数：查找具有某种属性的图形对象函数：查找具有某种属性的图形对象307.6.3对象属性的获取和设置对象属性的获取和设置l（1）get函数返回某些对象属性的当前值。例如：函数返回某些对象属性的当前值。例如：lpget(hf_1,Position);l（2）函数）函数set改变句柄图形对象属性，例如：改变句柄图形对象属性，例如：lset(hf_1,Position,vect);31扩展阅读l7.7公用对话框公用对话框文件文件l文件选择对话框l颜色选择对话框l字体选择对话框l页面设置对话框l警告与错误信息对话框l简单帮助信息对话框32上机指导上机指导l7.8 动画制作动画制作l

21、例：编写一个演示程序，用于显示小球沿正弦曲线运动的运动规律。33应用举例应用举例利用界面设计工具利用界面设计工具guide，重新编写，重新编写MATLAB中中平面演示程序平面演示程序graf2d.m。34解题步骤：l（1）利用界面编辑器，设计窗口初始位置和大小，添加）利用界面编辑器，设计窗口初始位置和大小，添加所需控件所需控件l（2）新建图形对象，对齐所有控件）新建图形对象，对齐所有控件l（3）设置新建对象的属性）设置新建对象的属性l（4）在产生的）在产生的M文件加入相应代码文件加入相应代码35程序代码1function line_pushbutton_Callback(hObject,eve

22、ntdata,handles)cmdStr=str2mat(.%Line plot of a chirp,.x=0:0.05:5;,.y=sin(x.2);,.plot(x,y);.);set(handles.edit1,String,cmdStr);evalmcw(handles.edit1);function bar_pushbutton_Callback(hObject,eventdata,handles)cmdStr=str2mat(.%Bar plot of a bell shaped curve,.x=-2.9:0.2:2.9;,.bar(x,exp(-x.*x);.);set(h

23、andles.edit1,String,cmdStr);evalmcw(handles.edit1);36程序代码2function stair_pushbutton_Callback(hObject,eventdata,handles)cmdStr=str2mat(.%Stairstep plot of a sine wave,.x=0:0.25:10;,.stairs(x,sin(x);.);set(handles.edit1,String,cmdStr);evalmcw(handles.edit1);function Error_pushbutton_Callback(hObject,e

24、ventdata,handles)cmdStr=str2mat(.%Errorbar plot,.x=-2:0.1:2;,.y=erf(x);,.e=rand(size(x)/10;,.errorbar(x,y,e);.);set(handles.edit1,String,cmdStr);evalmcw(handles.edit1);37程序代码3function Polar_pushbutton_Callback(hObject,eventdata,handles)cmdStr=str2mat(.%Polar plot,.t=0:.01:2*pi;,.polar(t,abs(sin(2*t)

25、.*cos(2*t);.);set(handles.edit1,String,cmdStr);evalmcw(handles.edit1);function stem_pushbutton_Callback(hObject,eventdata,handles)cmdStr=str2mat(.%Stem plot,.x=0:0.1:4;,.y=sin(x.2).*exp(-x);,.stem(x,y).);set(handles.edit1,String,cmdStr);evalmcw(handles.edit1);38程序代码4function info_pushbutton_Callback(hObject,eventdata,handles)helpwinfunction close_pushbutton_Callback(hObject,eventdata,handles)close(gcf);39l学好计算机的唯一途径是学好计算机的唯一途径是 l你的编程能力与你在计算机上投入的时间成你的编程能力与你在计算机上投入的时间成 结 束 语40