開発者の Web アプリケーション用の Ignite UI ロゴ

    高速 Blazor データ グリッド

    Blazor データ テーブルは、より一般的に Blazor データ グリッドとして知られており、バインドされたデータを一連の行と列として視覚化できるようにするコンポーネントです。これらのデータ グリッドは、WPF や Windowsフォームなどのデスクトップ関連のプラットフォームでかなり長い間利用されてきましたが、Web アプリケーションの開発に利用できるようになったのはごく最近のことです。最新の Web アプリケーションは、データ バインド、セルと行の選択、セルおよび行の編集とエラーの検証、列集計、インタラクティブな Outlook スタイルのグループ化、Microsoft Excel スタイルのフィルタリング、数百万のレコードのロードを可能にする行と列の仮想化などの豊富な機能を備えたテーブルとデータ グリッドを使用します。

    Blazor Grid 例

    この Blazor グリッドの例では、検索およびフィルタリング、列のソート、サイズ変更、ピン固定と非表示、行のグループ化、グリッド集計、水平および垂直方向のスクロール、セルに組み込まれたリニア プログレス バー インジケーター コンポーネントとスパークライン コンポーネントを含むセル スタイリングなどのグリッドの機能を使用して、ユーザーがデータのビューをカスタマイズする方法を確認できます。

    このサンプルが気に入りましたか? 完全な Blazor ツールキットにアクセスして、すばやく独自のアプリの作成を開始します。無料でダウンロードできます。

    Blazor Data Grid の利点

    Blazor データ グリッドは、大量のデータをすばやく保存してソートされる必要がある場合に重要です。これには、大量の高速データ頻繁を使用する財務サービス、銀行および保険などの業界が含まれます。これらの企業の成功は、データ グリッドの機能とパフォーマンスに依存します。たとえば、在庫をマイクロ秒単位で決定する場合、データグ リッドが遅延時間やちらつきのない状態で実行する必要があります。

    Blazor Data Grid 機能

    Ignite UI for Blazor のデータ グリッドは、大量のリアルタイム データのみにとどまるものではありません。これは機能豊富な Blazor グリッドであり、ごくわずかなコードだけでは実現できない機能を提供します。 この例は、データ グリッドの主な機能のいくつかを示しています:

    高速 Blazor データ グリッド例

    Demo

    データの仮想化とパフォーマンス

    データの仮想化とパフォーマンス

    Ignite UI for Blazor データ グリッド コンポーネントには、グリッドの行とセルの仮想化が組み込まれています。つまり、メモリに保持される行とセルは、データ ソースがローカルであるかリモートであるかに関係なく、現在表示されているものだけです。これにより、何百万ものレコードをグリッドにプロットする場合でも、垂直および水平スクロールでExcel のようにシームレスで視覚的な遅延や画面のちらつきのない、最高のパフォーマンスが得られます。


    すばやく簡単に Blazor テーブルをカスタマイズ、構築および実装

    Ignite UI for Blazor データ グリッドは、データの無制限の行と列を処理できると同時に、カスタム テンプレートとリアルタイムのデータ更新へのアクセスを提供します。簡単なテーマ設定とブランディングのための直感的な API を備えており、最小限のコードでデータにすばやくバインドできます。


    Blazor Grid セルおよび行選択

    Blazor Data Grid のセル選択機能のアニメーション
    Blazor Grid セルおよび行選択

    Ignite UI for Blazor データ グリッド コンポーネントには、ユーザーによるマウスとタッチスクリーン操作の両方を使用して行とセルを選択するオプションが含まれています。セルと行の選択で使用できるモードには、MultipleCell、MultipleRow、SingleCell、SingleRow、および RangeCell があります。

    Blazor Grid フィルタリング

    Blazor Data Grid のフィルタリング機能のアイコン
    Blazor Grid フィルタリング

    Ignite UI for Blazor データ グリッドを使用すると、ユーザーは、フィルターが適用されるデータ型に基づいて列をフィルタリングできます。たとえば、列がデータ 項目の文字列型プロパティである場合、Contains、Starts With、EndsWith などのフィルタリング オプションを使用できます。

    Blazor Grid 列移動

    Blazor Data Grid の列移動機能のアニメーション
    Blazor Grid 列移動

    Blazor データ グリッドには、列をクリックおよびドラッグして列を並べ替えて再配置する機能が組み込まれています。列のドラッグによる移動をアニメーション化する機能を使用して、アプリケーションのユーザー エクスペリエンスをより細かく制御できます。

    Blazor Grid 列ピン固定

    Blazor Data Grid の列ピン固定機能のアイコン
    Blazor Grid 列ピン固定

    Blazor データ グリッド コンポーネントには左側または右側に列を固定する機能があります。列が固定またはピン固定されると、ユーザーがグリッドを水平方向にスクロールしている間、列はその位置を維持します。

    Blazor Grid 列サイズ変更

    Blazor Data Grid コンポーネントの列のサイズ変更機能が有効になっているデータ グリッド
    Blazor Grid 列サイズ変更

    Blazor データグリッドを使用すると、ユーザーはグリッドにある列のサイズを変更できます。データ テーブルは、サイズ変更操作がすぐに実行されるように、またはドラッグが解放されるまで延期されるように、ユーザーがサイズ変更モードを構成できる機能を備えています。

    Blazor Grid 列ソート

    Blazor のソート可能なグリッドの例
    Blazor Grid 列ソート

    プロジェクト用の Blazor ソート可能グリッドをお探しですか? Ignite UI for Blazor データ グリッド コンポーネントには、列データをソートする機能が組み込まれており、単一、複数、またはトリステートのソートの構成を利用できます。デフォルトでは、グリッド内の特定の列をソートするには、列ヘッダーをクリックしますが、列オプション ダイアログを使用してソートすることもできます。

    Blazor Grid 列集計

    Blazor Data Grid の列集計機能のアイコン
    Blazor Grid 列集計

    ユーザーは、Blazor データ グリッド コンポーネントで列集計を適用することができます。これらの集計には、数値データの Sum、Minimum、Maximum などを表示する機能があり、グリッドのフッターまたはグループ ヘッダーに表示するように構成できます。

    Blazor Grid 列タイプ

    Blazor Data Grid の列タイプ機能のアイコン表現
    Blazor Grid 列タイプ

    Ignite UI for Blazor データ グリッドを使用すると、ユーザーはさまざまなデータ型固有の列タイプを利用して、データを最も効果的に表示できます。データがもう少し複雑な場合は、追加のテンプレート列があり、グリッドのデータ ソースの特定の部分を表示するための独自のセル コンテンツを定義できます。

    Blazor グリッドの列アニメーション

    Blazor Data Grid の列アニメーション機能のアニメーション
    Blazor Grid 列アニメーション

    Blazor データ グリッドは、列の非表示や列の移動などのイベント時に列アニメーションをサポートします。Blazor データグリッドで列アニメーションが設定されている場合、対応するアニメーションはその列のすべてのセルに対して発生します。

    Blazor Grid 列オプション ダイアログ

    Blazor Data Grid の列オプション ダイアログ機能のアイコン
    Blazor Grid 列オプション ダイアログ

    Blazor データ グリッドの各列は、同じ場所 (列オプション ダイアログ) からソート、グループ化、非表示、移動、および固定できます。グリッドの各列ヘッダーには、マウスをホバーすると Kebab メニューが表示され、クリックするとこのダイアログが表示されます。

    Blazor 列と行の Outlook スタイルのグループ化

    Blazor Data Grid の Outlook スタイルのグループ化機能のアニメーション
    Blazor Grid 列と行の Outlook スタイルのグループ化

    Blazor データ グリッド コンポーネントには、Microsoft Outlook でグループが視覚化される方法に影響を受けた列をグループ化する機能が含まれています。グリッド内の複数の列をグループ化して、複数のグループ ヘッダーで表示するか、すべてを 1 つにまとめることもできます。

    Blazor Grid 行ピン固定

    Blazor Data Grid の行ピン固定機能のアニメーション
    Blazor Grid 行ピン固定

    Ignite UI for Blazor Data Grid コンポーネントには、行をピン固定 をグリッドの最上部に組み込み、ヘッダーの下に表示する組み込みの機能があります。これらの行は、ユーザーがグリッドを垂直方向にスクロールするときに、固定解除されるまで垂直にあります。

    Blazor Grid キーボード ナビゲーション

    Blazor Data Grid のキーボード ナビゲーション機能のアニメーション
    Blazor Grid キーボード ナビゲーション

    Blazor Data Grid コンポーネントを使用すると、Microsoft Excel と同じように動作するキーボード ナビゲーションを有効にできます。ユーザーのキーボードの矢印、Tab および Enter キーを使用すると、ナビゲーションを考慮してアクセシビリティと使いやすさが向上します。

    Blazor Grid 機能


    高速 Blazor Grid のダウンロード

    ダウンロード
    30 日間無償お試し版。クレジット カードは不要です。

    Ignite UI for Blazor サポートされるブラウザー

    Blazor Data Grid は、すべての最新の Web ブラウザーでサポートされます。
    • Chrome
    • Edge / Edge Chromium
    • Firefox
    • Safari
    • ポリフィルを使用した Internet Explorer 11

    Ignite UI for Blazor サポート オプション

    Infragistics の Blazor 製品の受賞歴のあるサポートにアクセスするための複数のオプションがあります。

    Ignite UI for Blazor 試用ライセンスおよび商用

    Ignite UI for Blazor は、サブスクリプション モデルで利用可能な商用ライセンス製品です。Ignite UI for Blazor 製品は、30 日間トライアル版を無料でお試しいただけます。試用期間が終了したら、弊社 Web サイトからライセンスを購入するかお住まいの地域の営業担当者にお問い合わせください


    FAQ

    Infragistics Ignite UI for Blazor Data Grid を選択する理由とはなんですか?
    Infragistics Ignite UI for Blazor Data Grid の価格について教えてください。
    Ignite UI for Blazor は、サブスクリプション モデルで利用可能な商用ライセンス製品である Ignite UI に含まれています。
    価格の詳細については、価格ページを参照してください。
    複数のプラットフォームでアプリケーションを開発する場合、WPF や Windows Forms などのデスクトップ プラットフォーム、Angular、Web コンポーネント、ASP.NET MVC、ASP.NET Core のすべての最新 Web ツールセットを含む完全なアプリ開発パッケージ Infragistics Ultimate を検討してください。
    Infragistics Ignite UI for Blazor Data Grid コントロールを個別に購入できますか?
    Blazor Data Grid を個別に購入することはできません。これは Ignite UI 製品バンドルの一部です。Ignite UI 製品バンドルは、Angular、ASP.NET MVC、Web コンポーネント、ASP.NET Blazor などのすべての Web プラットフォームに対して、何百ものコントロール、コンポーネント、およびデータの視覚化を提供します。
    Infragistics Ignite UI for Blazor Data Grid コントロールを個別に購入できますか?
    Blazor Data Grid の使用を開始するには、作業の開始ガイドの手順を実行してください。サンプル アプリケーションのライブラリも用意しています。サンプル ライブラリは、Blazor 開発のベスト プラクティス ガイドです。