DataGrid ウィジェット

DataGrid ウィジェットは、ランタイム時に InTouch のウィンドウ内に表形式データを表示します。ウィジェットに表示されるデータは、ユーザーがフィルタリングできます。

このウィジェットは InTouch HMI と AVEVA OMI の両方で同じプロパティを使用しますが、InTouch ランタイム時におけるデータのロードと行選択の動作が異なります。

このウィジェットには、ウィジェットの外観や表示される表形式データの見た目をカスタマイズするための一連の視覚的プロパティも含まれます。

サポートされるデータ形式

DataGrid ウィジェットは、JSON および CSV データ形式をサポートしています。データは、DataSource プロパティを介して文字列としてウィジェットに渡されるか、ランタイム時に動的に渡されます。

JSON の例

[、

  {

    "Equipment Name": "Feed Pump P-101",

    "Equipment ID": "P-101",

    "Equipment Type": "Centrifugal Pump",

    "Area": "Tank Farm",

    "Status": "Running",

    "Last Maintenance Date": "2025-11-14",

    "Location City": "Houston",

    "State": "TX",

    "Zip": "77002"

  },

  {

    "Equipment Name": "Boiler B-201",

    "Equipment ID": "B-201",

    "Equipment Type": "Steam Boiler",

    "Area": "Utilities",

    "Status": "Online",

    "Last Maintenance Date": "2025-09-30",

    "Location City": "Baton Rouge",

    "State": "LA",

    "Zip": "70801"

  }

]、

CSV の例

Equipment Name,Equipment ID,Equipment Type,Area,Status,Last Maintenance Date,Location City,State,Zip Feed Pump P-101,P-101,Centrifugal Pump,Tank Farm,Running,2025-11-14,Houston,TX,77002 Boiler B-201,B-201,Steam Boiler,Utilities,Online,2025-09-30,Baton Rouge,LA,70801

ランタイム時のデータのフィルタリング

グリッドに表示される各列のデータはフィルタリングできます。フィルターが適用されると、DataGrid ウィジェットは、その列の項目がフィルター条件に一致する行のデータのみを表示します。

次の例は、［週］列にフィルターを適用して木曜日のみを表示するようにフィルタリングする前後の表形式データを示しています。

各列ヘッダー内のフィルター アイコン を選択すると、フィルター条件を指定するためのドロップダウン ペインが表示されます。

[プロパティ]

以下の表は、DataGrid ウィジェットのプロパティを一覧表示しています。すべてのプロパティは動的ランタイム プロパティとして公開されており、以下のいずれかとして ViewApp 名前空間の参照とバインドできます。

• 属性

• オブジェクト属性

• MyContent 属性

• 複合式

  DataGrid ウィジェットのプロパティ	説明
  Type	ソース データ文字列の形式を取得または設定します。 csv json
  AllowExport	ファイルへのデータのエクスポートを許可します。既定値は True です。
  Datasource	DataGrid ウィジェットに表示される JSON または CSV データの文字列を取得または設定します。
  ColumnDelimiter	選択したグリッド行のフィールド値を区切るために使用される区切り文字を取得または設定します。 csv 文字列の場合はカンマ json 文字列の場合は縦棒（|）
  SelectedRow	選択した行フィールド値の文字列を取得または設定します。
  DateFieldFormat	日付形式を取得または設定します。すべての日付形式文字列をサポートしています。
  背景色	ウィジェットの背景色を設定します。
  ExportFileName	AllowExport = True の場合、エクスポートするファイルの名前を指定します。
  FilterMode	グリッドのフィルター モードを取得または設定します（default または checklist）。
  前景色	ウィジェットのテキストの色を取得または設定します。
  HeaderBackColor	列名が表示される表形式ヘッダーの背景色を設定します。
  HeaderForeColor	ヘッダー列名のテキスト色を設定します。
  SelectionBackColor	グリッド内で選択された行の背景色を設定します。
  SelectionForeColor	グリッド内で選択された行のテキスト色を設定します。
  RowHoverBackColor	マウスホバー時のグリッド内の行の背景色を設定します。
  RowHoverForeColor	マウスホバー時のグリッド内の行のテキスト色を設定します。
  Font Family	ウィジェットがテキスト表示に使用するフォント ファミリー名を設定します。
  ﾌｫﾝﾄ ｻｲｽﾞ	DataGrid ウィジェットに表示されるテキストのフォント サイズ（ピクセル単位）を取得または設定します。
  PageSize	一度に表示するレコード数を取得または設定します。

  注意：
  データがランタイム時に動的にロードされる場合、DataGrid ウィジェットで行を選択すると、グリッドがデザイン時のデータにリセットされることがあります。
  DateFieldFormat プロパティは必須ですが、システムはランタイム時にその検証を行いません。