はじめに
NetAdvantage Silverlight LOBは、Silverlight 4に対応した高性能コントロール・スイートです。高機能なデータグリッドコントロールであるxamWebGridを含めさまざまな業務向けコントロールが収録されていますが、その真価はコントロールだけではなく、その背後に構築されたフレームワーク機能にも便利なものが多数あります。今回は その中の一つVirtualCollectionフレームワークを使用して、Silverlightのデータグリッドソリューションでロードオンデマンド処理を実現する方法を解説します。
対象読者
Silverlightによるアプリケーション開発者。特にVisual Studio 2010, Expression Blendなどのツールを使ったプログラミング経験がある方。なお、本記事の中でご紹介するプログラムコードはすべてC#で記述しています。
必要環境
Silverlight 4アプリケーションが構築できる環境としてVisual Studio 2010およびSilverlight 4 Tools for Visual Studio 2010がインストールされていること。さらにNetAdvantage Silverlight LOB 2010 Vol.1が含まれる、NetAdvantage for WebClient 2010 Vol.1またはNetAdvantage for .NET 2010 Vol.1の正式版またはトライアル版をインストールする必要があります。
NetAdvantageのインストール
はじめてNetAdvantage Silverlight LOBを使用する場合には、事前にソフトウェアをインストールする必要があります。まだお持ちでない場合は、インフラジスティックス ジャパン社のWebサイトよりインストーラーを入手してください。製品購入前の評価用として用意しているトライアル版で、各コントロールの使い方を学ぶことができます。
なお、NetAdvantage Silverlight LOB 2010 Vol.1はもともとSilverlight 3でビルドされていますが、製品購入後に取得可能なサービスリリースを適用することでSilverlight 4版のアセンブリーにアップデートされます。
NetAdvantage Silverlight LOB について
NetAdvantage Silverlight LOB（Line Of Business）は、Silverlightをプラットフォームとした本格的な業務アプリケーション構築を行うためのコントロールスイート製品です。本記事で紹介するxamWebGrid以外にも、ツリービュー（xamWebTree）、Outlookライクなナビゲーション（xamWebOutlookBar）、マスキングや数値入力のエディターなどさまざまなコントロールが含まれています。詳細についてはサイトまたはオンラインサンプルでご確認ください。
ロードオンデマンドの必要性
まずは本稿で解説する「ロードオンデマンド」機能について解説します。
一般にWebアプリケーションで大量行のデータを表示する際、「ページング機能」を併用することが多いと思いますが、これはまさにHTMLベースのWebアプリケーションにおいて欠かすことのできないロードオンデマンドの代表的な適用例と言えます。ページングを適用して1ページあたりの表示行数に制限を加えることで、初回（または2回目以降）の読み込みデータ量を制限することができ、結果として1回あたりの画面ロード時間の短縮を実現します。そして、ユーザーが選択したページのデータを「必要に応じて（＝Load On Demand）」読み込んで表示を差し替えることで、情報量の制限による利便性の低下を最小限に抑えています。
WebアプリケーションではHTMLとして描画情報を転送するコストの高さからロードオンデマンドが欠かせない要素となっていますが、対してSilverlightアプリケーションではクライアント側のリソースを描画に使えるため、必要なデータのみを転送することができ、Webアプリケーションに比べるとその重要性は若干薄れる感はあります。例えば一度に1000行程度のデータをロードしてデータグリッド上に情報を表示しても、初回のロード時間さえ我慢できれば快適な操作が可能です。しかしながら、例えばWeb検索サイトのように数万～数十万のデータをロードする必要がある場合には初回ロードのデータ転送だけで相当な時間がかかってしまうでしょうし、初回表示までの応答速度こそが最優先の場合などはやはりロードオンデマンドの実現が重要になります。
VirtualCollection によるロードオンデマンド
VirtualCollectionは、一般的なロードオンデマンドのシナリオを簡単に実現するために用意されたフレームワークで、NetAdvantage Silverlight LOBに含まれています。
標準のDataGridやxamWebGrid などのデータグリッドコントロールに大量のデータを読み込むときに、このVirtualCollectionをバインドすることによってデータソースを間接的にコントロールし、部分的なデータロードやデータのキャッシングを行えるようにします。
通常、データグリッドコントロールに情報を表示するときは、ItemsSourceプロパティに何らかのコレクションやリストのオブジェクトをバインドしますが、ロードオンデマンドが必要なシナリオではVirtualCollectionオブジェクトをItemsSourceプロパティにバインドします。
データグリッドに最初にデータを表示するときや、スクロール処理やページングによって追加のデータ表示が必要になったとき、VirtualCollectionのItemDataRequestedイベントが発生するので、このタイミングで必要なデータをデータソースに対して要求し、取得したデータをVirtualCollectionに追加することができます。取得したデータはVirtualCollectionの内部でキャッシュされるため、重複する不要なデータについてのリクエストを抑制することができます。また、VirtualCollectionの初期化時に想定される最大件数を設定できるため、トータル行数に対して適切な縦スクロールバーの幅やページングにおけるページ数をユーザーに提供することができます。
VirtualCollection を使って
DataGridのページング処理をロードオンデマンド化する
それでは実例を挙げて使い方を見ていきましょう。標準のDataGridを使い、ページング機能と組み合わせたロードオンデマンドの実装を例にとります。
最初に、Silverlightプロジェクトに必要な参照設定を追加します。VirtualCollection機能を使う場合、Infragistics.SilverlightとInfragistics.Silverlight.VirtualCollectionの2つのアセンブリーが必要となります。
次に、テスト用の画面を構成します。次のようにSilverlight標準のDataGridとDataPagerを配置したXAMLを作成します。
続いて必要なコードビハインドを処理の流れに沿って説明します。まずはクラス定義とコンストラクタ、ロード処理といった初期処理の部分を見てみましょう。ここではVirtualCollection<TestData>のインスタンスをフィールドとして保持し、UserControl.Loadedのタイミングでサービスの初期化を行っています。
ここで使用するサービスクラスの手続きについても確認しておきます。通常、データ取得用のサービスはWCFサービスなどWebサーバ側に配置することがほとんどですが、今回のサンプルでは以下のpublicメンバーを持ったTestServiceというサービスのモックアップクラスをクライアント側でホストしています（ただし実際のサービス アクセスの方式と同様に、非同期モデルのメンバー構成としています）。
クライアント側のInitializeServiceメソッドでは、TestDataServiceの初期化処理とイベント設定をしています。ここで初回のサービス問い合わせとしてGetTotalRowCountAsyncを呼び出し、取得対象となるデータの総件数を取得します。
以下のInitVirtualCollectionメソッドでは、取得したデータ件数をもとにVirtualCollectionを初期化し、1回のデータロードのサイズやページングサイズを指定しています。さらに、DataGrid と DataPagerのItemsSourceにVirtualCollectionをセットします。VirtualCollectionが取り扱う最大データ数についてはコンストラクタで指定する以外にも、VirtualCollection.AnticipatedCount プロパティで指定することも可能です。
DataGridのItemsSourceにVirtualCollectionを設定したことで、以後DataGrid上にデータを表示する必要が生じたとき、自動的にItemDataRequestedイベントが起動されます。最初は「1ページ」分のデータが要求され、その後はページを切り替える度に対象ページのデータ取得が要求されます。
サービスからのデータ取得完了イベントをハンドルする以下の処理の中で、VirtualCollection.LoadItemsメソッドを呼び出してデータの追加を行います。ここではじめてVirtualCollection内の指定インデックス位置にデータが設定され、画面に表示が行われます。
以上でページングを行うDataGridに対するロードオンデマンド実装が一通り終わりました。以下のイメージはその動作スクリーンショットですが、DataPagerでページングを行ったタイミングで追加のデータリクエストが発生している様子が確認できると思います。また既に取得済みのページを再度選択した場合には、VirtualCollectionの中のキャッシュデータを参照するために、追加のリクエストが発生しません。
VirtualCollectionを使って
DataGridのスクロール処理をロードオンデマンド化する
VirtualCollectionを使うとスクロール処理に連動したロードオンデマンドも簡単に実現できます。ページングは「いちいちページをクリックする」労力が発生することもあり、ユーザー視点では比較的負荷が高いUI操作ですが、それに比べるとスクロール操作はマウスのホールド＆ドラッグだけなので、より自然なデータブラウジング方法として好まれる場面は多いです。
以下の実行例スクリーンショットを見ると、スクロール操作に連れて必要なデータリクエストが行われている様子が確認できます。例えば数万件といったデータをスクロール・ブラウジングする必要があるような要件がある場合、このようなロードオンデマンドの実装が必須となるでしょう。
スクロール処理にロードオンデマンドを適用する際の実装については、ページングを使用する場合とほとんど変わりません（VirtualCollection.PageSizeプロパティの指定が不要、というくらいです）。詳しくはサンプルコードをダウンロードして動作と合わせて確認してください。また、VirtualCollectionのその他の機能については以下のオンラインヘルプ トピックも併せて確認してください。
- NetAdvantage Silverlight LOB 2010.1 オンラインヘルプ
- VirtualCollectionについて（概要）
- VirtualCollectionで開始（チュートリアル）
- VirtualCollectionの使用（詳細機能）
まとめ
今回の記事ではVirtualCollectionを使ったロードオンデマンドの実装に焦点を当て、標準のDataGridコントロールと組み合わせを例にとって解説しました。もちろんNetAdvantageに含まれる、高機能なデータグリッドコントロールxamWebGridと組み合わせて使うと効果が倍増します（xamWebGridについては『Silverlight用の高機能データグリッドコントロール「xamWebGrid」活用術』もご覧ください）。xamWebGridが持っている「遅延スクロール機能」と組み合わせることや、編集操作やグルーピング、フィルタといった拡張機能にも対応することができます。
NetAdvantage Silverlightには今回取り上げたVirtualCollectionをはじめ、ドラッグ＆ドロップ フレームワーク、コントロールの状態保持を実現するパーシステンス フレームワークなど、一般的なUI要件の実装をスムーズに行うためのフレームワークも多く収録されています。これらのフレームワーク群はリッチなコントロールが必要ないケースでも単体で活用できるものなので、ぜひチェックしてみてください。
