Main Content

アプリでの対話型のテーブルの作成

テーブルは、表形式データを格納および表示するのに役立ちます。この例では、テーブル UI コンポーネントを使用してアプリでデータを表示する方法を示します。アプリ ユーザーがデータを並べ替えたり編集したりしてテーブルを操作できるように、テーブルを構成することもできます。

アプリの概要

アプリが起動すると、患者データのスプレッドシートが table 配列に読み込まれます。次に、table 配列のデータのサブセットを表示およびプロットします。アプリ ユーザーが実行時にテーブル UI コンポーネントで値の編集または列の並べ替えをすると、プロットの 1 つが更新されます。アプリは、比較のために元のデータのプロットを示します。

テーブルを使用したアプリの作成

テーブル UI コンポーネントに患者データを表示し、その対話型の機能を有効にします。

  1. [設計ビュー] でアプリ キャンバスにテーブルを追加し、[コンポーネント ブラウザー] でテーブルを構成します。テーブルの 4 つの列の名前を変更し、ユーザーがテーブル UI コンポーネントを操作するときに列を編集可能および並べ替え可能にするかどうかを指定します。App Designer でのテーブルの使用とテーブルの動作の構成の詳細については、App Designer アプリへのテーブルの追加を参照してください。

  2. startupFcn コールバック関数内でプログラムによってテーブル UI コンポーネントを取り込みます。[コンポーネント ブラウザー] でアプリ ノードを右クリックし、[コールバック]、[StartupFcn コールバックの追加] を選択して、startupFcn コールバックを作成します。まず、スプレッドシートから患者データを読み込み、Data プロパティを使用してこの表形式のデータをテーブル UI コンポーネントにプログラムによって割り当てます。テーブル UI コンポーネントでのテーブル データの表示の詳細については、アプリ内での表形式データの書式設定を参照してください。

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 コンポーネントを追加して構成した後、アプリ ユーザーがテーブルのデータを変更したときにプロットを更新するようにアプリをプログラムします。updatePlot という名前の補助関数に、現在のテーブルのデータを取得し、変更されたデータをプロットするコードを追加します。次に、補助関数 updatePlot を使用して、アプリ ユーザーがテーブルのデータを変更したときにプロットを更新する UITableDisplayDataChanged という名前のコールバック関数を作成します。コールバックの詳細については、App Designer のコールバックを参照してください。

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

完全にコード化されたアプリを表示および探索するには、App Designer でこの例を起動します。アプリを実行し、テーブルのフィールドの一部を編集して、[Updated Data] プロットの変化を確認します。

参考

関数

プロパティ

関連するトピック