ViewModelファーストな開発（その２）

今回は前回のViewModelから自動生成した画面をViewMakerのレイアウト編集機能をつかってカスタマイズします。

1.レイアウト編集画面の表示

レイアウトを編集するための画面は画面上で右クリックして「Edit Layout」を選択します。

2.レイアウト要素の編集

そうすると編集画面が表示されるので、各レイアウトを選択してプロパティを編集していきます。ここではDataGridの大きさとDataGridColumnのタイトル（Caption）などを指定します。

3.元画面への反映

Refreshを行うと元の画面に反映できます。

4.レイアウト情報の保存

レイアウトを保存したい場合はFile-Layoutを選択してSaveを行います。型名を利用したファイル名のXMLが作成されます。

次回起動時に保存したXMLファイルを読み込んで画面が表示されます。

5.明細画面のカスタマイズ

同じように明細画面をレイアウトを編集できます。Gridレイアウトを利用すると複数列の明細も可能です。

項目のタイトル（Caption）や順番を入れ替えて調整します。

レイアウト結果はファイルに保存する以外に、XAMLとしても取得できます。このXAMLをユーザコントロールに張り付けて利用することも可能ですが、そのシナリオは今後にしたいと思います。

まとめ

今回はノンコードでViewModelで生成した画面をカスタマイズしました。ViewMakerには今回利用したStackPanel・Grid以外にCanvasのパネルも用意されており柔軟な設定が可能になっています。リアルな業務画面も十分作成できるものになっています。
次回はさらにリアルな業務画面を実現していきます。