GUI指导教程系列.doc

GUI指导教程系列(1)：GUI入门基本操作
为什么在Matlab中要使用GUI呢？其实GUI就是Matlab中的Visual Basic，是面向对象的编程，可以使Matlab程序的终端用户，即使不懂的Matlab也可以轻易操作该程序。
如果没有图形用户界面(GUI)我们只能从命令行(Command Window)中调用相关程序，这相对比较繁琐，并且不是所有用户都有这个能力。就好比计算机的DOS系统，在有windows的情况下，您会选择DOS吗？当然也不排除骨灰级的人物。
在本节教程我们主要针对没有GUI创建和使用经历的网友，但是必要的MATLAB基础知识是需要的。在教程中我们将创建一个简单的GUI程序，它执行两个数的加法运行，然后显示其运算结果。

什么Matlab还没有安装？那请您先看下论坛的【MATLAB下载安装】版块(最新版本2009b，4.75GB)，里面有您在Matlab下载安装过程中需要的一些资料，下面开始我们的教程。
一、打开和创建GUI界面
1、首先打开Matlab，在Command Window中输入guide回车。

当然也可以通过工具栏的GUIDE按钮直接打开。

2、此时打开GUI编辑器GUIDE(GUI Developer的缩写)
2.1 界面上有两个标签也“Creat New GUI”和“Open Existing GUI”。如果创建新的GUI此时我们选择第一个标签页，但如果打开其它已经存在的GUI就点击第二个标签吧。
2.2 这里我们选择第一个标签下的“Blank GUI”(空白GUI)，下面还有几个系统GUI模板，你可以根据需要选择其它的模板。

2.3 点击“OK”我们正式进入GUIDE界面，呵呵，是不是感觉似曾相识。

3、添加你需要的控件到figure中，在添加控件之前，您最好对您的GUI界面布局已经有一定的构思了，否则盲目性太大了，不利于您的编程。下面是我们构思的布局。

二、添加控件和设置属性
在正式讲解之前，我们先讲解下GUI中的鼠标基本操作：
(a) 在左边的控件面板中鼠标左击选择您需要的控件，然后放开鼠标。
(b) 在右边的figure中按住左键，画出您的控件，于是控件就出现在figure上。
(c) 你可以用鼠标拖拽figure上所有控件，来改变他们的位置。
(d) 在控件上双击鼠标左键(右击是快捷菜单)可打开控件“属性查看器”。
1、从上面的布局构思，我们知道本GUI需要以下控件：
：两个“编辑文本框”(Edit Text)；
：四个“静态文本框”(Static Text)；
：一个“确定按钮”(Push button)；
按照上面介绍的鼠标操作方法，将这6个控件拖到右边的figure中，如下图所示。

2、接下来就是编辑这些控件的属性
下面从Static Text开始，双击其中一个“静态文本框”，将弹出该控件的“属性查看器”(Property Inspector)。

GUI控件的几个常用属性说明如下：
position：指示空间在figure中的位置
font**：字体相关属性
string：相当如VB中的caption，就是显示在控件上的文字
tag：控件的唯一标识符，相当于ID，我们需要tag来指定figure中的某一个控件。
2.1 在这里把它的“ string ”属性修改为“ + ” ；

2.2 再修改它的“ fontsize ”属性为20。
编辑完这些属性后，直接点击右上角的“关闭”按钮，关闭属性查看器，此时属性会自动保存。回到GUIDE，如果控件上的文字被部分隐盖，此时可以通过鼠标拖拽改变控件的大小。
2.3 重复上面的操作：
(1)将第二个“ Static Text ”的“ string ”改为“ = ” ；
(2)将第二个“ Static Text ”的“ fontsize ”改为20；
(3)将第三个“ Static Text ”的“ string ”改为“ My Adder GUI” ；(4)将第三个“ Static Text ”的“ fontsize ”改为20；
(5)将第四个“ Static Text ”的“ string ”改为“ 0 ”；
(6)将第四个“ Static Text ”的“ tag ” 改为 “ answer_staticText ” 。

于是，我们将得到如下所示的GUI界面：

2.4 下面双击Edit Text，修改“编辑文本框”的属性：
(1)第一个“ Edit Text ”的用来存储第一个加数，我们将“string”改为“0”，“tag”改为“input1_editText”。
(2)第二个“ Edit Text ”的用来存储第二个加数，我们将“string”改为“0”，“tag”改为“input2_editText”。

2.5 修改Pushbutton按钮的属性，“string”改为“Addtag”改为“add_pushbutton”。

再次预览下我们现在得到的GUI界面

3、重新布局和移动控件位置，使其美观。

将上面编辑完的GUI程序保存为myAdder，此时在当前目录下，Matlab将自动生成如下来个两个文件myAdder.m和myAdder.fig。
.fig文件包含了程序的图形用户界面，.m文中包含了GUI所需的回调函数和其他必须代码。
三、书写GUI回调函数(callback)代码
在保存GUI程序时，Matlab会自动生成.fig和.m文件，其中的.m就是我们现在要操作的对象。
我们就是在M文件中添加控件的回调函数，来完成用户的相应操作，这也是GUI编程的核心内容，它要求你必须掌握Matlab基本编程以及图形句柄语句。
打开.m文件，发现里面有很多function的代码，看得我们眼花缭乱，呵呵，不要胆怯！本教程是初级教程，我们只涉及里面的callback，其它的项我们可以暂时置之不理，我们以后的教程中对其它项做出相关地介绍。
在正式讲解之前，先介绍一个使用小技巧，Matlab Editor(代码编辑器)工具栏显示函数按钮 ，可以让我们快速跳转我们需要的函数位置，这个在.m文件的内容很多的时候是很有用的。

1、在Editor中的工具栏上，单击Show Function，从中选择input1_editText_Callback，或者右击tag为input1_editText的编辑文本框，View Callback→Callback。
2、此时光标会跳转到.m文件的function input1_editText_Callback处，以方便我们直接编辑。
function input1_editText_Callback(hObject, eventdata, handles)
% hObject handle to input1_editText (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
% Hint: get(hObject,'String') returns contents of input1_editText as text
% str2double(get(hObject,'String')) returns contents of input1_editText as a double
在上面代码下面添加如下MATLAB代码：
% handles 包含figure中所有图形对象句柄的结构体，如果我们想引用tag为mytag的控件，使用handles.mytag。
% set/get 函数是用来设置/获取某个控件属性。
% 使用get命令获取第一个加数，并将它转换成数值。
input = str2num(get(hObject,'String')); % string属性是字符串，所以必须转换成数值。
% 检验输入是否为空，是则将它置为0
if (isempty(input))
set(hObject,'String','0')
end
% 保存handles结构体，只要在handles结构体有改变时，才需要保存。
guidata(hObject, handles);
这里由于handles没有改变，故这里其实没有必要，但是为了避免潜在的不必要麻烦，建议在所有Callback最后都添加该命令。
3、为input2_editText_Callback添加完全相同的代码。
4、编辑add_pushbutton_Callback回调函数，使用上面提到的方法，将光标定位到
% --- Executes on button press in add_pushbutton.
function add_pushbutton_Callback(hObject, eventdata, handles)
% hObject handle to add_pushbutton (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)
在后面我们添加上如下代码：
a = get(handles.input1_editText,'String');
b = get(handles.input2_editText,'String');
% a和b是字符串变量，我们需要使用str2double函数将其转换为数值
% 然后才能相加，否则字符串是没法相加的
total = str2num(a) + str2num(b); % 格式转换，转换为数值
% 由于string属性是字符串，所以必须将两个数的和转换为字符串
c = num2str(total); % 转换为字符串
%将结果赋值给answer_staticText空间的string属性，于是就可以显示结果了。
set(handles.answer_staticText,'String',c);
guidata(hObject, handles); % 更新结构体
恭喜您，到此为此这个GUI程序就完成了！接下来就可以运行和演示它了。
有一个小技巧要告诉大家的，如果您在第一次保存GUI程序时，不想让Matlab为每一个callback回调函数自动生成注释文本，可以如下操作：File→Preferences...

如果不想让Matlab自动生成fig文件，而只是生成M文件，可以如下操作：Tools→GUI Option

四、GUI程序打开、运行和发布
1、想在GUIDE中打开一个写好的GUI程序，可有两种方法
1.1 如上面所说的，在打开GUIDE界面时，我们可以选择“Open Existing GUI”，然后选中你需要打开的GUI程序。

1.2 直接在Current Directory选中*.fig文件，然后右击选择“Open In GUIDE”

2、运行编辑好的GUI程序方法主要有三种方法
2.1 点击GUIDE工具栏的run按钮 ，如下图所示

2.2 从Command Window命令行运行，首先将MATLAB当前目录切换到*.fig和*.m文件所在目录(两个必须同在当前目录或者都在搜索路径下)

接着在Command Window中输入GUI的文件名(不需要扩展名)myAdder，然后回车。

2.3 直接在Current Directory中选中myAdder.m，右击选择“Run File”即可。通过上面三种方法中任意一种，GUI程序将开始运行，并显示如下：

3执行GUI程序功能：
在两个文本框中输入分别输入两个加数，然后点击Add!按钮，此时和将显示在“ = ” 右边的文本框中。
五、程序常见问题(bug)解答
如果你的GUI程序没有正确运行，或者频频报错，而苦于没法找到错误在哪里，这里有几个小技巧希望能帮助您找到bug。
1、如果是语法错误，Command Window中会以命令行的形式告诉您bug所在的文件、行号，以及简短的错误描述，当然摆平这样的bug你必要有一定Matlab基础。
2、确保您的变量名在整个代码中前后一致，注意大小写，否则不小心敲错的字母。同理控件的tag属性在.fig和.m文件中必须同步，比如说你要获取tag为input1_editText的编辑文本框的string，此时一定注意要与代码中tag一致，即就是如下所示 ：
a = get(handles.input1_editText,'String');
这一条特别是在你重新修改某个控件的tag之后尤为值得注意。
3、在code中适当设置断点，程序运行到断点的时候会暂停，此时我们可以方便的获取程序中的中间变量值，这是一个不错的调试方法，也是最经常用到的。(断点如何设置？在代码左边行号旁边点击下就设置了一个断点了)
4、整个GUI程序的代码可以到这里下载 。
5、如果你是刚开始的菜鸟，的确找不到错误在哪里，那建议您把整个过程再来一次。

- 17 -