データを定義する

それでは、社員の情報を管理するサンプルアプリケーションを作成してみましょう。まずテーブルを追加してデータ項目を設定します。

次に、列名とデータ型を設定していきます。文字列型や数値型以外に、電話番号、郵便番号、通貨、メールアドレスといった型も設定できます。さらに、入力値も制御できます。例えば、「性別」という数値列に「1:男性」「2:女性」といった区分を設定することが可能です。

テーブルの設計

選択リストによる入力値の制御

スクリーンを定義する

続けて、社員を登録する画面(スクリーン)を定義します。スクリーンを追加する時は操作対象とするデータを選択します。ここでは、先程作成した「社員」を選択します。

スクリーンを追加

スクリーンには次の5種類のテンプレートが用意されています。データの操作内容に応じてスクリーンを選択します。

スクリーンの種類

スクリーンの種類 説明
New Data Screen データを1件登録
Detail Screen データを1件表示
Search Data Screen 複数データをリスト表示
Editable Grid Screen 複数データをリスト表示。編集可能
List and Details Screen 複数データをリスト表示。1件の詳細データも表示

ここでは、社員登録(New Data Screen)と社員一覧(Editable Grid Screen)を追加します。追加したスクリーンをダブルクリックすると、設定画面が表示されます。

スクリーンの設定画面

社員登録スクリーンの場合、以下の要素が存在することがわかります。

  • 「Save」「Refresh」ボタン(コマンドバー)
  • 「社員番号」等のテキストボックス
  • 「性別」のコンボボックス
  • 「メールアドレス」の入力ボックス
  • 「写真」の編集ボックス

LightSwitchの特徴として、「画面のデザイン」を設定するのではなく「画面の要素(ツリー構造)」を設定します。LightSwitchにはシェルやテーマを使ってUIを切り替える機能が備わっているので、画面のデザインと要素は分けて管理します。