チュートリアル: Vision Clinic アプリケーションの作成

[アーティクル]
03/12/2013

このチュートリアルでは、Visual Studio LightSwitch でのアプリケーション作成の全体的なプロセスを示します。LightSwitch の機能の多くを使用して、架空の Vision Clinic のアプリケーションを作成します。アプリケーションには、予定を管理し、請求書を作成するための機能が含まれています。

必須コンポーネント

PrescriptionContoso のデータベースをから MSDN Code Galleryダウンロードします。

手順

プロジェクトの作成

アプリケーションプロジェクトを作成します。
テーブルを定義する

患者、請求書、および請求書詳細エンティティを追加します。
選択リストを作成する

値の一覧を作成します。
リレーションシップの定義

リンク関連テーブルです。
別のエンティティを追加する

予定エンティティを追加します。
画面の作成

患者を表示する画面を作成します。
アプリケーションの実行

アプリケーションを実行して、データを入力します。
データベースに接続する

外部データベースに接続します。
エンティティを変更する

製品および製品リベートエンティティを変更します。
一覧および詳細画面を作成する

製品を表示する画面を作成します。
画面のレイアウトを変更する

[製品一覧] 画面のレイアウトを変更します。
実行時に変更する

実行中のアプリケーションで変更を行います。
クエリの作成

パラメーター化されたクエリを作成して、画面にバインドします。
計算済みフィールドを追加する

計算済みフィールドを作成して、画面に追加します。
データベース間の関係を作成する

異なるデータベース内のエンティティ間の仮想の関係を作成します。
請求書画面を作成する

請求書を表示する画面を作成します。
請求書画面を変更する

実行中のアプリケーションでの請求書画面のレイアウトを変更します。
画面のロジックを追加する

日付を計算するコードを記述します。
さらに計算済みフィールドを追加する

さらに計算済みフィールドを作成して、請求書画面に追加します。
アプリケーションを配置する

2 層のデスクトップアプリケーションとしてアプリケーションを発行します。

プロジェクトの作成

LightSwitch アプリケーションを作成する場合の最初の手順は、新しいプロジェクトを開くことです。

プロジェクトを作成するには

Windows の [スタート] メニューから、Visual Studio 2012 をクリックします。

LightSwitch デザイナーが表示されます。
[ファイル] メニューの [新しいプロジェクト] をクリックします。

[新しいプロジェクト] ダイアログボックスが表示されます。
[インストールされたテンプレート] リストで、LightSwitch ノードを選択します。
中央のペインで、[LightSwitchApplication (VB)] または [LightSwitch] を選択します。アプリケーション (C#).
[名前] フィールドに「Vision Clinic」と入力し、[OK] をクリックします。

[Vision Clinic デザイナー] ウィンドウが表示され、プロジェクトに必要なフォルダーが [ソリューションエクスプローラー] ウィンドウに追加されます。

テーブルを定義する

LightSwitch では、テーブルはエンティティと呼ばれ、データが表すオブジェクト (この場合、患者) をモデル化します。LightSwitch アプリケーションは、「フォームオーバーデータ」モデル、つまり、1 つまたは複数のソースからのデータを表示するフォームまたは画面を使用します。LightSwitch には、アプリケーションのデータを格納するために使用できる組み込みのデータベースが含まれています。次の手順では、患者の情報を格納するデータベーステーブルを作成します。

Patient エンティティを作成するには

[Vision Clinic デザイナー] ウィンドウで [新しいテーブルの作成] をクリックします。

データデザイナーが表示され、Solution Explorer の [データソース] の下に [Table1Items] ノードが表示されます。
[プロパティ] ウィンドウで、[名前] プロパティを選択して「Patient」と入力してから、Enter キーを押します。

データデザイナーのタイトルバーの名前が「患者」に変わり、ソリューションエクスプローラー内の名前が「患者」に変わります。
[名前] 列で [<プロパティの追加>] をクリックして、「FirstName」と入力してから、Enter キーを押します。

適切なデータ型、String が [型] 列に表示され、[必要] フィールドチェックボックスがオンになっています。患者には、名前が必要です。
[名前] 列で [<プロパティの追加>] をクリックして、「LastName」と入力します。
[名前] 列で [<プロパティの追加>] をクリックして、「Street」と入力します。
[名前] 列で [<プロパティの追加>] をクリックして、「Street2」と入力します。
[必要] 列でチェックボックスをオフにします。

番地の 2 行目は省略可能です。
[名前] 列で [<プロパティの追加>] をクリックして、「City」と入力します。
[名前] 列で [<プロパティの追加>] をクリックして、「State」と入力します。
[名前] 列で [<プロパティの追加>] をクリックして、「Zip」と入力します。
[名前] 列で [<プロパティの追加>] をクリックして、「PrimaryPhone」と入力します。
[種類] 列で、ドロップダウンリストの [PhoneNumber] を選択します。

PhoneNumber は、電話番号の入力および書式設定の一般的なパターンを表すカスタムビジネスタイプです。
[必要] 列でチェックボックスをオフにします。
[名前] 列で [<プロパティの追加>] をクリックして、「SecondaryPhone」と入力します。
[種類] 列で、ドロップダウンリストの [PhoneNumber] を選択します。
[必要] 列でチェックボックスをオフにします。
[名前] 列で [<フィールドの追加>] をクリックして、「Email」と入力します。
[種類] 列で、ドロップダウンリストの [EmailAddress] を選択します。

EmailAddress は、正しくフォーマットされた電子メールアドレスを表す、もう 1 つのカスタムビジネスタイプです。
[必要] 列でチェックボックスをオフにします。
[名前] 列で [<プロパティの追加>] をクリックして、「PolicyNumber」と入力します。
[プロパティ] ウィンドウで、[最大長] プロパティを選択して「12」と入力します。

これにより、ユーザーは、12 文字以上のポリシー数を入力できなくなります。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

次に、請求書と請求書の明細行を表す 2 つのエンティティをさらに作成します。

Invoice および InvoiceDetail エンティティを作成するには

ソリューションエクスプローラーで Data Sources をクリックします。[プロジェクト] メニューの [テーブルの追加] をクリックします。

データデザイナーの新しいインスタンスが表示されます。
[プロパティ] ウィンドウで、[名前] プロパティを選択します。「Invoice」と入力して、Enter キーを押します。
[名前] 列で [<プロパティの追加>] をクリックします。「InvoiceDate」と入力して、Enter キーを押します。
[種類] 列で、ドロップダウンリストの [DateTime] を選択します。
[名前] 列で [<プロパティの追加>] をクリックします。「InvoiceDue」と入力して、Enter キーを押します。
[種類] 列で、ドロップダウンリストの [DateTime] を選択します。
[必要] 列でチェックボックスをオフにします。
[名前] 列で [<プロパティの追加>] をクリックします。「InvoiceStatus」と入力して、Enter キーを押します。
[種類] 列で、ドロップダウンリストの [Integer] を選択します。
[名前] 列で [<プロパティの追加>] をクリックします。「ShipDate」と入力して、Enter キーを押します。
[種類] 列で、ドロップダウンリストの [DateTime] を選択します。
ソリューションエクスプローラーで Data Sources をクリックします。[プロジェクト] メニューの [テーブルの追加] をクリックします。
[プロパティ] ウィンドウで、[名前] プロパティを選択して「InvoiceDetail」と入力してから、Enter キーを押します。
[名前] 列で [<プロパティの追加>] をクリックして、「Quantity」と入力してから、Enter キーを押します。
[種類] 列で、ドロップダウンリストの [Integer] を選択します。
[名前] 列で [<プロパティの追加>] をクリックして、「UnitPrice」と入力します。
[種類] 列で、ドロップダウンリストの [Money] を選択します。

Money は、通貨を示して正しくフォーマットする、もう 1 つのカスタムビジネスタイプです。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

選択リストを作成する

次の手順では、Invoice エンティティの選択リストを作成します。選択リストを使用すると、選択する値の固定セットをユーザーに表示できます。

選択リストを作成するには

ソリューションエクスプローラーで、[請求書] をダブルクリックします。
データデザイナーで [InvoiceStatus] フィールドを選択します。
[プロパティ] ウィンドウで、[選択リスト] リンクをクリックします。

[選択リスト] ダイアログボックスが表示されます。
[選択リスト] ダイアログボックスで、次の値を入力して、[OK] をクリックします。

価値

[表示名]

0

アクティブ

1

支払い済み

2

期限超過

このフィールドが画面に表示されるときは、入力した 3 つの [表示名] 値を含むドロップダウンリストがユーザーに表示されます。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

価値	[表示名]
0	アクティブ
1	支払い済み
2	期限超過

リレーションシップの定義

次の手順では、Patient、Invoice、InvoiceDetail の各エンティティ間のリレーションシップを定義します。

リレーションシップを定義するには

ソリューションエクスプローラーで、[請求書] をダブルクリックします。
データデザイナーのツールバーの [リレーションシップ] をクリックします。

[新しいリレーションシップの追加] ダイアログボックスが表示されます。
[新しいリレーションシップの追加] ダイアログボックスで、[名前] 行の [宛先] 列を選択します。[Patient] を選択し、[OK] をクリックします。

Patient および Invoice エンティティの間に、一対多のリレーションシップが作成されます。患者は、複数の請求書を持つことができます。
データデザイナーのツールバーの [リレーションシップ] をクリックします。

[新しいリレーションシップの追加] ダイアログボックスが表示されます。
[新しいリレーションシップの追加] ダイアログボックスで、[名前] 行の [宛先] 列を選択して、[InvoiceDetail] を選択します。
[多重度] 行の [取得元] 列を選択して、[1] を選択します。
[多重度] 行の [宛先] 列を選択し、[多] を選択してから、[OK] をクリックします。

Invoice および InvoiceDetail エンティティの間に、一対多のリレーションシップが作成されます。請求書は、複数の請求書詳細を含むことができます。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

予定エンティティを作成する

次の手順では、エンティティをもう 1 つ追加して予定を表し、リレーションシップと選択リストを追加します。

Appointment エンティティを追加するには

ソリューションエクスプローラーで、Data Sources をクリックして、[プロジェクト] メニューの [テーブルの追加] をクリックします。
[プロパティ] ウィンドウで、[名前] を "Appointment" に変更します。
データデザイナーで、[名前] 列の [<プロパティの追加>] をクリックして、「AppointmentTime」と入力します。
[種類] 列で、ドロップダウンリストの [DateTime] を選択します。
[名前] 列で [<プロパティの追加>] をクリックして、「AppointmentType」と入力します。
[種類] 列で、ドロップダウンリストの [Short Integer] を選択します。
[名前] 列で [<プロパティの追加>] をクリックして、「DoctorNotes」と入力します。
既定の種類、[文字列] を受け入れ、[必要] チェックボックスをオフにします。
データデザイナーのツールバーの [リレーションシップ] をクリックします。
[新しいリレーションシップの追加] ダイアログボックスで、[名前] 行の [宛先] 列を選択します。[Patient] を選択し、[OK] をクリックします。

Patient および Appointment エンティティの間に、一対多のリレーションシップが作成されます。患者は、複数の予定を入れることができます。
データデザイナーで AppointmentType フィールドを選択します。
[プロパティ] ウィンドウで、[選択リスト] リンクをクリックします。

[選択リスト] ダイアログボックスが表示されます。
[選択リスト] ダイアログボックスで、次の値を入力して、[OK] をクリックします。

価値

[表示名]

0

年間

1

フォローアップ

2

緊急
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

価値	[表示名]
0	年間
1	フォローアップ
2	緊急

画面の作成

次の手順では、患者の一覧を表示する画面を作成します。

画面を作成するには

ソリューションエクスプローラーで [画面] ノードをクリックして、[プロジェクト] メニューの [画面の追加] をクリックします。

[新しい画面の追加] ダイアログボックスが表示されます。
[画面テンプレートの選択] リストの [編集可能なグリッド画面] を選択します。
[画面名] テキストボックスで、「PatientList」と入力します。
[画面データ] ドロップダウンリストを選択して [患者] を選択します。[OK] をクリックします。

画面デザイナーが開き、画面レイアウトの階層構造が表示されます。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

アプリケーションを実行してデータを入力する

これで、アプリケーションが機能します。次の手順では、アプリケーションを実行して、いくつかのデータを入力します。

アプリケーションを実行するには

F5 キーを押してアプリケーションを起動します。
実行中のアプリケーションで [PatientList] 画面を選択して、追加 (+) ボタンをクリックします。

[新しい患者の追加] ダイアログボックスが表示されます。
新しい患者のデータを入力します。[Email] フィールドに、john#example.com などの無効な値を入力します。

フィールドから離れると、赤い枠線が表示されます。EmailAddress ビジネスタイプには、正しく書式設定された電子メールアドレスを検出できる組み込みの検証規則があります。
エラーを修正し、データ入力を完了して、[OK] をクリックします。

アプリケーションツールバーの [保存] ボタンが有効になります。
追加 [+…] ボタンをクリックします。2 番目の患者のデータを追加して [OK] をクリックします。
[保存] をクリックしてデータを保存します。

これで [PatientList] グリッドの列を並べ替えることができ、任意の列で並べ替えを行うことができます。
実行中のアプリケーションウィンドウの右上隅にある [閉じる] をクリックして、デザインモードに戻ります。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

データベースに接続する

次の手順では、製品情報を含む外部データベースに接続します。

[!メモ]

この手順を実行する前に、PrescriptionContoso データベースをダウンロードしてインストールする必要があります。データベースはから MSDN Code Galleryダウンロードできます。データベースをインストールするには、Install.htm ファイルの指示に従ってください。

データソースにアタッチするには

ソリューションエクスプローラーで、[データソース] ノードを選択します。
[プロジェクト] メニューの [データソースの追加] をクリックします。

データソースの添付ウィザードが開きます。
データソースの添付ウィザードで、[データベース] をクリックし、[次へ] をクリックします。

[データソースの選択] ダイアログボックスが開きます。

[!メモ]

LightSwitch のデータベースに接続したことがある場合は、このダイアログボックスが表示されず、次の手順を省略できます。
[データソースの選択] ダイアログボックスで、[Microsoft SQL Server (SQL Client)] をクリックして [続行] をクリックします。

[接続のプロパティ] ダイアログボックスが表示されます。

[接続プロパティ] ダイアログボックスで、続くテーブルに値を入力して、[OK] をクリックします。

フィールド	価値
サーバー名	(localdb)\v11.0
サーバーにログオンする	Windows 認証の使用
[データベースの選択または入力]	C:\Temp\PrescriptionContoso.mdf

接続プロパティ

[データベースオブジェクトの選択] ウィザードページが表示されます。

[テーブル] ノードを展開します。
[製品] および [ProductRebate] テーブルを選択して、[完了] をクリックします。

C_TEMP_PRESCRIPTIONCONTOSO_MDFData データソースがプロジェクトに追加され、Products と ProductRebates のためのエンティティが作成されます。
ソリューションエクスプローラーで、[C_TEMP_PRESCRIPTIONCONTOSO_MDFData] を右クリックし、[名前の変更] をクリックして、「PrescriptionContoso」と入力します。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

Products および ProductRebate エンティティを変更する

次の手順では、ProductRebate および Products エンティティを変更します。

ProductRebate および Products のエンティティを変更するには

ソリューションエクスプローラーで [ProductRebates] ノードをクリックします。
[リベート] を選択して、[種類] を [通貨] に変更します。
ソリューションエクスプローラーで [製品] ノードをダブルクリックします。
データデザイナーで、[MSRP] フィールドを選択して、[型] を [通貨] に変更します。
ProductImage フィールドを選択し、[種類] を [イメージ] に変更します。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

一覧および詳細画面を作成する

次の手順では、製品情報を表示する画面を作成します。

一覧および詳細画面を作成するには

ソリューションエクスプローラーで [画面] ノードを選択します。[プロジェクト] メニューの [画面の追加] をクリックします。
[新しい画面の追加] ダイアログボックスで、[画面テンプレートの選択] リストの [一覧および詳細画面] を選択します。
[画面名] フィールドに、「ProductList」と入力します。
[画面データ] ドロップダウンリストを選択して [PrescriptionContoso.Products] を選択します。
[含める追加データ] リストで、[Product Details] および [ProductRebates] チェックボックスの両方を選択して [OK] をクリックします。

画面のレイアウトを変更する

次の手順では、[ProductList] 画面のレイアウトを変更します。

レイアウトをカスタマイズするには

画面デザイナーの画面コンテンツツリーで [行レイアウト | 製品詳細] ノードを選択します。
[行レイアウト] ドロップダウンリストで [画像とテキスト] を選択します。
[画像とテキスト] ノードの下で、各フィールドのドロップダウンリストから次の値を選択します。

フィールド

価値

(画像)

製品イメージ

(タイトル)

製品名

(サブタイトル)

MSRP

(説明)

説明
F5 キーを押してアプリケーションを実行し、結果を確認します。
実行中のアプリケーションで、[ProductList] メニューをクリックして画面を表示します。

アプリケーションを開いたままにします。次の手順では、実行中のアプリケーションを変更します。

実行中のアプリケーションで変更を行う

次の手順では、アプリケーションの実行中に [製品一覧] 画面を変更します。

実行時に、画面をカスタマイズするには

[製品リスト] の画面で、右下隅の [デザイン画面] のをクリックします。
左側のペインで、[データグリッド | 製品リベート] ノードを選択します。
[プロパティ] ウィンドウで、[表示名] プロパティを [Contoso のリベート] に変更します。

名前は、アプリケーションウィンドウでも変わります。
[MSRP] フィールドを選択して、[説明] プロパティを「リベート前の候補価格」に変更します。
[保存] をクリックして、実行中のアプリケーションに戻り、変更内容を表示します。マウスポインターを [MSRP] フィールドの上に置くと、説明が表示されます。
実行中のアプリケーションウィンドウの右上隅にある [閉じる] をクリックして、デザインモードに戻ります。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

クエリを作成する

次の手順では、パラメーター化されたクエリを作成して画面にバインドします。

パラメーター化されたクエリを作成するには

ソリューションエクスプローラーで [製品] ノードを選択します。[プロジェクト] メニューの [クエリの追加] をクリックします。

クエリデザイナーが表示されます。
[プロパティ] ウィンドウで、[名前] フィールドを選択して「RelatedProducts」と入力します。
クエリデザイナーで、[フィルターの追加] をクリックします。

フィルター条件が [フィルター] セクションに追加されます。
2 番目のドロップダウンリストで [カテゴリ] を選択します。
4 番目のドロップダウンリストで [パラメーター] を選択します。
5 番目のドロップダウンリストで [新規追加] をクリックします。

Category という名前のタイプ String の新しい Parameter が [パラメーター] セクションに追加されます。
ソリューションエクスプローラーで [ProductList] ノードをダブルクリックして、画面デザイナーを開きます。
画面デザイナーのツールバーで [データ項目の追加] をクリックします。

[データ項目の追加] ダイアログボックスが表示されます。
[データ項目の追加] ダイアログボックスで [クエリ] をクリックします。[名前] 列で [PrescriptionContoso.RelatedProducts] を選択して、[OK] をクリックします。

[RelatedProducts] ノードが、左側のペインに表示されます。
[クエリパラメーター] の下にある [カテゴリ] ノードを選択します。
[プロパティ] ウィンドウで、[Products.SelectedItem.Category] プロパティを選択して「Products.SelectedItem.Category」と入力します。
中央ペインで、[DataGrid |Contoso のリベート] ノードの下にある [追加] ノードを展開して、[関連商品] をクリックします。
F5 キーを押してアプリケーションを実行し、結果を確認します。

[製品一覧] 画面を開くと、選択した各製品について関連製品の一覧が表示されています。
実行中のアプリケーションウィンドウの右上隅にある [閉じる] をクリックして、デザインモードに戻ります。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

計算済みフィールドを追加する

次の手順では、計算値を使用するフィールドを追加します。計算値は、リベート金額を適用した後の製品の価格になります。

計算済みフィールドを追加するには

ソリューションエクスプローラーで [Products] エンティティノードをダブルクリックします。
データデザイナーで [<プロパティの追加>] をクリックします。「CurrentPrice」と入力して、[タブ] をクリックします。
[種類] 列で、ドロップダウンリストの [Money] を選択します。

[プロパティ] ウィンドウで、[全般] の下の [Is Computed] プロパティは既定で選択されています。
[プロパティ] ウィンドウで、[Edit メソッド] リンクをクリックします。

コードエディターが表示され、CurrentPrice_Compute メソッドが表示されます。

イベントハンドラーに次のコードを追加します。

Dim rebates As Decimal
    For Each item In ProductRebates
        If item.RebateStart <= Date.Today And item.RebateEnd >= Date.Today Then
            rebates = rebates + item.Rebate
        End If
    Next

    result = Me.MSRP - rebates

decimal rebates = default(decimal);


            foreach (var item in ProductRebates)
            {
                if (item.RebateStart <= System.DateTime.Today && item.RebateEnd >= System.DateTime.Today)
                {
                    rebates += item.Rebate.Value;
                }
            }

            result = this.MSRP - rebates;

現在の価格を計算するコード

[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

次の手順では、[ProductList] 画面に計算済みフィールドを追加します。

画面に計算済みフィールドを追加するには

ソリューションエクスプローラーで、[ProductList] 画面ノードをダブルクリックします。
画面デザイナーの左側のペインで、[CurrentPrice] ノードを選択して、中央ペインの [(説明) |説明] ノードの下にドラッグします。
F5 キーを押してアプリケーションを実行し、結果を確認します。
[ProductList] 画面で、[リベート] または [MSRP] フィールドを編集します。CurrentPrice が再計算されます。[閉じる] をクリックして、デザインモードに戻ります。
実行中のアプリケーションウィンドウの右上隅にある [閉じる] をクリックして、デザインモードに戻ります。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

データベース間の関係を作成する

次の手順では、2 つの異なるデータベース内のエンティティ間の仮想のリレーションシップを作成し、2 つの異なるソースからのデータを単一の一覧および詳細画面に表示します。

データベース間の関係を作成するには

ソリューションエクスプローラーで [InvoiceDetails] エンティティノードをダブルクリックします。
データデザイナーでツールバーの [リレーションシップ] をクリックします。
[新しいリレーションシップの追加] ダイアログボックスで、[宛先] 列の [名前] フィールドを選択して、[Product] を選択します。

新しいセクションが、ダイアログボックスの下部に表示されます。これは、2 つのエンティティ内の関連するフィールドを示しています。必要に応じて、関連するフィールドを同じデータ型の別のフィールドに変更するか、または複数の関連フィールドをキーとして定義します。
[OK] をクリックしてリレーションシップを保存します。

新しいリレーションシップは、デザイナーで点線として表示されます。これは、エンティティが異なるデータソースにあることを示します。この場合、InvoiceDetails は組み込みデータベースで、Products は PrescriptionContoso データベースです。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

請求書を表示する画面を作成する

次の手順では、請求書を表示する新しい画面を作成します。

画面を作成するには

ソリューションエクスプローラーで [画面] ノードを選択します。[プロジェクト] メニューの [画面の追加] をクリックします。
[新しい画面の追加] ダイアログボックスで、[画面テンプレートの選択] リストの [一覧および詳細画面] を選択します。
[画面名] テキストボックスで、「InvoiceScreen」と入力します。
[画面データ] ドロップダウンリストを選択して [請求書] を選択します。
[含める追加データ] リストで、[Invoice Details] および [Invoice InvoiceDetails] チェックボックスをオンにして [OK] をクリックします。
[データグリッド行 | 請求書詳細] ノードを展開します。[Product Product ID] ノードを選択して、それを削除します。
フィールドの順序を変更するには、[UnitPrice] ノードをクリックして、[製品] ノードの下にドラッグします。
F5 キーを押してアプリケーションを実行します。メニューで [請求書画面] をクリックして、画面を表示します。
[請求書] ペインで、追加 [+…] ボタンをクリックします。

いくつかの請求書データを入力します。[InvoiceStatus] フィールドで値のドロップダウンリストが提供され、[患者] フィールドには、患者の一覧を含むダイアログボックスを開くボタンが含まれています。
[請求書詳細] ペインで、追加 (+) ボタンをクリックします。

いくつかの請求書詳細データを入力します。[製品] フィールドは、PrescriptionContoso データベースにある製品のドロップダウンリストを提供しています。
[保存] をクリックして請求書データを保存します。
アプリケーションを開いたままにします。次の手順では、実行中のアプリケーションを変更します。

請求書画面を変更する

次の手順では、実行中のアプリケーションの [請求書] 画面を変更します。

実行中のアプリケーションで画面を変更するには

[請求書画面] の画面で、右上隅にある [デザイン画面] をクリックします。
左側のペインで、[リスト | 請求書] ノードを選択します。[一覧] ドロップダウンリストから [DataGrid] を選択します。
[患者] ノードを選択します。左のマージンにある [MoveUp] 矢印を使用して、[請求書の日付] ノードの上に移動します。
[保存] をクリックして、実行中のアプリケーションに戻り、変更内容を表示します。
実行中のアプリケーションウィンドウの右上隅にある [閉じる] をクリックして、デザインモードに戻ります。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

画面のロジックを定義する

次の手順では、請求書の日付の既定のロジックを定義するコードを追加します。

画面のロジックを定義するには

ソリューションエクスプローラーで [Invoices] エンティティノードをダブルクリックします。
データデザイナーで、ツールバーの [コードの記述] ドロップダウンリストをクリックします。[Invoice_Created] リンクをクリックします。

コードエディターが開き、Invoice_Created メソッドが表示されます。

Invoice_Created メソッドで、次のコードを追加して、日付の既定の動作を設定します。

InvoiceDate = Date.Today
InvoiceDue = Date.Today.AddDays(30)
ShipDate = Date.Today.AddDays(3)

InvoiceDate = System.DateTime.Today;
InvoiceDue = System.DateTime.Today.AddDays(30);
ShipDate = System.DateTime.Today.AddDays(3);

ソリューションエクスプローラーで [Invoices] エンティティノードをダブルクリックします。
データデザイナーで InvoiceDate フィールドを選択します。
ツールバーの [コードの記述] ドロップダウンリストをクリックして、[InvoiceDate_Changed] リンクをクリックします

InvoiceDate_Changed メソッドで、InvoiceDate が変更されたときに日付を更新するために、次のコードを追加します。

InvoiceDue = InvoiceDate.AddDays(30)
‘ If the ShipDate is earlier than the new InvoiceDate, update it.
If ShipDate < InvoiceDate Then
    ShipDate = InvoiceDate.AddDays(2)
End If

InvoiceDue = InvoiceDate.AddDays(30); 
    // If the ShipDate is earlier than the new InvoiceDate, update it
if (ShipDate < InvoiceDate)
    {
        ShipDate = InvoiceDate.AddDays(2);
    }

ソリューションエクスプローラーで [InvoiceDetails] ノードをダブルクリックします。
データデザイナーで、[製品] フィールドを選択し、ツールバーの [コードの記述] ドロップダウンリストをクリックしてから、[Product_Changed] リンクをクリックします。
コードエディターで、次のコードを追加して、単価と既定の数量を設定します。
```
UnitPrice = Product.CurrentPrice
Quantity = 1
```
```
UnitPrice = Product.CurrentPrice;

Quantity = 1;
```
F5 キーを押してアプリケーションを実行し、変更を確認します。

[請求書] 画面を開き、新しい請求書を追加します。日付フィールド、価格、数量が自動的に更新されます。
[保存] をクリックして変更内容を保存します。
実行中のアプリケーションウィンドウの右上隅にある [閉じる] をクリックして、デザインモードに戻ります。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

さらに計算済みフィールドを追加する

次の手順では、SubTotal、Tax、Totals の計算済みフィールドを、InvoiceDetails および Invoices エンティティに追加します。

計算済みフィールドを追加するには

ソリューションエクスプローラーで [InvoiceDetails] エンティティノードをダブルクリックします。
データデザイナーで、[<プロパティの追加>] をクリックして「SubTotal」と入力してから、[Tab] をクリックします。
[種類] 列で、ドロップダウンリストの [Money] を選択します。
[プロパティ] ウィンドウで、[全般プロパティ] の下の [IsComputed] チェックボックスをオンにします。
[Edit メソッド] リンクをクリックします。

コードエディターが表示され、SubTotal_Compute メソッドが表示されます。
SubTotal を計算するために次のコードを追加します。
```
result = Quantity * UnitPrice
```
```
result = Quantity * UnitPrice;
```
ソリューションエクスプローラーで [Invoices] エンティティノードをダブルクリックします。
データデザイナーで、[<プロパティの追加>] をクリックして「Tax」と入力してから、[Tab] をクリックします。
[種類] 列で、ドロップダウンリストの [Money] を選択します。
[プロパティ] ウィンドウで、[IsComputed] チェックボックスをオンにします。
[Edit メソッド] リンクをクリックします。

コードエディターが開き、Tax_Compute メソッドが表示されます。

Tax_Compute メソッドを次のコードに置き換えて、Tax を計算します。

Private Sub Tax_Compute(ByRef result As Decimal)
    Result =  GetSubTotal() * 0.095
End Sub
Protected Function GetSubTotal() As Decimal
    GetSubtotal = 0
    For Each item In InvoiceDetails
        GetSubTotal = GetSubTotal + item.SubTotal
    Next
End Function

partial void Tax_Compute(ref decimal result)
    {
        result = GetSubTotal() * (decimal)0.095;
    }
protected decimal GetSubTotal()
    {
        return this.InvoiceDetails.Sum(i => i.SubTotal);
    }

ソリューションエクスプローラーで [Invoices] エンティティノードをダブルクリックします。
データデザイナーで [<プロパティの追加>] をクリックします。「Total」と入力して、[タブ] をクリックします。
[種類] 列で、ドロップダウンリストの [Money] を選択します。
[プロパティ] ウィンドウで、[IsComputed] チェックボックスをオンにします。
[Edit メソッド] リンクをクリックします。

コードエディターが開き、Total_Compute メソッドが表示されます。
Tax を計算するために次のコードを追加します。
```
result = GetSubTotal() + Tax
```
```
result = GetSubTotal() + Tax;
```
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

次の手順では、[Invoices] 画面に新しいフィールドを追加します。

画面にフィールドを追加するには

ソリューションエクスプローラーで [InvoiceScreen] 画面ノードをダブルクリックします。
中央のペインで、[行レイアウト | Invoice Details] ノードを選択して展開します。
[追加] ドロップダウンを選択して展開し、[Tax] を選択します。

[垂直スタック | InvoiceDetails] セクションに [税] フィールドが追加されます。
[追加] ドロップダウンをもう一度選択し、[Total] フィールドを選択します。
F5 キーを押してアプリケーションを実行し、結果を確認します。

[請求書画面] の画面を開きます。各請求書の行で、[税] と [合計] フィールドが表示されます。
[デザイン画面] をクリックして、カスタマイズモードに変更します。
左のペインで、[データグリッド行 | 請求書詳細] ノードを選択して展開します。
[追加] ドロップダウンをクリックして、[小計] を選択します。
[保存] をクリックして変更を保存します。これで、[SubTotal] フィールドが [請求書詳細] グリッドに表示されます。
実行中のアプリケーションウィンドウの右上隅にある [閉じる] をクリックして、デザインモードに戻ります。
[ファイル] メニューの [すべてを保存] をクリックして、作業を保存します。

アプリケーションを配置する

次の手順では、2 層のデスクトップアプリケーションとしてアプリケーションを配置します。

2 層のデスクトップアプリケーションを発行するには

ソリューションエクスプローラーで、[Vision Clinic] ノードを選択して、[ビルド] メニューの [Vision Clinic の発行] をクリックします。

LightSwitch 公開アプリケーションウィザードが表示されます。
[LightSwitch 発行ウィザードへようこそ] ページで、[デスクトップ] を選択していることを確認して [次へ] をクリックします。
[アプリケーションサービス] ページで、[ローカル] を選択していることを確認してから、[次へ] をクリックします。
[発行の設定を指定] ページで [アプリケーションファイルを配置する場所] フィールドを選択して、「C\Publish」と入力します。
[既定のデータベースを発行する方法] セクションで [データベースに直接発行する] を選択して [次へ] をクリックします。
[LightSwitch アプリケーションデータベース - SQL データベース接続] ページで、既定の接続文字列値を受け入れて [次へ] をクリックします。
[必須コンポーネントのインストール] ページで既定の設定を受け入れ、[次へ] をクリックします。
[その他の接続情報] ページで既定の設定を受け入れて、[発行] をクリックします。
エクスプローラーで C:\Publish ディレクトリを見つけて Setup.exe をダブルクリックし、ローカルコンピューターにアプリケーションをインストールします。

[!メモ]

別のコンピューターにアプリケーションをインストールするには、発行フォルダーとそのすべてのサブフォルダーの内容をコピーします。インストールする前に、Install.htm ファイルで説明されている手順を完了する必要があります。このファイルは、発行フォルダーにあります。
[アプリケーションのインストール - セキュリティの警告] ダイアログボックスが表示された場合は、[インストール] をクリックします。

ビジョンクリニックアプリケーションがインストールされ、起動します。
いくつかのデータを入力し、アプリケーションが問題なく動作することを確認します。

ヒント

Vision Clinic アプリケーションを再度実行する場合は、[スタート] メニューから開くことができます。

ヒント
Vision Clinic アプリケーションを再度実行する場合は、[スタート] メニューから開くことができます。

ビジョンクリニックアプリケーションのチュートリアルはこれで終わりです。これで LightSwitch アプリケーションを作成するエンドツーエンドプロセスの基本を理解できました。

このチュートリアルでは LightSwitch の基本的な機能を扱いますが、LightSwitch ではさらに多くのことを行うことができます。独自のアプリケーションを構築する際、製品のドキュメントで多くの機能について学ぶことができます。

参照

概念

LightSwitch ガイドツアー

Visual Studio LightSwitch

その他の技術情報

LightSwitch について

フィールド	価値
(画像)	製品イメージ
(タイトル)	製品名
(サブタイトル)	MSRP
(説明)	説明

次の方法で共有

チュートリアル: Vision Clinic アプリケーションの作成

必須コンポーネント

手順

プロジェクトの作成

プロジェクトを作成するには

テーブルを定義する

Patient エンティティを作成するには

Invoice および InvoiceDetail エンティティを作成するには

選択リストを作成する

選択リストを作成するには

リレーションシップの定義

リレーションシップを定義するには

予定エンティティを作成する

Appointment エンティティを追加するには

画面の作成

画面を作成するには

アプリケーションを実行してデータを入力する

アプリケーションを実行するには

データベースに接続する

データ ソースにアタッチするには

Products および ProductRebate エンティティを変更する

ProductRebate および Products のエンティティを変更するには

一覧および詳細画面を作成する

一覧および詳細画面を作成するには

画面のレイアウトを変更する

レイアウトをカスタマイズするには

実行中のアプリケーションで変更を行う

実行時に、画面をカスタマイズするには

クエリを作成する

パラメーター化されたクエリを作成するには

計算済みフィールドを追加する

計算済みフィールドを追加するには

画面に計算済みフィールドを追加するには

データベース間の関係を作成する

データベース間の関係を作成するには

請求書を表示する画面を作成する

画面を作成するには

請求書画面を変更する

実行中のアプリケーションで画面を変更するには

画面のロジックを定義する

画面のロジックを定義するには

さらに計算済みフィールドを追加する

計算済みフィールドを追加するには

画面にフィールドを追加するには

アプリケーションを配置する

2 層のデスクトップ アプリケーションを発行するには

参照

概念

その他の技術情報

その他のリソース

データソースにアタッチするには

2 層のデスクトップアプリケーションを発行するには