逐步解說：顯示 WPF 應用程式中的相關資料
發佈時間: 2016年4月
在這個逐步解說中，您將建立 WPF 應用程式，顯示有父子關係之資料庫資料表內的資料。 此資料會封裝在實體資料模型的實體中。 父實體包含一組訂單的概觀資訊。 這個實體的每個屬性是繫結至應用程式中的不同控制項。 子實體包含每個訂單的詳細資料。 這組資料會繫結至 DataGrid 控制項。
這個逐步解說將說明下列工作：
建立 WPF 應用程式以及從 AdventureWorksLT 範例資料庫中的資料所產生的實體資料模型。
建立一組顯示一組訂單概觀資訊的資料繫結控制項。 您可以從 [資料來源] 視窗將父實體拖曳至 [WPF 設計工具]，藉以建立控制項。
建立 DataGrid 控制項，它會顯示每個選取之訂單的相關詳細資料。 您可以從 [資料來源] 視窗將子實體拖曳至 [WPF 設計工具] 中的視窗，藉以建立控制項。
.jpeg "System_CAPS_note")
注意事項在下列指示的某些 Visual Studio 使用者介面項目中，您的電腦可能會顯示不同的名稱或位置： 您所擁有的 Visual Studio 版本以及使用的設定會決定這些項目。 如需詳細資訊，請參閱將 Visual Studio IDE 個人化。
必要條件
您需要下列元件才能完成此逐步解說：
Visual Studio.
存取附加了 AdventureWorksLT 範例資料庫之執行中的 SQL Server 或 SQL Server Express 執行個體。 您可以從 CodePlex 網站 (英文) 下載 AdventureWorksLT 資料庫。
預先了解下列概念也有助於完成此逐步解說 (但非必要)：
實體資料模型和 ADO.NET Entity Framework。 如需詳細資訊，請參閱 Entity Framework 概觀。
使用 WPF 設計工具。 如需詳細資訊，請參閱 WPF 和 Silverlight 設計工具概觀。
WPF 資料繫結。 如需詳細資訊，請參閱資料繫結概觀。
建立專案
建立新的 WPF 專案以顯示訂單記錄。
若要建立新的 WPF 專案
啟動 Visual Studio。
在 [檔案] 功能表上，指向 [新增]，然後按一下 [專案]。
展開 [Visual C#] 或 [Visual Basic]，然後選取 [視窗]。
在對話方塊上方的下拉式方塊中，確定已選取 [.NET Framework 4]。 這個逐步解說使用的 DataGrid 控制項只適用於 .NET Framework 4。
選取 [WPF 應用程式] 專案範本。
在 [名稱] 方塊中，輸入 AdventureWorksOrdersViewer。
按一下 [確定]。
Visual Studio 隨即建立 AdventureWorksOrdersViewer 專案。
建立應用程式的實體資料模型
在建立資料繫結控制項之前，必須先定義應用程式的資料模型並將其加入至 [資料來源] 視窗。 在這個逐步解說中，資料模型是實體資料模型。
若要建立實體資料模型
在 [資料] 功能表上，按一下 [加入新資料來源] 以開啟 [資料來源組態精靈]。
在 [選擇資料來源類型] 頁面上，按一下 [資料庫]，再按 [下一步]。
在 [選擇資料庫模型] 頁面上，按一下 [實體資料模型]，再按 [下一步]。
在 [選擇模型內容] 頁面上，按一下 [從資料庫產生]，再按 [下一步]。
在 [選擇資料連接] 頁面上，執行下列其中一項：
如果下拉式清單中提供 AdventureWorksLT 範例資料庫的資料連接，請選取這個資料連接。
-或-
按一下 [新增連接]，建立與 AdventureWorksLT 資料庫的連接。
請確定已選取 [另存 App.Config 中的實體連接字串為] 選項，然後按 [下一步]。
在 [選擇您的資料庫物件] 頁面上，展開 [資料表]，然後選取下列資料表：
SalesOrderDetail
SalesOrderHeader
按一下 [完成]。
建置專案。
建立顯示訂單的資料繫結控制項
從 [資料來源] 視窗將 SalesOrderHeaders 實體拖曳至 WPF 設計工具，以建立顯示訂單記錄的控制項。
若要建立顯示訂單記錄的資料繫結控制項
在 [方案總管] 中按兩下 MainWindow.xaml。
視窗隨即在 WPF 設計工具中開啟。
編輯 XAML，將 Height 和 Width 屬性設定為 800。
在 [資料來源] 視窗中，按一下 [SalesOrderHeaders] 節點的下拉式功能表，然後選取 [詳細資料]。
展開 [SalesOrderHeaders] 節點。
按一下 [SalesOrderID] 旁邊的下拉式功能表，然後選取 [ComboBox]。
針對 [SalesOrderHeaders] 節點的下列每個子節點，按一下節點旁邊的下拉式功能表，然後選取 [無]：
RevisionNumber
OnlineOrderFlag
ShipToAddressID
BillToAddressID
CreditCardApprovalCode
SubTotal
TaxAmt
Freight
rowguid
ModifiedDate
這個動作可防止 Visual Studio 在下一個步驟中為這些節點建立資料繫結控制項。 在此逐步解說中，假設使用者不需要看到此資料。
從 [資料來源] 視窗，將 [SalesOrderHeaders] 節點拖曳至 [WPF 設計工具] 中的視窗。
Visual Studio 會產生建立繫結至 SalesOrderHeaders 實體資料之一組控制項的 XAML，以及載入資料的程式碼。 如需產生之 XAML 和程式碼的詳細資訊，請參閱將 WPF 控制項繫結至 Visual Studio 中的資料。
在設計工具中，按一下 [銷售訂單 ID] 標籤旁邊的下拉式方塊。
在 [屬性] 視窗中，選取 IsReadOnly 屬性旁邊的核取方塊。
建立顯示訂單詳細資料的資料格
從 [資料來源] 視窗將 SalesOrderDetails 實體拖曳至 WPF 設計工具，以建立顯示訂單詳細資料的 DataGrid 控制項。
若要建立顯示訂單詳細資料的資料格
在 [資料來源] 視窗中，尋找屬於 [SalesOrderHeaders] 節點之子節點的 [SalesOrderDetails] 節點。
注意事項還有一個 [SalesOrderDetails] 節點是 [SalesOrderHeaders] 節點的對等節點。請務必選取 [SalesOrderHeaders] 節點的子節點。
展開 [SalesOrderDetails] 子節點。
針對 [SalesOrderDetails] 節點的下列每個子節點，按一下節點旁邊的下拉式功能表，然後選取 [無]：
SalesOrderID
SalesOrderDetailID
rowguid
ModifiedDate
這個動作可防止 Visual Studio 將此資料包含在下一個步驟中將建立的 DataGrid 控制項。 在此逐步解說中，假設使用者不需要看到此資料。
從 [資料來源] 視窗，將 [SalesOrderDetails] 子節點拖曳至 [WPF 設計工具] 中的視窗。
Visual Studio 會產生定義新資料繫結 DataGrid 控制項的 XAML，而此控制項會出現在設計工具中。 Visual Studio 也會更新程式碼後置檔案中所產生的 GetSalesOrderHeadersQuery 方法，以包含 SalesOrderDetails 實體中的資料。
測試應用程式
建置並執行應用程式，以確認應用程式會顯示訂單記錄。
若要測試應用程式
請按 F5。
應用程式隨即建置並執行。 驗證下列各項：
[銷售訂單 ID] 下拉式方塊會顯示 [71774]。 這是實體中的第一個訂單 ID。
針對您在 [銷售訂單 ID] 下拉式方塊中選取的每個訂單，DataGrid 中會顯示詳細訂單資訊。
請關閉應用程式。
後續步驟
當您完成本逐步解說之後，學習如何使用 Visual Studio 中的 [資料來源] 視窗，將 WPF 控制項繫結至其他資料來源類型。 如需詳細資訊，請參閱逐步解說：將 WPF 控制項繫結至 WCF 資料服務和逐步解說：將 WPF 控制項繫結到資料集。