MVVMによるSilverlightアプリケーションの開発（その1）

はじめに

　Silverlightに限らない話ですが、ページからのイベントに対する処理をすべてイベントハンドラに記述してしまったために、再利用性が著しく低かったり、単体テストがひどくやりにくいシステムを見たことはありませんか？ これは、プログラムの機能をすべて同じ層に記述していることが原因の1つです。

　この問題に対するSilverlightでの解決策の1つが、MVVMパターンです。今回はMVVMパターンと、MVVMパターンの要となるデータバインディング、コマンドバインディングについて2回にわたって解説します。

MVVMパターンとは

　MVVMはModel-View-ViewModelの頭文字をとった、アプリケーションの階層化パターンの1つです。階層化パターンを適用することで各層の依存関係が薄くなり、アプリケーションの修正、複数人数での分散開発、単体テストなどが実施しやすくなります。

　Expression Blend 4からは、デザインツール側でも標準でMVVMがサポートされていることから、デザイナーとの分業の面からもMVVMを取り入れたアプリケーションの階層化が重要になります。

フォームべた書きアーキテクチャの問題点

　SilverlightやASP.NETのWebFrom、WindowsFormのアプリケーション開発では、画面で発生したイベントはコードビハインドと呼ばれるコードファイルに、C#やVBで処理を記述します。特にサンプルアプリケーションなどでは、イベントハンドラにすべての処理を記述してあるものも少なくないでしょう。

　規模が小さなアプリケーションやサンプルであれば問題ないのですが、業務アプリケーションのように規模が大きかったり開発人数が多かったりする場合は次のような問題が発生します。

• ページ側のコントロールの値を直接利用しているため、テストがしづらい
• コードビハインドに処理が集中しているため、変更箇所の特定が難しい
• コードビハインドに業務ロジックとUIの操作ロジックが混在しているため、画面の修正が難しい

階層型のアーキテクチャとMVC

　利用者からの変更依頼のなかで最も変更の頻度が多いのは、利用者が一番目に触れることの多いUIのデザインに関するものです。開発の現場ではプログラムの変更範囲を特定したり変更しやすくしたりするために、レイヤー型のアーキテクチャを採用することが一般的になっています。

　特に有名な階層型のアーキテクチャにMVC（Model-View-Controler）パターンがあります。

　MVCパターンは、Model（業務処理）とユーザーインターフェース（View）をコントローラーによって分離する考え方です。

　一般的にレイヤー型のアーキテクチャでは、ユーザーインターフェースとビジネスロジックとが分離されているため、適切にレイヤー化されたアプリケーションは、そうでないものと比べ次のような利点があります。

• UIと業務処理が分離されているため、自動単体テストが容易（testable）
• 必要な機能がレイヤーごとに分かれているため変更箇所の特定が容易（maintainable）
• コードビハインドにロジックが少ないため、画面の修正や分業が容易（designable）

MVVMパターン

　MVVMパターンは前述のMVCの考え方を元に、XAMLに最適化した階層化パターンです。

　MVVMの基本方針はコードビハインドにはできるだけコードを記述しないことで、開発者には単体テストが実施しやすくメンテナンスしやすい環境を、デザイナーには画面をデザインしやすい環境を提供することです。MVVMパターンの概要を図1に示します。

図1　MVVMパターンの概要

　MVVMでは、モデルとビューをビューモデルによって分離します。MVCとの違いは、ビューモデルはビューとバインドされることでビューの状態を持ち、ビューに対する値の変更通知やビューで発生したコマンドの実行を行うことです。MVCをSilverlightに適用することもできますが、バインディングを効率的に利用しようと思ったらMVVMの形に自然に落ち着いた、というところでしょうか。

サンプルアプリケーションの概要

　今回のサンプルは、購入した書籍のタイトルを管理する画面です。

　サンプルではビューモデルに読み込まれた書籍情報のデータや保存、読み込みと行ったコマンドをビューにバインドし、ユーザーのアクションに応じてビューモデルからモデルの情報を操作します。サンプルアプリケーションの動作イメージを図2に示します。

図2　サンプルイメージ

　サンプルアプリケーションを参考に、MV-V-Mのそれぞれの役割について解説しましょう。

モデル　～ビジネス領域をモデル化したアプリケーションの要～

　モデルと言われてもピンとこないかもしれませんが、ここで言うモデルとは特定の業務分野（ドメイン）をモデル化したもの、つまりビジネスロジックやビジネスのデータをモデル化したドメインモデルを指します。

　本連載の第3回でWCF RIA Servicesを紹介しましたが、そのなかで出てくるドメインサービスと同じものと考えていただければいいでしょう。

　Silverlightでモデルと言うと、多くの場合はWCFサービスやWCF RIA Serviceを指すことが多いです。今回は書籍情報の検索や登録、修正といった操作を行うWCFサービスが、このサンプルアプリケーションのモデルになります。WCFの実装方法やEntity FrameworkについてはMVVMの概要とは離れてしまうので、ここでは割愛します。

　WCFサービスが公開する情報を図3に示します。

図3　WCFのクラス図