公号【新能源动力电池与BMS】。
“MATLAB App Designer面向对象编程方法及特点，应用案例介绍”
什么是MATLAB App Designer?
首先，App Designer是Mathworks 2016a版本中正式推出用于替换GUIDE的产品。这个产品的推出也是顺应Web的潮流，可以帮助用户利用新的图形系统，更加方便的设计出更美观的GUI。
调用App Designer方法有两种，一种在命令行输入：appdesigner即可；另外一种，在MATLAB主界面菜单栏中选择APP菜单——设计APP。
打开后进入导航页
GUI设计
新建空白App后，可以看到组件库有很多的控件，这些控件可以满足常用需求。而且简单易学。
- GUI布局
还是举一个实例来说明。我们参考《MATLAB面向对象编程》这本书里的一个实例。这个实例是一个存款、取款的操作界面。我们从组件库分别拖拽对应颜色的控件到画布中去。
画布设计也非常友好，选择多个控件，可以自动对齐。
- 控件名称修改
直接双击控件名称即可修改名称。但选择控件时，同时在右边组件浏览器中会同步选择到“组件属性”，这个属性名称是代码中作为属性定义的，可以在组件浏览器中修改为容易理解的属性名称，便于代码的逻辑理解。
App Designer代码特点
- 代码界面
点开代码视图，即可见源代码。右边组件浏览器中，控件对应属性在代码中可见定为公有属性，但这部分为灰色内容，不可编辑。不过可以根据上面的“控件内容修改”所说方法，修改属性名称。
- 属性的概念
有两种属性，一种为公有属性，另外一种为私有属性。
公有属性，可以简单类比为具有C代码中的全局变量的特点，可以用来传递和共享App内部和外部的数据，比如两个App之间的数据传递；
相反，私有属性只能在App内部传递或共享数据，类似具有C代码局部变量的特点。
如果要自定义添加属性，可以在左上栏（下图示）中点击属性添加，类似于我们要添加变量。
我们依次在组件浏览器中修改为便于理解的属性名称。
通过代码教你一步步实现GUI功能
通过上面的介绍，我们已经了解App Designer的GUI如何设计、代码的特点，并且已经设计好了GUI的控件布局。接下来，我们就要考虑如何一步步实现GUI的具体功能了。还是以前面存款、取款操作界面的GUI来做实例介绍。
- 新增属性
先添加一个私有属性Balance，便于后面的编程体现MVC分层思想，将模型与数据分开。
- GUI控件初值
当用户第一次打开你设计的App时，你希望显示控件栏会有些初值。比如，账户余额：3000元。
这个功能是通过startupFcn函数来实现。赋值的方法，采用了MVC模型分层思想。
- 回调函数callback的添加
“取款”、“存款”两个按键点击，显示界面的控件会有响应，该功能通过添加回调函数实现。
下图选择回调函数ButtonPushedFcn。看函数名称可知该函数是用于处理按键按下后需要处理的事项。
WithDrawButton回调函数内容如下：
DepositButton回调函数内容如下：
以上两个回调函数的代码体现了MVC分层思想，将View中的Balance的显示和Model中的实际的Balance值分开。这个设计思想在大型可靠的项目中，一定是必不可少的。
- 程序运行与测试
最后点击工具栏中的RUN按钮，运行程序。初值3000，存款100，点击存款，账户余额变为3100；取款200，点击取款按钮，账户余额变成2900。实现了基本设计功能。
App封装
设计好的App,有时候需要安装部署到没有MATLAB的电脑上运行。所以我们需要打包成EXE格式的安装包，具体的打包方法我在另一篇文章有详细说明，可以参考MATLAB App Designer如何打包EXE安装程序。
总结
本文初步介绍了MATLAB App Designer面向对象编程的特点，概括了GUI设计布局的方法、代码特点，并举例说明代码实现方法，大家完全可以按照我描述的步骤一步步实现这个小例子，便于对App Designer初步的了解。
最后，如果大家需要这个小例子的源代码，欢迎留言，免费送上链接。
