文章目录

一、 App Designer
- 1.打开App Designer
- 2.App Designer窗口
- - （1）设计视图
  - （2）代码视图
二、App组件
- 1.组件的种类及作用
- 2.组件的属性
- - Enable属性
  - Value 属性
  - Limits 属性
  - Position属性
三、类的定义
- 1.App类的基本结构
- 2.访问权限
四、App设计工具的设计实例
- 1.打开App Designer，添加组件
- 2.利用属性面板设置组件对象的属性
- 3.编写代码，实现组件功能
- - （1）编写自定义函数
  - （2）编写组件对象回调函数
- 4.运行App
- 5.打包App应用
思考与实验
我遇到的问题

转载于《MATLAB基础与应用教程（第2版）》蔡旭晖刘卫国蔡立燕 | 微信读书链接

App 设计工具是MATLAB R2016a推出的应用程序设计工具，和GUIDE一样，它也是一个可视化集成设计环境。除了提供和 GUIDE 类似的标准用户界面组件，还提供了和工业应用相关的组件，如仪表盘、旋钮、开关、指示灯等。使用App设计工具可以开发出操作界面友好、可以共享的MATLAB应用模块。

App 的用户界面的构成要素是组件（Component），它是指可重复使用并且可以和其他对象进行交互的对象，是封装了一个或多个实体程序模块的实体，可以复用。GUIDE设计的用户界面的构成要素是控件，控件是一种特殊的组件，仅用于可视化呈现数据。

一、 App Designer

1.打开App Designer

打开App Designer有两种方法：

在 MATLAB 桌面中，选择“主页”选项卡，单击工具栏的“新建”按钮，从弹出的命令列表中选择“App”下的命令项“App设计工具”，打开App Designer。
在MATLAB命令行窗口输入“appdesigner”命令，打开App Designer。

2.App Designer窗口

如图10.10所示，App Designer窗口由快速访问工具栏、功能区和App编辑器组成。

功能区提供了操作文件、打包程序、运行程序、调整用户界面布局、编辑调试程序的工具。功能区的工具栏与快速访问工具栏中的“运行”按钮都可运行当前App。
App Designer用于用户界面设计和代码编辑，用户界面的设计布局和功能的实现代码都存放在同一个.mlapp文件中。App编辑器包括设计视图和代码视图，选择不同的视图，编辑器窗口的内容也不同。

（1）设计视图

设计视图用于编辑用户界面。选择设计视图时，设计器窗口左边是组件库面板，右边是组件浏览器和属性面板，中间区域是用户界面设计区，称为画布。
组件库提供了构建应用程序用户界面的组件模板，如坐标轴、按钮、仪表盘等。组件浏览器用于查看界面的组织架构，属性面板用于查看和设置组件的外观特性。
设计视图功能区的第2个选项卡是“画布”。“画布”选项卡中的按钮用于修改用户界面的布局，包括对齐对象、排列对象、调整间距、改变视图显示模式等工具。

（2）代码视图

代码视图用于编辑、调试、分析代码。选择代码视图时，设计器窗口左边是代码浏览器和App的布局面板，右边是组件浏览器和属性检查器，中间区域是代码编辑区。
代码浏览器用于查看和增删图形窗口和控件对象的回调、自定义函数及应用程序的属性，回调定义对象怎样处理信息并响应某事件，属性用于存储回调和自定义函数间共享的数据。代码视图的属性检查器用于查看和设置组件的值、值域、是否可见、是否可用等控制属性。
代码视图功能区的第2个选项卡是“编辑器”。“编辑器”选项卡有7组按钮，“插入”组按钮用于在代码中插入回调、自定义函数和属性，“导航”组按钮用于在.mlapp文件中快速定位和查找内容，“编辑”组按钮用于增删注释、编辑代码格式。

二、App组件

组件对象是构成应用程序用户界面的基本元素，下面介绍这些组件。

1.组件的种类及作用

在MATLAB 2017b中，App Designer将组件按功能分成4类。

常用组件：与 GUIDE 中功能相同、外观相似的组件，包括坐标区、按钮、列表框、滑块等。GUIDE 中的“可编辑文本”控件在 App 组件库中分成了分别用于输入数值和文本的两种“编辑字段”组件。
容器类组件：用于将界面上的元素按功能进行分组，包括“面板”和“选项卡组”组件。
图窗工具：用于建立用户界面的菜单，包括“菜单栏”组件。
仪器类组件：用于模拟实际电子设备的操作平台和操作方法，如仪表、旋钮、开关等。
组件对象可以在设计视图中用组件库中的组件来生成，也可以在代码中调用App组件函数（如uiaxes函数、uibutton函数等）来创建。组件对象所属图形窗口是用uifigure函数来创建的，与在GUIDE中建立的传统图形窗口不同。

2.组件的属性

组件对象与控件对象相比，属性较少，常见属性如下。

Enable属性

用于控制组件对象是否可用，取值是’On’（默认值）或’Off '。

Value 属性

用于获取和设置组件对象的当前值。对于不同类型的组件对象，其意义和可取值是不同的。

● 对于数值编辑字段、滑块、微调器、仪表、旋钮对象，Value属性值是数；对于文本编辑字段、分段旋钮对象，Value属性值是是字符串。
● 对于下拉框、列表框对象，Value属性值是选中的列表项的值。
● 对于复选框、单选按钮、状态按钮对象，当对象处于选中状态时，Value属性值是true；当对象处于未选中状态时，Value属性值是false。
● 对于开关对象，当对象位于"On"档位时，Value 属性值是字符串’On’；当对象位于"Off"档位时，Value属性值是字符串’Off’。

Limits 属性

用于获取和设置滑块、微调器、仪表、旋钮等组件对象的值域。属性值是一个二元向量[Lmin,Lmax],Lmin用于指定组件对象的最小值，Lmax用于指定组件对象的最大值。

Position属性

用于定义组件对象在界面中的位置和大小，属性值是一个四元向量[x,y,w,h]。x和y分别为组件对象左下角相对于父对象的x、y坐标，w和h分别为组件对象的宽度和高度。

三、类的定义

用App Designer设计的应用程序，采用面向对象设计模式，声明对象、定义函数、设置属性和共享数据都封装在一个类中，一个.mlapp 文件就是一个类的定义。
数据变成了对象的属性（properties），函数变成了对象的方法（methods）。

1.App类的基本结构

App类的基本结构如下：

classdef　类名 <matlab.apps.AppBaseproperties(Access=public)……endmethods(Access=private)function 函数1（app,event）……endfunction 函数2（app）……endend
end

其中，classdef是类的关键字，类名的命名规则与变量的命名规则相同。后面的“<”引导的一串字符表示该类继承于MATLAB的Apps类的子类AppBase。properties段是属性的定义，主要包含属性声明代码。methods段是方法的定义，由若干函数组成。
App设计工具自动生成一些函数框架。控件对象的回调函数有两个参数，其他函数则大多只有一个参数app。参数app存储了界面中各个成员的数据，event存储事件数据。

2.访问权限

存取数据和调用函数称为访问对象成员。对成员的访问有两种权限限定，即私有的（Private）和公共的（Public）。私有成员只允许在本界面中访问，公共成员则可用于与 App 的其他类共享数据。
在.mlapp文件中，属性的声明、界面的启动函数startupFcn、建立界面组件的函数createComponents，以及其他回调函数，默认是私有的。

四、App设计工具的设计实例

下面通过实例，说明App设计工具的具体使用方法。
【例】生成一个用于观察视点仰角和坐标轴着色（投影）方式对三维图形显示效果影响的应用程序，界面如下图所示。界面右上部的列表用于选择绘图函数，中间的旋钮用于设置视点，右下部的分段旋钮用于设置坐标轴着色方式。

操作步骤如下。

1.打开App Designer，添加组件

在App Designer窗口左部组件库中选择“坐标区”组件[插图]，将其拖曳至设计区，调整好大小和位置。再添加一个列表框、一个切换按钮组、两个旋钮、一个跷板开关和一个分挡旋钮，然后按下图调整组件的位置和大小。
将控件对象重新命名。在组件浏览器中选中旋钮对象Knob，然后按F2键，将旋钮对象Knob更名为 Knob_az；或者右键单击旋钮对象，从快捷菜单中选择“重命名”命令项，进行修改。按同样方式，将旋钮对象Knob2更名为Knob_el，将分段旋钮对象Knob3更名为Knob_shading，将切换按钮组 ButtonGroup 中的按钮对象 Button 更名为 surfButton，将按钮对象 Button2更名为meshButton，将按钮对象Button3更名为contour3Button。
单击工具栏中的“保存”按钮，将设计的图形界面保存为．mlapp 文件。例如，将其存为appdemo0.mlapp。

2.利用属性面板设置组件对象的属性

在设计视图的设计区依次选择各个组件对象，在对应的属性面板中按下表设置组件对象的属性。

3.编写代码，实现组件功能

（1）编写自定义函数

编写用于绘制图形的updateplot函数和调整视点的updateview函数。
① updateplot函数
切换到App Designer的代码视图，选择功能区的“编辑器“选项卡，单击工具栏中的“添加函数”按钮，这时，在代码中增加了一个私有函数框架，结构如下：

function results=func1(app)
end

也可以在App Designer的代码浏览器选“函数”选项卡，单击“搜索”栏右端的“添加函数”按钮，添加一个私有函数框架。若需要添加公共函数，则单击“添加函数”按钮的展开箭头，从展开的列表中选择“公共函数”。
将上述函数的名称 func1更改为 updateplot。由于不需要返回值，删去函数头中的字符串“results =”。updateplot函数用于绘制图形，在updateplot函数体加入以下代码：

%根据在列表框中的选择，确定绘图数据
switch app.ListBox.Valuecase 'Sinc'[x,y]=meshgrid(-8:0.3:8);r=sqrt(x.^2+y.^2);z=sin(r)./(r+eps);case 'Peaks'[x,y,z]=peaks;case 'Sphere'[x,y,z]=sphere;
end
%根据在切换按钮组中按下的按钮，确定绘图方法
switch app.ButtonGroup.SelectedObjectcase app.surfButtonsurf(app.UIAxes,x,y,z)app.Knob_shading.Enable='On';case app.meshButtonmesh(app.UIAxes,x,y,z)app.Knob_shading.Enable='Off';case app.contour3Buttoncontour3(app.UIAxes,x,y,z)app.Knob_shading.Enable='Off';
end

② updateview函数
按同样方式建立用于更新坐标轴视点的updateview函数框架，然后在updateview函数体加入以下代码：

el=app.Knob_el.Value;
az=app.Knob_az.Value;
view(app.UIAxes,az,el)

（2）编写组件对象回调函数

① 为打开用户界面编写响应代码。在设计视图中，右键单击图形窗口空白处，从快捷菜单中选择“回调”下的“添加StartupFcn回调”命令项，这时，将切换到代码视图，并且在代码中增加了StartupFcn函数框架，结构如下：

% Code that executes after component creation
function startupFcn(app)
end

也可以在代码浏览器中，选择“回调”选项卡，单击搜索栏右端的“添加回调函数”按钮，在弹出的“添加回调函数”对话框中选择组件、回调，修改回调函数名（默认名称与回调相同），然后单击“确定”按钮来添加StartupFcn函数框架。要在运行中打开用户界面，使用默认数据和绘图函数绘制图形，则在StartupFcn函数体加入以下代码：

updateplot(app)

② 为列表框和切换按钮组编写响应代码。在设计视图中，右键单击列表框对象ListBox，从快捷菜单中选择“回调”下的“添加 ListBoxValueChanged 回调”命令项，这时，将切换到代码视图，并且在代码的methods段中增加了ListBoxValueChanged函数框架，如下所示：

methods (Access=private)%Value changed function: ListBoxfunction ListBoxValueChanged(app,event)end
end

当程序运行时，用户在列表框中选择一个绘图数据源，将调用 updateplot 函数绘制图形，因此在ListBoxValueChanged函数体输入以下代码：

updateplot(app)

单击切换按钮组的某个按钮也将重绘图形，因此按同样方式建立按钮组的回调函数ButtonGroupSelectionChanged，并在函数体中输入以上代码。
③ 为旋钮对象编写响应代码。建立用于设置视点方位角的旋钮对象的回调函数 Knob_azValueChanged和设置视点仰角的旋钮对象的回调函数Knob_elValueChanged，并在两个函数的函数体中输入以下代码：

updateview(app)

④ 为分段旋钮编写响应代码。分段旋钮用于设置着色方式，建立该对象的回调函数Knob_shadingValueChanged，并在函数体中输入以下代码：

shading(app.UIAxes,app.Knob_shading.Value)

⑤ 为跷板开关编写响应代码。跷板开关用于显示/隐藏网格，建立该对象的回调函数SwitchValueChanged，并在函数体中输入以下代码：

switch app.Switch.Valuecase 'On'grid(app.UIAxes,'On');case 'Off'grid(app.UIAxes,'Off');
end

4.运行App

单击App Designer功能区“设计器”选项卡工具栏的“运行”按钮（或单击快速访问工具栏中的“运行”按钮，或按F5键），即可运行程序，打开用户界面。
在运行窗口中将振幅比调到3，相位差调到90°，白噪声开关拨到“On”，单击“开始”按钮。

5.打包App应用

程序运行成功，可以将程序打包为一个MATLAB应用模块。单击App Designer的“设计器”选项卡工具栏中的“App打包”按钮，弹出“应用程序打包”对话框。
如图10.13所示，在对话框中部“描述您的App”下的应用名称栏输入“SuperpositionofWaves”，在对话框右边的”打包为安装文件“的输出文件夹”栏指定打包文件的输出文件夹。然后单击“打包”按钮。打包完成，对话框左部出现链接“打开输出文件夹“。单击此链接，可以看到在输出文件夹生成了两个文件，即SuperpositionofWaves.prj和SuperpositionofWaves.mlappinstall。
在MATLAB桌面的“当前文件夹”中找到文件Superposi tionofWaves.mlappinstall，双击这个文件，将弹出图10.14所示“安装”对话框。

在对话框中单击“安装”按钮进行安装。安装成功后，选择MATLAB桌面的“APP”选项卡，单击工具栏右端的“显示更多”按钮，可以看到应用列表中加入了这个应用模块。此后，在其他MATLAB程序中可以使用这个模块。

思考与实验

一、思考题
1.比较Units属性对度量长度的影响。分别建立两个窗口，第1个窗口用pixels作为度量单位，窗口大小为400×300。第2个窗口使用相对度量单位，窗口宽、高分别为屏幕的40%和30%。
2.在GUIDE，常用什么属性作为区分控件对象的标识？
3．分别用GUI函数和用GUIDE工具建立一个图形用户界面，界面中包含一个坐标轴和一个按钮。运行该用户界面，单击按钮，在坐标轴绘制函数f(x)=sin(1/x)f(x)=sin(1/x)f(x)=sin(1/x)曲线。比较两种方式的回调函数的定义方法。
4.分别用GUIDE和App设计工具建立一个应用程序。程序的用户界面中包含一个可编辑文本框（编辑字段）、一个标签和一个按钮。运行该程序，单击按钮，从文本框输入一个实数，在标签输出该数的正弦值。比较两种方式建立用户界面的方法，以及回调函数中获取/设置控件对象属性值的方法。
二、实验题
1.设计一个用户界面，其中有一个静态文本对象、一个可编辑文本框，两个复选框和一组单选按钮。在编辑框中输入一个数，单击按钮，可以设置静态文本框中的文字的大小；复选框用于设置文字是否为粗体、倾斜；单选按钮用于设置字体的颜色。
2.绘制一条阿基米德螺线，创建一个与之相联系的快捷菜单，用以控制曲线的颜色。
3.设计用户界面，分别从3个可编辑文本框输入参数 a、b 和 n 的值，绘制极坐标函数ρ=acos(b+nθ)ρ=acos(b+nθ)ρ=acos(b+nθ)曲线，考察参数对曲线的影响。
4.用App设计工具建立一个App,App运行界面包含一个坐标轴、一个旋钮、一个分段旋钮和一个按钮。旋钮的值域为[0,5]，分段旋钮的值域为[1,4]。运行该 App，在界面单击按钮，从旋钮获取m的值，从分段旋钮获取n的值，在坐标轴绘制下列曲线：

{x=msinty=ncost\begin{cases}x=msint \\ y=ncost \end{cases} {x=msinty=ncost
t∈[0,2π]t\in[0,2\pi]t∈[0,2π]

我遇到的问题

复制代码的时候有红线，提示字符数无效，只需要把红线删掉就行了。

还有一些字母书写错误，改正后成功运行：

MATLAB APP设计工具相关推荐

Matlab：使用 App 设计工具创建并运行简单 App
Matlab:使用 App 设计工具创建并运行简单 App 运行教程用于创建 App 的教程步骤步骤 1:创建坐标区组件步骤 2:创建滑块组件步骤 3:更新滑块标签步骤 4:导航到代码视图 ...
MATLAB APP 设计实践（一）UART通信（上篇）
引言 UART通信属于异步串行通信,通信速率比较低,在一些速度要求不高的场合常用来作为多设备之间的控制与被控制方式.例如以UART串口通信作为上位机侧与运行设备之间的通信形式,实现上位机对设备的操控以 ...
8.4 matlab用户界面设计工具
1.图形用户界面设计工具 (1)打开GUIDE 法1:在MATLAB命令行窗口输入guide命令. 法2:在MATLAB主窗口中选择"主页"选项卡,单击工具栏的"新建&q ...
matlab app设计步骤_如何从MATLAB/Simulink入手，系统地学习自动驾驶？
自动驾驶相关的软件工具有不少,作为汽车工程师,我们最熟悉的可能是MATLAB/Simulink.如何从MATLAB/Simulink入手,系统地学习自动驾驶? 本文来源:自动驾驶仿真自动驾驶相关的软 ...
[MATLAB]用户界面设计工具(Callback函数实现)
本实验源于中南大学的<科学计算与MATLAB语言>,博文主要讲述图形用户界面设计工具,以及定义回调函数. 图形用户界面设计模板在命令行输入: guide 里面用四个选项 Blank GU ...
用matlab做app,2020-02-27 MATLAB App Designer——在用 App 设计工具创建的 App 内共享数据...
1 访问和更新回调中的 UI 组件内的数据 app.Component.Property 2 获取并设置一个仪表的 Value 属性 x = app.PressureGauge.Value; % Ge ...
MATLAB APP设计
文章目录前言界面程序编写测试前言采用:MATLAB R2019a 功能:完成同一椭球下大地坐标与空间直角坐标互相转换,高斯正反算,单点和批量处理数据. 界面程序编写同一目录下,有实现坐 ...
matlab app设计步骤_1.1数学建模与MATLAB–MATLAB入门
1.1数学建模与MATLAB–MATLAB入门关注本专栏,继续分享数学建模与MATLAB知识一.MATLAB是什么? MATLAB 是目前在国际上被广泛接受和使用的科学与工程计算软件.虽然 Cle ...
Matlab学习——滑块曲线生成APP设计
Matlab学习--滑块曲线生成APP设计因为在以后的版本中将会删除GUIDE, 在删除GUIDE后,App可以继续运行, 但不能在GUIDE中对其进行编辑.所以本文使用App设计工具创建新App ...
Matlab中如何使用appdesigner设计工具建立一个简单的界面
Matlab中如何使用appdesigner设计工具建立一个简单的界面(数据的输入.处理和保存) 以使用不同算法处理图像的功能为例建立一个新的空白界面,matlab中输入appdesigner,打开 ...

MATLAB APP设计工具