【小知识】MATLAB的App Designer与GUIDE

本文翻译自Loren Shure(2018年7月25日)的博客文章《The State of App Building in MATLAB》,原文地址:https://blogs.mathworks.com/loren/2018/07/25/the-state-of-app-building-in-matlab/

在我的旅行中,我会见了许多客户,他们总是对学习MATLAB新的特性和功能非常感兴趣。一个尤其令很多人感兴趣的领域是MATLAB应用程序的构建。许多MATLAB用户对App Designer、GUIDE和这两个应用程序构建平台的未来发展感兴趣。因此,在这篇博客中,我想我会把这些问题中的一部分交给MATLAB图形和应用程序构建的开发经理ChrisPortal以及MATLAB产品经理David Garrison。

In my travels, I meet with many customersand they are always interested in learning about new MATLAB features andcapabilities. One area that has a lot of interest is MATLAB app building. ManyMATLAB users are interested in App Designer, GUIDE, and the future of the twoapp building platforms. So for this blog, I thought I would put some of thosequestions to Chris Portal, Development Manager for MATLAB Graphics & App Building, and DavidGarrison, MATLAB Product Manager.


What is the current state of app buildingin MATLAB?

Chris Portal:目前,MATLAB为用户构建应用程序提供了两个平台——GUIDE和App Designer。GUIDE是一个较老的平台,MATLAB用户已经使用了很多年。尽管用户已经能够使用GUIDE构建不同复杂程度的应用程序,但是它一直存在用户希望解决的工作流程和可用性问题。类似地,它所支持的组件集(主要是uicontrol集)也非常有限,并且基于一些遗留的技术。

CP: Currently MATLAB offers twoplatforms for building apps – GUIDE and App Designer. GUIDE is an olderplatform that MATLAB users have been using for many years. Although users havebeen able to build apps of varying levels of sophistication with GUIDE, it hassuffered from a number of workflow and usability issues we’ve been wanting toaddress for our users. Similarly, the component set it supports, which ispredominantly the uicontrol set, is also very limited and based onsome legacy technologies.

David Garrison:在R2016a中,我们引入了App Designer作为新的应用程序构建平台。App Designer集成了构建应用程序的两个任务——设置视觉组件和编程行为。它具有一个新的设计画布,更容易添加组件,并使用标签和面板进行有效组织。它包括一个内置的编辑器,用于管理只读部分中组件的生成代码,并为用户编写的回调代码提供可编辑的部分。它还支持一系列新的标准组件,如编辑字段、按钮和旋转器,以及用于创建仪表面板的仪表盘、旋钮、开关和灯。

DG: In R2016a we introduced App Designer as our new appbuilding platform. App Designer integrates the two tasks of building an app –laying out the visual components and programming the behavior. It has a newdesign canvas that makes it easier to add components and to organize them usingtabs and panels. It includes a built-in editor that manages generated code forcomponents in read-only sections and provides editable sections foruser-written callback code. It also supports a new family of standardcomponents such as edit fields, buttons, and spinners, as well as gauges,knobs, switches, and lamps for creating instrument panels.


Why did MathWorks develop a whole new appbuilding platform?

Chris Portal:GUIDE和App Designer之间的主要区别在于所使用的技术。GUIDE的基础是Java Swing,甲骨文已经不再对其投入开发。虽然这个平台可以获得一些短期的胜利,但是从长远来看,不会得到新的扩展,也不允许我们为用户提供基于网络的工作流。AppDesigner建立在现代的基于web的技术上,比如JavaScript、HTML和CSS,它给我们提供了一个平台,可以灵活地跟上用户的需求,并允许应用程序在web上运行。用户可以保持他们现有的基于Java的应用程序运行,并在合适的时候选择新的平台。

CP: A major difference between GUIDEand App Designer is the technology used. GUIDE is based on Java Swing which isno longer being actively developed by Oracle. Building on it would have allowedsome short-term wins, but it would not have scaled in the long-term or allowedus to offer web-based workflows for our users. App Designer is built on modern,web-based technologies such as JavaScript, HTML, and CSS, giving us a platformwith the flexibility to keep up with the demands of our users and allowing appsto run on the web. Users can keep their existing Java-based apps running andchoose to opt into the new platform when the time is right for them.


How does App Designer compare to GUIDE?

David Garrison:当我们在R2016a中引入App Designer时,它为应用程序布局提供了一个现代化的、用户友好的环境,解决了GUIDE的几个可用性问题。然而,在最初发布的几个版本中,AppDesigner尚不具备GUIDE的某些功能。常见组件缺失,MATLAB图形化支持有限,使用性能不适用于大型应用程序。随着每一次版本的更新,我们一直在缩小这些差距并解决性能上的优化问题。从R2018a开始,App Designer几乎支持所有的MATLAB 2D和3D可视化,包括平移、缩放和旋转交互;添加了菜单支持以及新的树和日期选择器组件;代码编辑器能够扩展以构建大型应用程序。

DG: When we introduced App Designer inR2016a, it offered a modern anduser-friendly environment for laying out your app, which addressed severalusability issues GUIDE has. However, for the first few releases, App Designerhad some functional gaps with respect to GUIDE. Common components were missing,MATLAB graphics support was limited, and performance didn’t scale for largeapps. With each release, we have been closing these gaps and addressingperformance. As of R2018a,App Designer supports nearly all MATLAB 2D and 3D visualizations with pan,zoom, and rotate interactivity; menu support has been added as well as new treeand date picker components; and the code editor is able to scale to build largeapps.

Chris Portal:另一个显著的区别是编程模型。App Designer为应用程序生成一个MATLAB类,使得编程回调和在应用程序的不同部分之间共享数据比GUIDE更不容易出错。这意味着您不再需要更新句柄结构,或者理解如何使用guidatavs. appdata vs. UserData的微妙之处。还引入了专门为每个组件设计的新的MATLAB接口,这些新的接口更易于编程并在GUIDE使用的uicontrol组件基础上进行了改进。

CP: Another notable difference is thecoding model. App Designer generates a MATLAB class for the app, making iteasier to program callbacks and share data between different parts of the appin a way that is less error prone than GUIDE. What this means is you no longerneed to update a handles structure, or understand the subtleties of when to useguidata vs. appdata vs. UserData. New MATLAB interfaces have also beenintroduced which are designed specifically for each component. These newinterfaces are easier to program to and improve on the older uicontrolcomponent used by GUIDE.


What does that mean for the future of GUIDEand the apps users have built with it?

David Garrison:我们知道,许多MATLAB用户在基于GUIDE的应用程序上投入了大量精力并拥有自己的知识产权。我们将继续支持GUIDE及其相关组件,目前没有放弃或删除该功能的计划。与其他MATLAB功能上的过渡不同,GUIDE和App Designer可以共存,这允许我们和我们的用户通过一系列版本的更新来完成过渡。我们目前的重点是增强App Designer,以确保它能够满足MATLAB应用程序构建器的需求,并帮助GUIDE用户充分利用这种新工具。

DG: We know that many MATLAB users havetime and intellectual property invested in GUIDE-based apps or in apps they’vecreated programmatically. We will continue to support GUIDE and its associatedcomponents and have no current plans to deprecate or remove any of thatfunctionality. Unlike other MATLAB transitions, GUIDE and App Designer canco-exist, which allows us and our users to work through the transition over a seriesof releases. Our focus right now is on enhancing App Designer to ensure it canserve the needs of MATLAB app builders and helping GUIDE users adopt it.

Chris Portal:为此,我们在R2018a中发布了用于MATLAB GUIDE到AppDesigner迁移的工具,它简化了将基于GUIDE的应用程序转换为AppDesigner的过程。该工具自动创建一个与GUIDE应用程序具有相同布局的App Designer应用程序,应用必要的组件配置,并复制GUIDE回调代码。这样,您可以更新回调代码,使其与新的App Designer代码格式兼容。为了帮助用户完成以上步骤,该工具会生成一个报告,报告描述了如何进行代码更新,并提供了一些有限的解决办法。您可以从MATLAB中心的文件交换或MATLAB桌面上的Add-On Explorer下载该工具。

CP: Towards that end, we have released theGUIDE to App Designer Migration Tool for MATLAB in R2018a which eases the process of converting aGUIDE-based app to App Designer. The tool automatically creates an App Designerapp with the same layout as your GUIDE app, applies the necessary componentconfigurations, and copies the GUIDE callback code over. From there, you updatethe callback code to make it compatible with the new App Designer code format.To help users with this step, the tool generates a report that describes how todo the code updates and provides workarounds for some limitations. You candownload the tool from the File Exchange on MATLAB Central or from the Add-OnExplorer in the MATLAB desktop.


What about users who create their appsprogrammatically?

David Garrison:我们知道有些用户选择不使用像GUIDE或App Designer这样的交互式环境——他们更喜欢在MATLAB中以编程的方式创建应用程序。您可以继续手动编写应用程序,而不管您使用哪个组件集,无论是旧的uicontrol功能,还是我们自R2016a以来一直在扩展的新组件集。

DG: We know some users choose not to use aninteractive environment like GUIDE or App Designer – they prefer to createtheir apps programmatically in MATLAB. You can continue to hand-code your appsregardless of which component set you use, whether it’s the older uicontrol function, or the newer componentset we’ve been expanding since R2016a.


What about apps that use Java extensions?

Chris Portal:一些用户已经使用Java Swing来扩展他们的应用程序的能力,包括使用javacomponent来添加自定义组件。他们需要这样做来集成我们不支持的组件,如选项卡、树和日期选择器,并定制超出文档的组件,包括更丰富的单元格级别的格式图表。另一些则使用未记录的JavaFrame属性来执行最大化或最小化图形窗口的操作。在一些情况下,用户直接利用Java Swing来构建IDE类应用程序,从而利用Java布局管理器的优点。App Designer为我们解决这些长期存在的差距提供了基础。App Designer一直在不断地补充缺失组件,并增强现有组件。我们有许多新的特性可以弥补Java Swing的空白,并使我们所有的MATLAB用户能够构建更复杂的应用程序。

CP: Some of these users have used JavaSwing to extend the capabilities of their apps including the use of thejavacomponent function to add custom components. They needed to do this tointegrate components we did not support like tabs, trees, and date pickers, andto customize components beyond what was documented, including richer cell levelformatting for tables. Other have used the undocumented JavaFrame property todo things like maximize or minimize the figure window. And in a few cases,users have leveraged Java Swing directly in order to take advantage of thingslike Java layout managers to build IDE-like apps. App Designer gives us afoundation to address these long-standing gaps for our users. App Designer hasbeen adding support for missing components and enhancing existing ones. We havea number of features lined up that will help bridge the Java Swing gap, andenable all of our MATLAB users to build more sophisticated apps.

David Garrison:我们一直在积极地调查用户,了解他们是如何使用Java来扩展他们的应用程序的。我们搜集的反馈报告将直接影响研发团队的工作。例如,在对JavaFrame使用情况的调查中,我们发现使用它的首要原因是以编程方式最大化或最小化图形窗口。我们在R2018a中添加了对此内容的文档支持。我们还添加了uitree以响应我们关于javacomponent使用的调查反馈。我们的计划是让每一次MATLAB的更新发布解决一些导致用户去使用Java的问题,因此我们鼓励用户填写这些调查。最后,我们认识到一些用户可能需要专门的组件,但对于大多数应用程序构建器来说,这些组件可能具有较低的优先级。为了解决这个问题,我们还在研究如何为MATLAB应用程序中集成第三方JavaScript组件提供文档化的解决方案。

DG: We have been actively surveying usersto understand how they are using Java to extend their apps. The feedback wehear directly impacts the team’s work. For example, in our survey on JavaFrameuse, we discovered the number one reason for its use was to programmaticallymaximize or minimize the figure window. We added documented support for this inR2018a. We also addeduitree in response to feedback from our survey on javacomponent use. Our plan is to have eachrelease of MATLAB address some gap that has led users to go to Java, so weencourage users to fill out these surveys. Finally, we recognize some users mayrequire specialized components that may be of lower priority for most appbuilders. In order to address this, we are also investigating ways to provide adocumented solution for integrating 3rd party JavaScript components in MATLABapps.


How do users take their apps to the Web?

David Garrison:有两种方法可以实现。一种是使用MATLAB在线模式。MATLAB在线模式可以让您在任何可以访问因特网的计算机桌面Web浏览器中运行MATLAB。MATLAB在线模式需要选择许可证,并进行资格验证。使用MATLAB的桌面版本创建一个应用程序并将其保存到MATLAB驱动器。要在Web浏览器中运行应用程序,请使用您的MathWorks帐户登录到MATLAB在线模式。您可以使用MATLAB驱动器轻松分享您的应用程序,并与其它在线用户分享。

DG: There are a couple of ways to do this.One is by using MATLAB Online. MATLAB Online lets you run MATLAB in a desktopweb browser from any computer that has access to the internet. MATLAB Online isavailable with select licenses. Check your eligibility here. You create an appusing the desktop version of MATLAB and save it to your MATLAB Drive. To run the app in a webbrowser, use your MathWorks account to log onto MATLAB Online atmatlab.mathworks.com . You can use MATLAB Drive to easily share your app with anybody elsewho has access to MATLAB Online.

Chris Portal:另一种方法是使用MATLAB编译器。在R2018a中,MATLAB编译器引入了一个新的功能,允许您将App Designer应用程序打包为Web应用程序。在桌面上创建应用程序,使用MATLAB编译器将其打包到Web上,并将编译后的应用程序复制到您已经建立的MATLAB Web应用服务器上。这样,任何访问服务器的人都可以在Web浏览器中访问相应的URL。即使不是MATLAB用户,任何人都可以在浏览器中运行应用程序。这种方法对于共享应用程序来说是理想的,可以让合作者通过Web浏览器轻松访问。

CP: The other way is to use MATLABCompiler. In R2018a,MATLAB Compiler introduced a new feature that allows you to package AppDesigner apps as a web app. You create your app on the desktop, package it forthe web using MATLAB Compiler, and copy the compiled app to a MATLAB web appserver you’ve set up, which is also provided with MATLAB Compiler. This resultsin a URL that can be accessed in a web browser by anyone who has access to theserver. The benefit is anyone can run the app in a browser, even if they aren’tMATLAB users. This approach is ideal for sharing apps on-premise, forco-workers to access via a web browser.


How do users decide which app buildingplatform is right for them?

David Garrison:我们建议用户采用App Designer开发所有新的应用程序,除非该应用程序需要在R2016a之前的MATLAB版本中运行。此外,用户可以将以前基于GUIDE的应用程序通过迁移的方式移植到App Designer平台。迁移将使您的应用程序更具现代感,并将您的应用程序部署到Web上成为可能。

DG: We recommend users start with AppDesigner for all new apps unless the app needs to run in a version of MATLABprior to R2016a.It is the platform we are continuously enhancing and expanding with eachrelease. We also think many users will benefit from migrating their GUIDE appsto App Designer using the migration tool that Chris mentioned. Migration willgive your app a more modern look and will make it possible to deploy your appto the Web.

Chris Portal:用户可能会考虑继续使用GUIDE,原因如下:

  1.  迁移工具对应用程序工作流程具有至关重要的限制,可能无法进行工作。
  2.  应用程序需要运行在旧版本的MATLAB上。
  3.  应用程序依赖于无文档记录的Java功能,而AppDesigner并不支持该功能。

CP: Users might consider continuing to useGUIDE for the following reasons: The migration tool highlights a limitationthat is critical to the app’s workflow and cannot be worked around. The appneeds to run in older releases of MATLAB that predate App Designer’s release inR2016a. The app relieson the use of undocumented Java functionality that is not supported in AppDesigner.