Matlab App designer学习笔记

学习Matlab的GUI设计，在记笔记的同时也方便日后查找。

参考教程：MATLAB App Designer基础教程Matlab GUI界面设计（全集更新完毕-用户界面设计appdesigner（中文）Matlab Gui教程

App designer简介

image-20260207192035106

点击左上角打开App designer。

image-20260207192159601

可以拖动控件放到画布，右侧为控件属性，然后保存运行就可以看见ui界面了。

image-20260207192314199

右上角可以打开代码视图。

制作一个自己的demo

  1. 鼠标拖动画布右下角可以改变画布大小
image-20260207192801896
  1. 修改标签（文本）属性。可以修改内容，字体，颜色等等。

image-20260207192915017

  1. 为了让APP在运行的时候可以变大变小。右侧属性-位置-resize和autoResizeChildren。

  2. 后台代码编写

    image-20260211192700264

​ 右键选择控件，然后添加控件的回调函数。

image-20260211192835221

​ 右上角会显示类和对应的方法，可以查看，不用背。也可以直接拖到代码里进行插入。

image-20260211193210767

  1. 组合组件

    image-20260211200619348

Lamp（信号灯）控件的使用

image-20260211201419458

选择控件——交互性——tooltip。把光标放到上面后会显示提示信息。

image-20260211202132951

image-20260211203537488

toogle（状态） switch开关的使用；strcmp算子

image-20260211205943540

在判断状态的时候会用到strcmp()算子

image-20260211210218031

开关的value值必须在Items里面，比较字符串是否相同

image-20260211210344897

其余几种开关也是一样的使用方法。

坐标轴控件axis函数绘图方法

image-20260211211051131

在按键的回调函数中，定义xy。然后用plot函数实现绘图。需要注意的是，plot输入的第一个参数应该为控件类。

1
2
3
x = 1:0.01:10;
y = sin(x);
plot(app.UIAxes,x,y,'r')

如果想把多个图像绘制到一个坐标中，需要在两个plot中间插入hold on防止原来的图像被覆盖。

1
2
3
4
5
6
7
8
x = 1:0.01:10;
y = sin(x);
y1 = cos(x);
y2 = cos(x)+1;
plot(app.UIAxes,x,y,'r');
hold(app.UIAxes,"on");
plot(app.UIAxes,x,y1,'b');
plot(app.UIAxes,x,y2,'g');

如果想用坐标区显示图像，先用imread读取图像，然后用imshow显示在坐标轴中，需要注意一定要使用’Parent’参数。

1
2
3
4
5
%读取图像
file="C:\Users\Cucumber\Desktop\87f530a572d010ca8c879e6881e4806.jpg";
im = imread(file);

imshow(im, 'Parent',app.UIAxes);

可以使用axis()算子隐藏坐标轴。

1
xis(app.UIAxes,"off");

msgbox()用法

可以弹出一个对话框

1
msgbox("你好","biaoti","help");

image-20260211213703199

questdlg()用法

用于弹出可以选择框。

doc questdlg查看详细信息。

image-20260211214430541

delete()用法

delete(app.UIFigure)就可以退出进程。

交互性选择路径

image-20260211220539823

在正则表达式中，*表示一个通配符。

1
[filename,pathname]=uigetfile({'*.jpg';'*.png';'*.bmp'},"标题")

disp()为打印函数，会输出括号内的内容

strcat(s1,s2)为字符串链接函数，会将两个字符串连接在一起。用法可以写为strcat(filename,pathname)

如果filename或者pathname为0，isequal(pathname,0)，就是没有选中文件。

startupFcn回调函数的使用

开启ui的时候想让他执行的操作。不需要按键等触发就可以执行。

image-20260211223129936

布局方式-菜单栏-面板等控件讲解

  1. 使用选项卡组可以设计多个界面，实现画布内容的切换

    image-20260211223942915

  2. 面板控件，可以起一个收纳的作用，保证拖动时面板内部的控件相对位置不发生改变

    image-20260211224156675

  3. 菜单栏，相当于1级菜单。

    image-20260211224318167

仪表盘控件的使用

  1. 仪表控件在右侧的 仪表-ScaleColors可以添加每段的颜色。

​ value为指针的初始值

​ 刻度栏可以更改刻度标签，majorticks写值，majorticklables写每个数值对应的字符串。

image-20260211224654083

  1. 旋钮控件，滑块控件

    有两个回调函数，changing是按住拖动的时候数值就会发生更改，changed是释放鼠标才会更新value。

    image-20260211224949216

强制类型转换

string(变量)

属性

私有属性只能在app里调用，公共属性在外部也可以调用。

声明公共属性后，需要用类的方法进行调用

app.t，调用公共属性中的t变量。

表格控件

txt和xls文件都可以作为表格进行读取。

正常情况下读取表格的函数为readtable(path)，可以把表格以表单的形式都取出来。

1
2
3
4
t=readtable("test.xls");
t.x(2);%读取x列第2个元素，y同理

t.Properities.xxxxxxx   %可以读取一些表格的属性

详细信息在命令行输入doc readtable

可以讲列表的变量名复制到table控件

1
app.UITable.ColumnName = t.Properities.VariableNames;

也可以对表格控件进行修改。

1
2
3
4
5
6
7
8
data1 = app.EditField.Value;
price = app.EditField2.Value;

%然后将两个数据进行拼接
nr = {data1 price};

%开始增加,(方法为矩阵拼接)
app.UITable.Data = [app.t;nr];

也可以对表格控件进行删除。

1
app.UITable.Data(:,row_n)=[];  %将那个区域置为[]就是删除了

两个APP相互调用

在逻辑里调用

1
2
delete(app.UIFigure)  %这里来释放内存
run *.mlapp;  %这里写APP的路径

键盘回调函数

有按压回调和释放回调。

image-20260212114416799

用event.Key监听键盘输入，使用switch来进行按键判断。

回车为return

然后可以直接在左侧拖动插入回调函数。

image-20260212114941227

这里的windows回调也可以用，但是现在还没有学到，日后补充

image-20260212115128369

单击触发响应回调函数

单击画布的时候，会捕捉鼠标的点击。5m

image-20260212115623633

调用外部m函数

同一个文件夹下，直接调用函数名称就可以。

调用其他路径下的文件，需要使用addpath()算子来添加到工作路径，就可以直接调用文件了。

如果gui里面产生了一个数据，如果想提供给m函数使用，要使用assignin("base","变量名",变量名)将变量添加到工作区当中。

image-20260212200210882

drawnow ui更新函数

如果外部m函数是一个长时间的循环，需要在中间插入drawnow，使程序有时间处理ui的回调，实现交互。