やりたいこと

なんのためにViewModelを書くのか、ViewModelがなんの役に立つのかが知りたい。

この記事の前半は、こっちに書いた。

以下は、続き。

※実験アプリを作るパート。

前提

今回作るアプリ

お試しアプリのリポジトリ

適当に思い付きで、下記のようなアプリを作ってみる。
(実際にそんな操作はできないが、見た目だけそれっぽく作る)

まずはWinUI3で。

お部屋を快適にするために、お部屋に関する設定を行う。
設定可能なのは、
- お部屋の明るさ設定
- お部屋の温度設定
- テレビのチャンネル（何見るかorテレビ消すか）
お部屋の明るさ設定は、「OFF」「薄暗い」「普通」「めっちゃあかるい」の4つを選択できるが、各々の設定時の実際のライトの明るさとしては、下記とする。
- OFF → 0（かつ電源OFF）
- 薄暗い → 30
- 普通 → 70
- めっちゃ明るい →100
お部屋の温度設定は、OFF(エアコン付けない),10,18,20,25,27度の設定ができるが、
- 18,20度の時は、冷房運転にして、その温度設定にする。
- 25,27度の時は、暖房運転にして、その温度設定にする。
- 10度設定にしようとすると、「マジで寒くなりますけどいいですか？」とMsgを出す
テレビのチャンネルは、OFF以外を選択後、30分経過すると、自動でOFFを選択し、テレビを消す
現在値の取得はしない。アプリ起動時、毎回
- お部屋の明るさを「OFF」にする
- お部屋の温度設定を「OFF」にする
- テレビのチャンネルを「OFF」にする
アプリ終了時も、
- お部屋の明るさを「OFF」にする
- お部屋の温度設定を「OFF」にする
- テレビのチャンネルを「OFF」にする

ライト
- 点灯と消灯ができる。
- 0～100で、1刻みに明るさの設定ができる。
エアコン
- 運転と停止ができる。
- 運転モードには冷房と暖房がある。
- 温度の設定を、10.0～30.0度まで設定できる。
テレビ
- テレビONとOFFができる。
- 1ch～99chまでのチャンネルを指定できる。
  - そのうち、19chがテレビ大阪、36chがサンテレビ、6chが朝日放送。

中身を、こんなイメージで作る。

Viewは、下記のような画面を提供する。

1つのウインドウの中に設定名とその設定の現在値をペアで表示する。
設定名と現在値のペアは、複数表示する。
設定名と現在値のペアがいくつあるかは不定。Modelが言う数だけ表示する。
現在値は、ComboBoxで表示する。
ユーザーがComboboxで設定値を操作するたびに、各値の設定を行う。
（OKボタンを押したときに全項目一括設定ではなく、操作したものを個別に設定したタイミングで設定実施する）

画面イメージ

Modelは、下記のような機能(API)を提供する。

ViewModelは、ViewとModelの仲介役をする。

アプリ起動時、Viewの初期化のタイミングで、
- Modelの「存在する設定名と、その設定がもつ設定値のリストを取得するAPI」を呼ぶ。
- 存在した設定について、Modelの「現在値を取得するAPI」を呼ぶ。
- 存在した設定名を、全設定分、表示する。
Comboboxで設定値を押下時、該当の設定について、Modelが持つ「設定(値の変更)を行うAPI」を呼ぶ。