syncfusion-wpf-datagrid について
このスキルは、WPFアプリでSyncfusion WPF DataGridを使ったデータ画面を開発する方向けのリファレンスです。編集、フィルタリング、グループ化、選択、エクスポートなど、設定と操作方法を扱います。
主な機能
- 01データバインディングと列設定
- 02ソート、フィルタリング、グループ化
- 03インライン編集と検証
- 04行とセルの選択
- 05ExcelとPDFへのエクスポート
- 06仮想化と集計
活用シーン
- 01WPFで大規模な表データを表示
- 02データグリッドにフィルタリングとグループ化を追加
- 03検証機能付きの編集可能なグリッドを構築
- 04グリッドの内容をExcelやPDFに出力
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ syncfusion/ wpf-ui-components-skills --skill syncfusion-wpf-datagridインストール後、Claude Code で/syncfusion-wpf-datagridを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/advanced-features.mdautosize-columns.mdcolumns.mddata-manipulation.mddrag-and-drop.mdediting.mdexport.mdfilter-editor.mdfiltering.mdgetting-started.mdgrouping.mdmaster-detail-view.mdresizing.mdselection.mdsorting.mdstyling.mdsummaries.md詳細
Syncfusion WPF DataGrid
Syncfusion WPF DataGrid(SfDataGrid)は、Windows Presentation Foundation アプリケーションで表形式のデータを表示および操作するための、高性能で機能豊富なコンポーネントです。データバインディング、列の構成、並べ替え、フィルタリング、グループ化、編集、エクスポート機能を幅広く備えています。
このスキルを使用する場面
次のような場合は、Syncfusion WPF DataGrid を使用してください。
- 表形式のデータを表示する Windows Presentation Foundation アプリケーションで
- 大規模なデータセットを効率的に処理する 仮想化とパフォーマンス最適化を利用して
- データ操作を有効にする 並べ替え、フィルタリング、グループ化など
- データ編集を実装する 検証機能やカスタムエディターを使用して
- データをエクスポートする Excel または PDF 形式に
- 階層ビューを作成する マスター詳細の関連付けを使用して
- 集計値を計算する グループ、テーブル、キャプションに対して
- 外観をカスタマイズする 条件付きスタイル設定やテーマを使用して
- MVVM パターンをサポートする 包括的なデータバインディングを使用して
- 列を構成する さまざまな種類や自動サイズ調整方法を使用して
コンポーネントの概要
SfDataGrid コンポーネントには、次の機能があります。
- データバインディング:任意の IEnumerable ソース、DataTable、MVVM パターンをサポート
- 列の種類:15 種類以上の組み込み列(テキスト、数値、DateTime、ComboBox、CheckBox など)
- データ操作:カスタムロジックをサポートする高度な並べ替え、フィルタリング、グループ化
- 編集:検証、カスタムエディター、追加/削除操作に対応したインライン編集
- エクスポート:カスタマイズオプション付きの Excel および PDF へのエクスポート
- 集計:組み込みの集計機能を備えたテーブル、グループ、キャプションの集計
- マスター詳細:階層データを表示するためのネストされたグリッドビュー
- スタイル設定:条件付きスタイル設定、テーマ、外観の完全なカスタマイズ
- パフォーマンス:UI 仮想化、オンデマンド読み込み、最適化された描画
- 選択:プログラムによる制御が可能な複数の選択モード(行、セル、拡張)
- フィルターエディター:AND/OR ロジック、ネストされたグループ、Filter Editor Panel を備えた、フィルター式を視覚的に作成するビルダー
- サイズ変更:制約、非表示列/行のサポート、サイズ変更イベントに対応した、列と行のインタラクティブなサイズ変更
ドキュメントとナビゲーションガイド
はじめにとセットアップ
📄 参照: references/getting-started.md
参照する場面:
- WPF プロジェクトで初めて SfDataGrid をセットアップする
- NuGet パッケージをインストールし、アセンブリ参照を追加する
- データバインディングを使用して基本的なグリッドを構成する
- 名前空間のインポートと XAML のセットアップについて理解する
- ライセンス登録を実装する
内容:
- NuGet(Syncfusion.SfGrid.WPF)を使用したインストール
- アセンブリ参照と依存関係
- SfDataGrid の基本的な XAML マークアップ
- ItemsSource を使用したデータバインディング
- 列の自動生成
- ライセンスの構成
- 必須の名前空間のインポート
列と構成
列の種類と定義
📄 参照: references/columns.md
参照する場面:
- 自動生成の代わりに列を手動で定義する
- 特定の列の種類(GridTextColumn、GridNumericColumn など)を使用する
- 列のプロパティ(HeaderText、MappingName、Width)を構成する
- 列の操作(追加、削除、並べ替え)を管理する
- 列のサイズ変更とドラッグ&ドロップを有効にする
- 水平方向のスクロール用に列を固定する
- 列のプロパティを ViewModel にバインドする
内容:
- 使用場面を含む 15 種類以上の組み込み列
- XAML およびコードビハインドでの列の手動定義
- 列のプロパティと構成オプション
- テキスト入力の大文字・小文字の設定(CharacterCasing:Upper、Lower、Normal)
- 列を操作するメソッド
- AllowResizing と列幅の管理
- 並べ替えに使用する AllowDraggingColumns
- 列を固定する FrozenColumnsCount
- 動的な列構成のための ViewModel バインディング
列幅の自動調整
📄 参照: references/autosize-columns.md
参照するタイミング:
- 列幅を自動計算する機能を実装するとき
- ColumnSizer のモード(Auto、Star、SizeToCells)を使用するとき
- 特定の列でグリッドの残り幅を埋めるとき
- 実行時に列幅を更新するとき
- 自動調整のロジックをカスタマイズするとき
- スター列の比率を実装するとき
- フォントに基づく幅の計算を処理するとき
内容:
- ColumnSizer の列挙型とモード
- AutoFitColumns() メソッドの使用方法
- 個々の列に対する ColumnWidthMode
- AutoLastColumnFill と AutoWithLastColumnFill
- 自動調整の計算を動的に更新する方法
- カスタム GridColumnSizer の実装
- スター列のサイズ調整比率と重み
- フォントに基づく幅の計算方法
列と行のサイズ変更
📄 参照: references/resizing.md
参照するタイミング:
- 列または行のインタラクティブなサイズ変更を有効にするとき
- サイズ変更を特定の列に制限するとき
- 列幅の最小値と最大値の制約を設定するとき
- 非表示の列または行をユーザーがサイズ変更できるようにするとき
- サイズ変更操作をプログラムでキャンセルまたは検出するとき
内容:
- グリッドレベルの AllowResizingColumns と列レベルの GridColumn.AllowResizing
- インタラクティブな行の高さ調整のための AllowResizingRows
- サイズ変更中に適用される MinWidth と MaxWidth の制約
- AllowResizingHiddenColumns と AllowResizingHiddenRows(非表示項目のサイズ変更インジケーター)
- ResizingColumns イベントによる列のサイズ変更のキャンセル(e.Cancel)
- サイズ変更の完了の検出(ColumnResizingReason.Resized、e.Width)
- RowResizing イベントによる行のサイズ変更のキャンセル(e.Cancel)
- 行のサイズ変更の完了の検出(RowResizingReason.Resized、e.Height)
データ操作
並べ替え
📄 参照: references/sorting.md
参照するタイミング:
- DataGrid で並べ替えを有効にするとき
- 単一列または複数列の並べ替えを実装するとき
- プログラムによる並べ替えを追加するとき
- カスタムの並べ替えロジックを作成するとき
- 3 状態の並べ替えを処理するとき
- 初期の並べ替え方向を制御するとき
- 並べ替えイベントに応答するとき
内容:
- 並べ替え機能を有効にする AllowSorting プロパティ
- 最初のクリック時の並べ替え方向を設定する、グリッドレベルおよび列レベルの InitialSortDirection
- プログラムによる並べ替えのための SortColumnDescriptions コレクション
- 列レベルの AllowSorting
- 並べ替えロジックのためのカスタム IComparer の実装
- SortClickAction(SingleClick、DoubleClick)
- 3 状態の並べ替えの設定
- 並べ替えイベント(SortColumnsChanging、SortColumnsChanged)
- 並べ替えインジケーターの削除
フィルタリング
📄 参照: references/filtering.md
参照するタイミング:
- データのフィルタリング機能を実装するとき
- 述語を使ったプログラムによるフィルターを追加するとき
- フィルター行または高度なフィルター UI を設定するとき
- カスタムのフィルターロジックを作成するとき
- Excel 形式のフィルタリングを使用するとき
- フィルターイベントを処理するとき
内容:
- View.Filter 述語によるビューのフィルタリング
- FilterPredicates による列のフィルタリング
- フィルター行の実装(AllowFiltering)
- 高度なフィルター UI の設定
- Excel 形式のフィルターポップアップ
- カスタムのフィルターロジックと条件
- FilterChanged イベントと FilterChanging イベント
- RefreshFilter() メソッドの使用方法
- フィルター行のカスタマイズ
フィルターエディター
📄 参照: references/filter-editor.md
参照するタイミング:
- 複雑なフィルター式に高度なビジュアルフィルターエディターを有効にする場合
- グリッドの上または下にフィルターエディターパネルを表示する場合
- AND/OR 演算子とネストされたグループを使って複数条件のフィルター式を作成する場合
- フィルター条件を失わずにフィルタリングを一時停止および再開する場合
- フィルターエディターが他のフィルタリング機能と同期する仕組みを理解する場合
内容:
- フィルターエディターの有効化(EnableFilterEditor プロパティ)
- 列のポップアップおよびフィルターエディターパネルからフィルターエディターを開く方法
- フィルターエディターの適用/OK/キャンセル操作
- フィルターエディターパネルを表示する FilterPanelPosition プロパティ(Top/Bottom/None)
- パネル内のフィルター式の展開/折りたたみ
- パネルのチェックボックスを使ったフィルタリングの有効化/一時停止
- フィルターエディターパネルを閉じる方法(フィルターをクリアせずにパネルを非表示にします)
- チェックボックスフィルター UI、高度なフィルター UI、フィルター行、FilterPredicates とのフィルター同期
- 制限事項(SfDataGrid.Columns のみ対応、View.Filter デリゲートは表示されません)
グループ化
📄 参照: references/grouping.md
参照するタイミング:
- データのグループ化機能を有効にする場合
- 列によるプログラムでのグループ化を追加する場合
- グループの表示と動作をカスタマイズする場合
- カスタムのグループ化ロジックを実装する場合
- グループの展開/折りたたみ状態を管理する場合
- グループの集計情報を追加する場合
内容:
- AllowGrouping プロパティの設定
- プログラムでグループ化するための GroupColumnDescriptions
- 列ヘッダーをグループパネルにドラッグ&ドロップする方法
- カスタム IGroupComparer の実装
- グループの展開/折りたたみメソッド
- ShowGroupDropArea プロパティ
- グループ集計情報の統合
- グループ化イベント(GroupExpanding、GroupExpanded、GroupCollapsing、GroupCollapsed)
選択
📄 参照: references/selection.md
参照するタイミング:
- グリッドの選択モードを設定する場合
- 行またはセルの選択を実装する場合
- プログラムでの選択を追加する場合
- 選択イベントを処理する場合
- チェックボックス選択列を使用する場合
内容:
- SelectionMode(Single、Multiple、Extended、None)
- SelectionUnit(Row、Cell、Any)
- SelectedItem および SelectedItems プロパティ
- 単一選択用の SelectedIndex
- プログラムによる選択メソッド(SelectRow、SelectCell)
- 選択イベント(SelectionChanging、SelectionChanged)
- チェックボックス選択列
- NavigationMode とキーボードによる選択
編集と操作
グリッドの編集
📄 参照: references/editing.md
参照するタイミング:
- グリッドでのインライン編集を有効にする場合
- 編集モードとトリガーを設定する場合
- 列レベルの編集コントロールを実装する場合
- 編集したセルに検証を追加する場合
- 列用のカスタムエディターを作成する場合
- 行の追加/削除操作を管理する場合
- 編集イベントを処理する場合
内容:
- グリッドレベルの制御を行う AllowEditing プロパティ
- 列レベルの AllowEditing
- EditTrigger(OnTap、OnDoubleTap)
- BeginEdit() および EndEdit() メソッド
- IDataErrorInfo と INotifyDataErrorInfo による検証
- カスタムエディターテンプレート
- AddNewRow の設定
- プログラムによる行の削除
- 編集イベント(CurrentCellBeginEdit、CurrentCellEndEdit など)
データ操作
📄 参照: references/data-manipulation.md
参照するタイミング:
- グリッドに行をプログラムで追加する場合
- 行を削除またはデータをクリアする場合
- コードからセルの値を更新する場合
- CRUD 操作を実行する場合
- データ検証を実装する場合
- 変更後にグリッドデータを更新する場合
内容:
- 行を追加する View.AddNew()
- 削除に使用する View.Remove() および View.RemoveAt()
- セルの変更に合わせたデータソースの更新
- CRUD 操作のパターン
- データ検証の方法
- RefreshView() および Refresh() メソッド
- CommitEdit() および CancelEdit() 操作
- UpdateSourceTrigger の設定
ドラッグ&ドロップ
📄 参照: references/drag-and-drop.md
次の場合に参照してください:
- グリッド内で行のドラッグ&ドロップを有効にする
- 複数のグリッド間でドラッグ&ドロップを実装する
- 列のドラッグ&ドロップを設定する
- ドラッグ&ドロップの動作をカスタマイズする
- ドラッグ&ドロップのイベントを処理する
内容:
- AllowDraggingRows プロパティ
- 同じグリッド内での行のドラッグ&ドロップ
- 異なるグリッド間でのドラッグ&ドロップ
- 列の並べ替えに使用する AllowDraggingColumns
- ドラッグ&ドロップのイベント(RowDragStarting、RowDragOver、RowDropping、RowDropped)
- カスタムのドラッグ&ドロップロジック
- ドロップ位置インジケーター
エクスポートとシリアル化
Excel と PDF へのエクスポート
📄 参照: references/export.md
次の場合に参照してください:
- グリッドデータを Excel 形式にエクスポートする
- グリッドを PDF ドキュメントにエクスポートする
- エクスポートの外観と書式をカスタマイズする
- 選択した行のみをエクスポートする
- エクスポートイベントを処理する
- エクスポート機能に必要なアセンブリを追加する
内容:
- Excel エクスポート用の ExcelExportingOptions
- PDF エクスポート用の PdfExportingOptions
- ExportToExcel() メソッドと ExportToPdf() メソッド
- 必要な NuGet パッケージ(Syncfusion.SfGridConverter.WPF)
- エクスポートのスタイルと外観のカスタマイズ
- ExportMode(All、SelectedRows)
- エクスポートイベント(ExcelExportingOptions.CellExporting)
- エクスポート対象から列を除外する方法
- エクスポート時のカスタムセル書式設定
高度な機能
集計
📄 参照: references/summaries.md
次の場合に参照してください:
- グリッド全体にテーブル集計を追加する
- グループ内にグループ集計を実装する
- グループヘッダーにキャプション集計を作成する
- 組み込みの集計関数を使用する
- カスタム集計計算を作成する
- 集計の表示形式を設定する
内容:
- テーブル集計用の GridSummaryRow
- TableSummaryRows コレクション
- グループレベルの集計用の GroupSummaryRows
- グループキャプション用の CaptionSummaryRow
- 組み込み集計関数(Count、Sum、Average、Min、Max など)
- カスタム集計の実装
- 集計表示の書式文字列
- SummaryColumns の設定
- カスタムテンプレート用の ShowSummaryInRow
マスター詳細ビュー
📄 参照: references/master-detail-view.md
次の場合に参照してください:
- 階層型のグリッドビューを作成する
- マスター詳細の関連付けを実装する
- 入れ子になったグリッドを設定する
- 詳細を自動展開するように設定する
- 複数の詳細ビューに対応する
- 詳細ビューテンプレートをカスタマイズする
内容:
- DetailsViewDefinition の設定
- AutoGenerateRelations プロパティ
- DetailsViewTemplate 内の入れ子になった SfDataGrid
- 子コレクションを指定する RelationalColumn
- ExpandAllDetailsView() メソッド
- 複数レベルの詳細ビュー
- カスタム詳細ビューテンプレート
- 詳細ビューのイベント
高度な設定
📄 参照: references/advanced-features.md
次の場合に参照してください:
- ローカライズとグローバリゼーションを実装する
- グリッドの状態をシリアル化および逆シリアル化する
- グリッドの設定を保存および復元する
- 複数の言語とカルチャに対応する
- ユーザー設定を保持する
内容:
- ResourceManager と Resx ファイルを使用したローカライズ
- 言語サポートのための CurrentUICulture の設定
- カルチャ固有のリソースファイルの作成
- シリアル化オプション(SerializationOptions)
- Serialize() メソッドと Deserialize() メソッド
- グリッドの状態を XML ファイルまたはストリームに保存する方法
- ファイルからグリッド設定を復元する方法
- SerializationController を使用したカスタム列のシリアル化
- パフォーマンスに関するヒント(UI 仮想化、NotifyListChangedAction)
- AllowFrozenGroupHeaders オプション
スタイリングとカスタマイズ
📄 参照: references/styling.md
参照するタイミング:
- セルのスタイリングと条件付き書式の適用
- 行の外観のカスタマイズ
- 交互の行スタイルの実装
- データに基づく条件付きスタイリングの作成
- ヘッダー、集計行、グループ行のスタイリング
- SfSkinManager を使用したテーマの適用
内容:
- セルを一様にスタイリングする CellStyle
- 条件付きでセルの書式を設定する CellStyleSelector
- 行の外観を設定する RowStyle と RowStyleSelector
- ゼブラストライプを設定する AlternatingRowStyle
- 列ヘッダー用の HeaderStyle
- グループ行用の GroupCaptionStyle
- 集計行用の SummaryCellStyle
- テーマを適用する SfSkinManager
- スタイル内のトリガーとデータバインディング
- ビジュアル状態(Normal、Selected、Current)
クイックスタートの例
WPF で SfDataGrid を使い始めるための最小限の例を紹介します。
XAML
<Window x:Class="DataGridDemo.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:syncfusion="http://schemas.syncfusion.com/wpf">
<Grid>
<syncfusion:SfDataGrid x:Name="dataGrid"
AutoGenerateColumns="True"
AllowSorting="True"
AllowFiltering="True"
AllowGrouping="True"
AllowEditing="True"
ItemsSource="{Binding Orders}">
</syncfusion:SfDataGrid>
</Grid>
</Window>
ViewModel を使用したコードビハインド
using System.Collections.ObjectModel;
using System.ComponentModel;
using Syncfusion.UI.Xaml.Grid;
public class OrderInfo : INotifyPropertyChanged
{
private string orderId;
private string customerName;
private string country;
private decimal orderTotal;
public string OrderID
{
get => orderId;
set { orderId = value; OnPropertyChanged(nameof(OrderID)); }
}
public string CustomerName
{
get => customerName;
set { customerName = value; OnPropertyChanged(nameof(CustomerName)); }
}
public string Country
{
get => country;
set { country = value; OnPropertyChanged(nameof(Country)); }
}
public decimal OrderTotal
{
get => orderTotal;
set { orderTotal = value; OnPropertyChanged(nameof(OrderTotal)); }
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
public class ViewModel
{
public ObservableCollection<OrderInfo> Orders { get; set; }
public ViewModel()
{
Orders = new ObservableCollection<OrderInfo>
{
new OrderInfo { OrderID = "1001", CustomerName = "John Doe", Country = "USA", OrderTotal = 1500.50m },
new OrderInfo { OrderID = "1002", CustomerName = "Jane Smith", Country = "UK", OrderTotal = 2300.75m },
new OrderInfo { OrderID = "1003", CustomerName = "Bob Johnson", Country = "Canada", OrderTotal = 890.25m }
};
}
}
よくあるパターン
MVVM データバインディングパターン
// ViewModel property
public ObservableCollection<Employee> Employees { get; set; }
// XAML binding
<syncfusion:SfDataGrid ItemsSource="{Binding Employees}" />
列の手動定義
<syncfusion:SfDataGrid AutoGenerateColumns="False" ItemsSource="{Binding Orders}">
<syncfusion:SfDataGrid.Columns>
<syncfusion:GridTextColumn MappingName="OrderID" HeaderText="Order ID" Width="120"/>
<syncfusion:GridTextColumn MappingName="CustomerName" HeaderText="Customer" Width="150"/>
<syncfusion:GridNumericColumn MappingName="OrderTotal" HeaderText="Total"
NumberDecimalDigits="2" Width="120"/>
<syncfusion:GridDateTimeColumn MappingName="OrderDate" HeaderText="Date"
Pattern="ShortDate" Width="120"/>
</syncfusion:SfDataGrid.Columns>
</syncfusion:SfDataGrid>
プログラムによる並べ替え
// Add sort description
dataGrid.SortColumnDescriptions.Add(new SortColumnDescription
{
ColumnName = "OrderTotal",
SortDirection = ListSortDirection.Descending
});
プログラムによるフィルタリング
// Set filter predicate
dataGrid.View.Filter = (obj) =>
{
var order = obj as OrderInfo;
return order != null && order.OrderTotal > 1000;
};
dataGrid.View.RefreshFilter();
パネルを使用したフィルターエディターの有効化
<syncfusion:SfDataGrid x:Name="dataGrid"
AllowFiltering="True"
EnableFilterEditor="True"
FilterPanelPosition="Bottom"
ItemsSource="{Binding Orders}" />
列と行のサイズ変更
<syncfusion:SfDataGrid AllowResizingColumns="True"
AllowResizingRows="True"
AllowResizingHiddenColumns="True"
ItemsSource="{Binding Orders}" />
// Cancel resizing for a specific column
dataGrid.ResizingColumns += (sender, e) =>
{
if (e.ColumnIndex == 0) e.Cancel = true;
};
// Detect when resize is complete
dataGrid.ResizingColumns += (sender, e) =>
{
if (e.Reason == ColumnResizingReason.Resized)
Debug.WriteLine($"Column resized to {e.Width}px");
};
選択の処理
// Handle selection changed
dataGrid.SelectionChanged += (sender, e) =>
{
var selectedItem = dataGrid.SelectedItem as OrderInfo;
if (selectedItem != null)
{
MessageBox.Show($"Selected Order: {selectedItem.OrderID}");
}
};
Excel へのエクスポート
using Syncfusion.UI.Xaml.Grid.Converter;
var options = new ExcelExportingOptions
{
ExcelVersion = ExcelVersion.Excel2013
};
dataGrid.ExportToExcel(dataGrid.View, options);
主なプロパティ
コアプロパティ
- ItemsSource:グリッドのデータソース(IEnumerable)
- AutoGenerateColumns:データソースから列を自動作成します(bool)
- Columns:手動で定義した列のコレクション
データ操作プロパティ
- AllowSorting:列の並べ替えを有効にします(bool)
- AllowFiltering:フィルタリング機能を有効にします(bool)
- AllowGrouping:列によるグループ化を有効にします(bool)
- AllowEditing:インライン編集を有効にします(bool)
列の設定
- ColumnSizer:列の自動サイズ調整方法
- FrozenColumnsCount:左側から固定する列の数(int)
- AllowResizingColumns:列のサイズ変更を有効にします(bool)
- AllowResizingRows:行の高さの変更を有効にします(bool)
- AllowResizingHiddenColumns:非表示の列にサイズ変更インジケーターを表示します(bool)
- AllowResizingHiddenRows:非表示の行にサイズ変更インジケーターを表示します(bool)
- AllowDraggingColumns:列の並べ替えを有効にします(bool)
フィルターエディターのプロパティ
- EnableFilterEditor:複雑なフィルター式を作成するためのビジュアルフィルターエディターを有効にします(bool)
- FilterPanelPosition:フィルターエディターパネルの位置(Top / Bottom / None)
選択プロパティ
- SelectionMode:選択動作(Single、Multiple、Extended、None)
- SelectionUnit:選択単位(Row、Cell、Any)
- SelectedItem:現在選択されている項目(object)
- SelectedItems:選択されている項目のコレクション
表示プロパティ
- HeaderRowHeight:列ヘッダー行の高さ(double)
- RowHeight:データ行の既定の高さ(double)
- GridLinesVisibility:グリッド線の表示(Both、Horizontal、Vertical、None)
よくあるユースケース
業務アプリケーション
編集可能なグリッド、検証、CRUD 操作を備えたデータ入力フォームを作成し、注文、顧客、在庫などの業務レコードを管理します。
データ分析とレポート
並べ替え、フィルタリング、グループ化、集計に対応した大規模なデータセットを表示し、売上データ、財務レポート、統計情報を分析します。
マスター詳細ビュー
展開可能な詳細ビューを使って階層的なデータ関係を表示し、注文明細、顧客と注文、カテゴリと商品などの構造を扱います。
データのエクスポートと印刷
フィルタリングおよびグループ化されたデータを Excel または PDF にエクスポートして、レポートの共有、バックアップの作成、書式設定されたドキュメントの印刷に利用します。
ダッシュボードとモニタリング
自動更新、アラート用の条件付きスタイル、KPI のサマリー行を備えたリアルタイムデータ監視グリッドを構築します。
次のステップ: 実装のニーズに応じて、上記の該当するリファレンスドキュメントに進んでください。まず getting-started.md で初期設定を行い、その後、必要に応じて機能別ガイドを確認してください。