前回までは「Hello World!!」アプリケーションの開発を通して、複数のコントロール部品を使いながらXAMLとC#、WPFのアプリケーションの開発のかなり基本的な部分を学びました。

しかし以前軽く触れましたが、WPFではMVVMパターンと呼ばれるアプリケーションの設計・開発の手法が使われることが多いようです。

これまでは小規模なアプリケーションの開発だったこともあり、すべての処理を分けることなく作っても問題はありませんでした。

しかし、MVVMパターンも使いこなせてこそのWPFアプリケーション開発ですので、今回から作るアプリケーションではMVVMパターンを取り入れた設計を考えながら学習に取り組んでいきたいと思います。

MVVM（Model-ViewModel-View）とは、UIが存在するソフトウェアの構造を階層的に整理したモデルのひとつであり、全体を「Model」-「View」-「ViewModel」の3層に分割したものです。

「Model」ではデータの管理や保存、入出力、内部的な処理を担います。

「View」では利用者に対する画面表示や入力。操作の受付を担います。

「ViewModel」では両者の間を仲介して互いの状態変更を通知、反映させる役割を担います。


これは以前も触れた内容ですが、これを実際に作るアプリケーションにあてはめながら少し考えてみましょう。

今回は、簡単な四則演算の計算を行う電卓系のアプリケーションを開発してみようと思います。

イメージとしては、ユーザーに整数を入力してもらい、さらに行いたい演算のタイプを選択し、何らかのボタンのクリックをトリガーとして計算結果を画面上に表示させるようなモノを考えています。


実際に開発に入る前に、アプリケーションに必要になりそうな機能を考えて列挙していきましょう。

・ユーザーが整数を入力する為の入力エリア×2

・ユーザーが演算のタイプを選択する為のコントロール

・ユーザーが計算結果を表示させるためにクリックするボタン系コントロール

・計算結果を表示するテキスト表示エリア

・入力エリアに整数以外を入力されていないかを検知する処理

・入力エリアが空の状態ではないことを検知する処理

・演算のタイプが除算の場合にゼロ除算ではないかを検知する処理

・計算を行うことが不可能と判断した場合に警告のポップアップを表示させる処理

・演算のタイプに応じた計算を行って結果を返す処理

・計算の結果が異常な数値になっていないかを検証する機能

・入力エリアの桁数を制限する処理

・計算結果の桁数を制限する処理


いくつか思いついた順番に列挙してみました。

実際に開発していく中でもう少し増えたり減ったりする可能性はありますが、事前に必要なものを挙げておくことで、開発がやりやすくなると思います。

では、先ほど挙げた機能をVMMVパターンにあてはめて考えてみましょう。

今回はWPFアプリケーションを開発する為の基本的な設計開発の手法である「MVVMパターン」についてをまとめました。

MVVMパターンを利用した開発に関しては私も経験がなく、自分なりに調べながらですので、もしかしたらMVVMパターンの分類のあてはめに違和感があるかもしれませんが、今回はこれで進めさせてください。


次回以降ではこの分類を基にして、MVVMパターンを意識しながら、実際に新しくVisual Studioでプロジェクトを作成して電卓系のアプリケーションを開発する行程に入ってみます。