在 App 中创建交互式表

2024-06-28 23:28| 来源: 网络整理| 查看: 265

App 概述

当 App 启动时，它会将患者数据的电子表格加载到一个表数组中。然后显示并绘制该表数组中的部分数据。当 App 用户在运行时编辑表 UI 组件中的值或对其中的列排序时，其中一个图会更新。该 App 提供原始数据的绘图以供比较。

使用表创建 App

在一个表 UI 组件中显示患者数据，并启用其交互式功能：

在设计视图中向 App 画布添加一个表，并在组件浏览器中配置该表。重命名这四个表列，并指定当用户与表 UI 组件交互时这些列是否可以编辑和排序。有关在 App 设计工具中使用表和配置表行为的详细信息，请参阅Add Tables to App Designer Apps。

在 startupFcn 回调函数中以编程方式填充表 UI 组件。通过在组件浏览器中右键点击 App 节点并选择回调 > 添加 StartupFcn 回调，以创建 startupFcn 回调。首先，从电子表格中加载患者数据，然后使用 Data 属性以编程方式将此表格数据分配给表 UI 组件。有关在表 UI 组件中显示表数据的详细信息，请参阅在 App 中格式化表格数据。

function startupFcn(app) % Read table array from file t = readtable("patients.xls"); % Configure table appearance % ... % Add data to the table UI component app.UITable.Data = t; end

在添加和配置表 UI 组件后，对 App 进行编程，以便 App 用户修改表数据时更新绘图。在名为 updatePlot 的辅助函数中，添加代码以获取当前表数据并绘制修改后的数据。然后创建一个名为 UITableDisplayDataChanged 的回调函数，以便在 App 用户使用 updatePlot 辅助函数更改表数据时更新绘图。有关回调的详细信息，请参阅 App 设计工具中的回调。

function UITableDisplayDataChanged(app,event) % Update the plots when user sorts the columns of the table updatePlot(app); end

要查看和浏览完全编码的 App，请在 App 设计工具中启动此示例。运行该 App 并编辑一些表字段，查看 Updated Data 绘图中的变化。

【本文地址】

公司简介

联系我们