图形用户界面设计.pptx
《图形用户界面设计.pptx》由会员分享,可在线阅读,更多相关《图形用户界面设计.pptx(93页珍藏版)》请在淘文阁 - 分享文档赚钱的网站上搜索。
1、会计学1图形用户界面设计图形用户界面设计 图形用户界面(GUI)是指由窗口、菜单、图标、光标、按键、对话框和文本等各种图形对象组成的用户界面。它让用户定制用户与Matlab的交互方式,而命令窗口不是唯一与Matlab的交互方式。用户界面是用户与计算机进行信息交流的方式。计算机在屏幕显示图形和文本,若有扬声器还可产生声音。用户通过输入设备(如:键盘、鼠标、跟踪球、绘制板或麦克风),与计算机通讯。用户界面设定了如何观看和如何感知计算机、操作系统或应用程序。通常,多是根据悦目的结构和用户界面功能的有效性来选择计算机或程序。第1页/共93页 用户通过鼠标或键盘选择、激活这些图形对象,使计算机产生某种动
2、作或变化。Matlab中设计图形用户界面的方法有两种:使用可视化的界面环境和通过编写程序。由上一讲可知:用户菜单、用户控件和对话框是和坐标轴处于同一层次的,都是图形窗口的子对象。基本图形对象分为控件对象和用户界面菜单对象,简称控件和菜单。第2页/共93页图形用户界面设计工具的启动图形用户界面设计工具的启动方式:1.命令方式图形用户界面GUI设计工具的启动命令为guide,格式为:guide功能:启动GUI设计工具,并建立名字为untitled.fig 的图形用户界面。功能:启动GUI设计工具,并打开已建立的图形用户界面filename。guide filename第3页/共93页2.菜单方式
3、在Matlab的主窗口中,选择File菜单中的New菜单项,再选择其中的GUI命令,就会显示GUI的设计模板。第4页/共93页Matlab为GUI设计一共准备了4种模板,分别是:uBlank GUI(Default)(空白模板,默认);uGUI with Uicontrols(带控件对象的GUI模板);uGUI with Axes and Menu(带坐标轴与菜单的GUI模板);uModal Question Dialog(带模式问题对话框的GUI模板)。当用户选择不同的模板时,在GUI设计模板界面的右边就会显示出与该模板对应的GUI图形。第5页/共93页 图形用户界面设计工具启动时模板选择对
4、话框第6页/共93页 图形用户界面设计窗口 图形用户界面GUI设计窗口由菜单栏、工具栏、控件工具栏以及图形对象设计区等4个功能区组成。在GUI设计模板中选中一个模板,然后单击OK按钮,就会显示GUI设计窗口。选择不同的GUI设计模式时,在GUI设计窗口中显示的结果是不一样的。左图为空白GUI模板情形第7页/共93页 GUI设计窗口的菜单栏有File、Edit、View、Layout、Tools和Help 6个菜单项,使用其中的命令可以完成图形用户界面的设计操作。编辑工具在菜单栏的下方,提供了常用的工具;设计工具区位于窗口的左半部分,提供了设计GUI过程中所用的用户控件;空间模板区是网格形式的用
5、户设计GUI的空白区域。在GUI设计窗口创建图形对象后,通过双击该对象,就会显示该对象的属性编辑器。第8页/共93页 Matlab提供了一套可视化的创建图形窗口的工具,使用图形用户界面开发环境可方便地创建GUI应用程序,它可以根据用户设计的GUI布局,自动生成M文件的框架,用户使用这一框架编制自己的应用程序。一、图形用户界面开发环境(GUIDE)Matlab提供了一套可视化的创建图形用户接口(GUI)的工具,包括:第9页/共93页u对象浏览器(Object Browser)用于获得当前Matlab图形用户界面程序中的全部对象信息,对象的类型,同时显示控件的名称和标识,在控件上双击鼠标可以打开该
6、控件的属性编辑器;u布局编辑器(Layout Edtor)在图形窗口中创建及布置图形对象。布局编辑器是可以启动用户界面的控制面板,上述工具都必须从布局编辑器中访问,用guide命令可以启动,或在启动平台窗口中选择GUIDE来启动布局编辑器;u几何排列工具(Alignment Tool)调整各对象相互之间的几何关系和位置;u属性查看器(Property Inspector)查询并设置属性值;u菜单编辑器(Menu Editor)创建、设计、修改下拉式菜单和快捷菜单;uTab顺序编辑器(Tab Order Editor)用于设置当用户按下键盘上的Tab键时,对象被选中的先后顺序。第10页/共93页
7、 在Matlab 5中,GUI的设计是以 M文件的编程形式实现的,GUI的布局代码存储在M文件和MAT文件中,而在Matlab 6中有了很大的改变,Matlab 6将GUI的布局代码存储在 FIG文件中,同时还产生一个M文件用于存储调用函数,在M文件中不再包含GUI的布局代码,在开发应用程序时代码量大大减少。用于从控件选择板上选择控件对象并放置到布局区去,布局区被激活后就成为图形窗口。在命令窗口输入GUIDE命令或点击工具栏中的guide图标都可以打开空白的布局编辑器,在命令窗口输入GUIDE filename 可打开一个已存在的名为filename图形用户界面。1.布局编辑器(Layout
8、editor)第11页/共93页 将控件对象放置到布局区u 用鼠标选择并放置控件到布局区内;u 移动控件到适当的位置;u 改变控件的大小;u 选中多个对象的方法。一个简单的布局示例第12页/共93页 如所建立的布局还没有进行存储,可用File菜单下的Save As菜单项(或工具栏中的对应项),按输入的文件的名字,在激活图形窗口的同时将存储一对同名的M文件和带有.fig扩展名的FIG文件。激活图形窗口第13页/共93页 运行GUI程序 在命令窗口直接键入文件名或用openfig,open或hgload 命令运行GUI程序。第14页/共93页 布局编辑器参数设置选File菜单下的Preferenc
9、es 菜单项打开参数设置窗口,点击树状目录中的GUIDE,即可以设置布局编辑器的参数。第15页/共93页 布局编辑器的弹出菜单 在任一控件上按下鼠标右键,会弹出一个菜单,通过该菜单可以完成布局编辑器的大部分操作。第16页/共93页2.位置调整工具(Alignment tool)在选中多个对象后,可以方便的通过对象位置调整器调整对象间的对齐方式和距离。对象位置调整器中的第一栏是垂直方向的位置调整,第二栏是水平方向的位置调整。利用位置调整工具,可以对GUI对象设计区内的多个对象的位置进行调整。位置调整工具的打开方式有两种:从GUI设计窗口的工具栏上选择Align Objects命令按钮;选择Too
10、ls菜单下的Align Objects.菜单项,就可以打开对象位置调整器。第17页/共93页利用对象属性查看器,可以查看每个对象的属性值,也可以修改、设置对象的属性值。3.用属性查看器设置控件属性 打开属性查看器(Opening Property Inspector)对象属性查看器的打开方式有四种:u从GUI设计窗口工具栏上选择Property Inspector命令按钮;u选择View菜单下的Property Inspector菜单项;u在控件对象上单击鼠标右键,选择弹出菜单的 Property Inspector菜单项。u在命令窗口中输入inspect;第18页/共93页u 布置控件;u
11、定义文本框的属性;u 定义坐标轴的属性;u 定义按钮的属性;u 定义复选框。使用属性查看器(Using Property Inspector)第19页/共93页利用菜单编辑器,可以创建、设置、修改下拉式菜单和快捷菜单。选择 Tools 菜单下的 Menu Editor.子菜单,即可打开菜单编辑器。4.菜单编辑器(Menu Editor)菜单也可以通过编程实现,方法为从GUI设计窗口的工具栏上选择Menu Editor命令按钮,打开菜单编辑程序。第20页/共93页菜单编辑器包括菜单的设计和编辑,菜单编辑器有八个快捷键,可以利用它们任意添加或删除菜单,可以设置菜单项的属性,包括名称(Label)、
12、标识(Tag)、选择是否显示分隔线(Separator above this item)、是否在菜单前加上选中标记(Item is checked)、调用函数(Callback)。第21页/共93页 菜单编辑器左上角的第一个按钮用于创建一级菜单项。第二个按钮用于创建一级菜单的子菜单。第22页/共93页 菜单编辑器的左下角有两个按钮,选择第一个按钮,可以创建下拉式菜单。选择第二个按钮,可以创建Context Menu菜单。选择它后,菜单编辑器左上角的第三个按钮就会变成可用,单击它就可以创建Context Menu主菜单。在选中已经创建的Context Menu主菜单后,可以单击第二个按钮创建选中
13、的Context Menu主菜单的子菜单。与下拉式菜单一样,选中创建的某个Context Menu菜单,菜单编辑器的右边就会显示该菜单的有关属性,可以在这里设置、修改菜单的属性。第23页/共93页 菜单编辑器左上角的第四个与第五个按钮用于对选中的菜单进行左移与右移,第六与第七个按钮用于对选中的菜单进行上移与下移,最右边的按钮用于删除选中的菜单。第24页/共93页5.对象浏览器(Object Browsers)利用对象浏览器,可以查看当前设计阶段的各个句柄图形对象。可以在对象浏览器中选中一个或多个控件来打开该控件的属性编辑器。对象浏览器的打开方式有:从GUI设计窗口的工具栏上选择Object B
14、rowser命令按钮;选择View菜单下的Object Browser子菜单;在设计区域单击鼠标右键,选择弹出菜单的 Object Browser。第25页/共93页.Tab顺序编辑器(Tab Order Editor)利用Tab顺序编辑器(Tab Order Editor),可以设置用户按键盘上的Tab键时,对象被选中的先后顺序。Tab顺序编辑器的打开方式为:选择Tools菜单下的Tab Order Editor.菜单项,就可以打开Tab顺序编辑器。从GUI设计窗口的工具栏上选择Tab Order Editor.命令按钮。第26页/共93页1.GUI控件对象类型 控件对象是事件响应的图形界面
15、对象。当某一事件发生时,应用程序会做出响应并执行某些预定的功能子程序(Callback).2.控件对象的描述 Matlab中的控件大致可分为两种,一种为动作控件,鼠标点击这些控件时会产生相应的响应。一种为静态控件,是一种不产生响应的控件,如文本框等。二、控件对象及属性 每种控件都有一些可以设置的参数,用于表现控件的外形、功能及效果,既属性。属性由两部分组成:属性名和属性值,它们必须是成对出现的。第27页/共93页按钮(Push Buttons):执行某种预定的功能或操作;开关按钮(Toggle Button):产生一个动作并指示一个二进制状态(开或关),当鼠点击它时按钮将下陷,并执行callb
16、ack(回调函数)中指定的内容,再次点击,按钮复原,并再次执行callback 中的内容;单选框(Radio Button):单个的单选框用来在两种状态之间切换,多个单选框组成一个单选框组时,用户只能在一组状态中选择单一的状态,或称为单选项;复选框(Check Boxes):单个的复选框用来在两种状态之间切换,多个复选框组成一个复选框组时,可使用户在一组状态中作组合式的选择,或称为多选项;文本编辑器(Editable Texts):用来使用键盘输入字符串 的值,可以对编辑框中的内容进行编辑、删除和替换等操作;第28页/共93页静态文本框(Static Texts):仅用于显示单行的说明文字;滚
17、动条(Slider):可输入指定范围的数量值;边框(Frames):在图形窗口圈出一块区域;列表框(List Boxes):在其中定义一系列可供选择的字符串;弹出式菜单(Popup Menus):让用户从一列菜单项中选择一项作为参数输入;此外还有坐标轴(Axes),用于显示图形和图象。第29页/共93页 用户可以在创建控件对象时,设定其属性值,未指定时将使用系统缺省值。3.控件对象的属性(Attributes of controller object)两大类控件对象属性:第一类是所有控件对象都具有的公共属性,第二类是控件对象作为图形对象所具有的属性。第30页/共93页控件对象的公共属性uChi
18、ldren 取值为空矩阵,因为控件对象没有自己的子对象;uTag取值为字符串,定义了控件的标识值,在任何程序中都可以通过这个标识值控制该控件对象;uType 取值为uicontrol,表明图形对象的类型;uVisible取值为on 或off。uUserDate取值为空矩阵,用于保存与该控件对象相关的重要数据和信息;uParent取值为某个图形窗口对象的句柄,该句柄表明了控件对象所在的图形窗口;第31页/共93页uBackgroundColor取值为颜色的预定义字符或RGB数值;缺省值为浅灰色;uCallback取值为字符串,可以是某个M文件名或一小段Matlab语句,当用户激活某个控件对象时,
19、应用程序就运行该属性定义的子程序;uEnable取值为on(缺省值),inactive和off;uExtend取值为四元素矢量0,0,width,height,记录控件对象标题字符的位置和尺寸;uForegroundColor取值为颜色的预定义字符或RGB数值,该属性定义控件对象标题字符的颜色;缺省值为黑色;uMax,Min取值都为数值,缺省值分别为1和0;uString取值为字符串矩阵或块数组,定义控件对象标题或选项内容;uStyle取值可以是pushbutton(缺省值),radiobutton,checkbox,edit,text,slider,frame,popupmenu 或list
20、box;uUnits取值可以是pixels(缺省值),normalized(相对单位),inches,centimeters(厘米)或points(磅);uValue取值可以是矢量,也可以是数值,其含义及解释依赖于控件对象的类型。控件对象的基本控制属性第32页/共93页uFontAngle 取值为normal(正体,缺省值),italic(斜体),oblique(方头);uFontName取值为控件标题等字体的字库名;uFontSize取值为数值;uFontUnits取值为points(缺省值),normalized,inches,centimeters或pixels;uFontWeight
21、取值为normal(缺省值),light,demi和bold,定义字符的粗细;uHorizontalAligment 取值为left,center(缺省值)或 right,定义控件对象标题等的对齐方式。控件对象的修饰控制属性第33页/共93页uListboxTop取值为数量值,用于listbox控件对象;uSliderStep 取值为两元素矢量minstep,maxstep,用于slider控件对象;uSelected 取值为on 或off(缺省值);uSlectionHoghlight 取值为on 或off(缺省值)。控件对象的辅助属性uBusyAction 取值为cancel或queue(
22、缺省值);uButtDownFun 取值为字符串,一般为某个M文件名或一小段Matlab程序;uCreatfun 取值为字符串,一般为某个M文件名或一小段Matlab程序;uDeletFun取值为字符串,一般为某个M文件名或一小段Matlab程序;uHandleVisibility取值为on(缺省值),callback或off;uInterruptible 取值为on 或off(缺省值)。Callback管理属性第34页/共93页4.控件对象的建立 Matlab提供了用于建立控件对象的函数uicontrol,其调用格式为:对象句柄=uicontrol(图形窗口句柄,属性名1,属性值1,属性名2
23、,属性值2,)其中各个属性名及可取的值和后面将介绍的uimenu函数相似,但也不尽相同。在对话框上有各种各样的控件,利用这些控件可以实现有关控制。例1 建立数制转换对话框。在左边输入一个十进制整数和216之间的数,单击“转换”按钮能在右边得到十进制数所对应的216进制字符串,单击“退出”按钮退出对话框。程序如下:第35页/共93页 hf=figure(Color,0,1,1,Position,100,200,400,200,.Name,数制转换,NumberTitle,off,MenuBar,none);uicontrol(hf,Style,Text,Units,normalized,.Pos
24、ition,0.05,0.8,0.45,0.1,Horizontal,center,.String,输 入 框,Back,0,1,1);uicontrol(hf,Style,Text,Position,0.5,0.8,0.45,0.1,.Units,normalized,Horizontal,center,.String,输 出 框,Back,0,1,1);uicontrol(hf,Style,Frame,Position,0.04,0.33,0.45,0.45,.Units,normalized,Back,1,1,0);uicontrol(hf,Style,Text,Position,0.0
25、5,0.6,0.25,0.1,.Units,normalized,Horizontal,center,.String,十进制数,Back,1,1,0);uicontrol(hf,Style,Text,Position,0.05,0.4,0.25,0.1,.Units,normalized,Horizontal,center,.String,216进制,Back,1,1,0);he1=uicontrol(hf,Style,Edit,Position,0.25,0.6,0.2,0.1,.Units,normalized,Back,0,1,0);he2=uicontrol(hf,Style,Edit
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 图形 用户界面 设计
限制150内