データソースから画面を生成する (20110805)

皆さんこんにちは。
前回まではデータについてアレコレやってきましたが、まだアプリケーションの完成形が見えていませんよね?
今回は、画面を生成してアプリケーションを完成させてしまいます。

画面を生成する

ソリューション エクスプローラーの画面を右クリックして画面を追加をクリックします。
すると、次のような画面が表示されます。
01

この画面について少し紹介しましょう。

まず、右側の 「画面テンプレートの選択」 です。こちらの一覧から画面のレイアウトを選択します。標準のテンプレートとしては土の5つが用意されています。

  • 詳細画面
  • 編集可能グリッド画面
  • 一覧および詳細画面
  • 新規データ画面
  • データ検索画面

もちろん、これ以外のレイアウトもカスタムで作成可能ですが、ほとんどの場合はこの5つから選ぶことで対応できるかと思います。

そして右側の「画面情報の指定」です。ここは選択する画面テンプレートによって表示項目が若干変更されますが、画面名と画面データに関してしっかり設定すれば OK です。
まず画面名ですが、こちらはアプリケーション上でナビゲーションメニューとして表示される文字列になります。そのため、何の処理をする画面なのかがはっきり分かるような名前を付けるべきです。
また、画面データに関しては、その画面がどのデータを元にその画面を生成するのかを定義します。

画面テンプレートと画面名、画面データを設定したら、後は OK を押すだけでアプリケーションが完成します。もちろん、複数のデータや複数の画面を生成して、より機能の豊富なアプリケーションにしていくことも可能です。

生成されるアプリケーションの画面

それでは、アプリケーションを実行して生成した画面を見てみましょう。
02

まず、タスクという部分に先ほど紹介した画面名で各画面が並びます。このメニューをクリックして生成した画面を表示します。
右上に表示されている 「保存」 と 「最新の情報に更新」 はそれぞれ編集したデータのデータソースへの永続化と、データソースからの最新情報の取得に使われます。
そして 「デザイン画面」 とはデバッグ実行時だけ表示されるもので、画面のデザインをアプリケーション側で変更できるようになっています。

これらの部分をシェルと呼び、生成した画面とは別にアプリケーション全体を制御する部分になります。

今度は先ほど紹介したテンプレートごとにどのような画面が生成されるのかをちょっと見てみましょう。

詳細画面

詳細画面はナビゲーションメニューには表示されなません。一覧画面などから個別のデータを選択した結果を表示するために作成します。もし、この詳細画面を生成しない場合は標準で用意された詳細画面が表示されます。
03

編集可能グリッド画面

編集可能グリッド画面では Excel のようにグリッドのセルを選択することで直接編集を行うことが出来ます。また、この編集可能グリッド画面をはじめとする一覧系の画面では Excel にデータをエクスポートすることが出来ます。
04

一覧および詳細画面

一覧および詳細画面では編集可能グリッド画面とは異なり、一覧から選択したデータを右隣りのペインに詳細表示して、そこで編集出来るようになっています。編集可能グリッド画面と比べて、一覧がキーとなるデータのみで良い事、詳細画面で項目が縦に並んでいる事によりアプリケーションの表示幅を狭くすることが可能です。
05

新規データ画面

新規データ画面では、新しくデータを追加するための詳細画面が表示されます。
06

データ検索画面

データ検索画面では対象となるデータの中から検索項目をキーに絞り込みを行います。この一覧では先頭になるデータ項目がハイパーリンクとなり、対象のデータの詳細画面を表示するようになっています。
07

まとめ

このように、データ定義さえできてしまえば画面を生成するのは本当に簡単です。逆に言うと、LightSwitch アプリケーションを構築する際には、データ定義が非常に重要になってきます。
まずはきっちりとしたデータ定義をよく行ってアプリケーションを生成することで、使いやすいアプリケーションを生成することが可能になります。

製品情報はこちらから:https://www.microsoft.com/japan/visualstudio/lightswitch
技術情報はこちらから:https://msdn.microsoft.com/ja-jp/lightswitch