將 WPF 控制項繫結至 WCF 資料服務
您將在此逐步解說中,建立包含資料繫結控制項的 WPF 應用程式。 這些控制項會繫結至 WCF 資料服務中封裝的客戶記錄。 您也會加入按鈕,讓客戶可使用這些按鈕檢視及更新記錄。
本逐步解說將說明下列工作:
建立從 AdventureWorksLT 範例資料庫中的資料產生的實體資料模型。
建立 WCF 資料服務,以將實體資料模型中的資料公開給 WPF 應用程式。
從 [資料來源] 視窗將項目拖曳至 WPF 設計工具,以建立一組資料繫結控制項。
建立可向前及向後巡覽客戶記錄的按鈕。
建立按鈕,以將控制項中的資料變更儲存至 WCF 資料服務及基礎資料來源。
注意
在本文的某些 Visual Studio 使用者介面項目中,您的電腦可能會顯示不同的名稱或位置。 您使用的可能是不同版本的 Visual Studio 或不同的環境設定。 如需詳細資訊,請參閱將 IDE 個人化。
必要條件
您需要下列元件才能完成這個逐步解說:
Visual Studio
對執行中的 SQL Server 或 SQL Server Express (其中連結了 AdventureWorksLT 範例資料庫) 執行個體的存取權。 若要下載資料庫,請參閱 AdventureWorks 範例資料庫。
預先了解下列概念也有助於完成此逐步解說 (但非必要):
WCF Data Services 中的資料模型。
實體資料模型及 ADO.NET Entity Framework。 如需詳細資訊,請參閱 Entity Framework 概觀。
WPF 資料繫結。 如需詳細資訊,請參閱資料繫結概觀。
建立服務專案
建立 C# 或 Visual Basic ASP.NET Web 應用程式 專案,以開始本逐步解說。 將專案命名為 AdventureWorksService。
在 [方案總管] 中,以滑鼠右鍵按一下 Default.aspx,並選取 [刪除]。 此逐步解說不需要這個檔案。
建立服務的實體資料模型
若要使用 WCF 資料服務將資料公開給應用程式,您必須定義服務的資料模型。 WCF 資料服務支援兩種類型的資料模型:實體資料模型及自訂資料模型,後者使用實作 IQueryable<T> 介面的 Common Language Runtime (CLR) 所定義。 在此逐步解說中,您要建立資料模型的實體資料模型。
在 [專案] 功能表上,按一下 [加入新項目]。
在 [已安裝的範本] 清單中,按一下 [資料],然後選取 [ADO.NET 實體資料模型] 專案項目。
將名稱變更為
AdventureWorksModel.edmx
,然後按一下 [新增]。[實體資料模型精靈] 隨即開啟。
在 [選擇模型內容] 頁面中,按一下 [從資料庫產生],然後按一下 [下一步]。
在 [選擇資料連線] 頁面中,選取下列其中一個選項:
若下拉式清單中有提供 AdventureWorksLT 範例資料庫的資料連接,請選取此資料連接。
按一下 [新增連線],建立與 AdventureWorksLT 資料庫的連線。
在 [選擇資料連線] 頁面中,確定已選取 [將 App.Config 中的實體連線設定儲存為] 選項,然後選取 [下一步]。
在 [選擇您的資料庫物件] 頁面中,展開 [資料表],然後選取 SalesOrderHeader 資料表。
按一下完成。
建立服務
建立 WCF 資料服務,以將實體資料模型中的資料公開給 WPF 應用程式:
在 [專案] 功能表上,選取 [新增項目]。
在 [已安裝的範本] 清單中,按一下 Web,然後選取 [WCF 資料服務] 專案項目。
在 [名稱] 方塊中輸入
AdventureWorksService.svc
,然後按一下 [新增]。Visual Studio 會將
AdventureWorksService.svc
新增至專案。
設定服務
您必須設定服務,以處理您建立的實體資料模型:
在
AdventureWorks.svc
程式碼檔案中,以下列程式碼取代 AdventureWorksService 類別宣告。public class AdventureWorksService : DataService<AdventureWorksLTEntities> { // This method is called only once to initialize service-wide policies. public static void InitializeService(IDataServiceConfiguration config) { config.SetEntitySetAccessRule("SalesOrderHeaders", EntitySetRights.All); } }
此程式碼會更新 AdventureWorksService 類別,使其衍生自處理您在實體資料模型中
AdventureWorksLTEntities
物件內容類別的 DataService<T>。 該程式碼也會更新InitializeService
方法,允許服務的用戶端對SalesOrderHeader
實體具有完整的讀取/寫入存取權。建置專案,並確認專案建置無誤。
建立 WPF 用戶端應用程式
若要從 WCF 資料服務顯示資料,請使用以服務為基礎的資料來源,建立新的 WPF 應用程式。 稍後您將在此逐步解說中,將資料繫結控制項加入至應用程式。
在 [方案總管] 中,以滑鼠右鍵按一下方案節點,然後按一下 [新增],然後選取 [新增專案]。
在 [新增專案] 對話方塊中,展開 [Visual C#] 或 [Visual Basic],然後選取 [視窗]。
選取 [WPF 應用程式] 專案範本。
在 [名稱] 方塊中,鍵入
AdventureWorksSalesEditor
並按一下 [確定]。Visual Studio 會將
AdventureWorksSalesEditor
專案新增至方案。按一下 [ 資料 ] 功能表上的 [ 顯示資料來源]。
[資料來源] 視窗隨即開啟。
在 [ 資料來源 ] 視窗中,按一下 [ 加入新資料來源]。
[資料來源組態精靈] 隨即開啟。
在精靈的 [選擇資料來源類型] 頁面中,選取 [服務],然後選取 [下一步]。
在 [新增服務參考] 對話方塊中,按一下 [探索]。
Visual Studio 會搜尋目前方案中可用的服務,並將
AdventureWorksService.svc
新增至 [服務] 方塊中可用的服務清單。在 [命名空間] 方塊中,鍵入 AdventureWorksService。
在 [服務] 方塊中,按一下 AdventureWorksService.svc,然後選取 [確定]。
Visual Studio 會下載服務資訊,然後傳回 [資料來源組態精靈]。
在 [新增服務參考] 頁面中按一下 [完成]。
Visual Studio 會將代表服務所傳回之資料的節點,新增至 [資料來源] 視窗。
定義使用者介面
透過在 WPF 設計工具中修改 XAML,將數個按鈕加入至視窗。 在此逐步解說的稍後內容中,您會加入程式碼,讓使用者使用這些按鈕檢視及更新銷售記錄。
在 [方案總管] 中,按兩下 MainWindow.xaml。
隨即會在 WPF 設計工具中開啟視窗。
在設計工具的 XAML 檢視中,在
<Grid>
標記之間新增下列程式碼:<Grid.RowDefinitions> <RowDefinition Height="75" /> <RowDefinition Height="525" /> </Grid.RowDefinitions> <Button HorizontalAlignment="Left" Margin="22,20,0,24" Name="backButton" Width="75"><</Button> <Button HorizontalAlignment="Left" Margin="116,20,0,24" Name="nextButton" Width="75">></Button> <Button HorizontalAlignment="Right" Margin="0,21,46,24" Name="saveButton" Width="110">Save changes</Button>
組建專案。
建立資料繫結控制項
從 [資料來源] 視窗將 SalesOrderHeaders
節點拖曳至設計工具,以建立可顯示客戶記錄的控制項。
在 [資料來源] 視窗中,按一下 [SalesOrderHeaders] 節點的下拉式清單功能表,然後選取 [詳細資料]。
展開 [SalesOrderHeaders] 節點。
在此範例中,某些欄位不會顯示,因此請按一下下列節點旁邊的下拉式清單功能表,然後選取 [無]:
CreditCardApprovalCode
ModifiedDate
OnlineOrderFlag
RevisionNumber
rowguid
此動作可避免 Visual Studio 在下一個步驟中建立這些節點的資料繫結控制項。 在此逐步解說中,假設終端使用者不需要看到此資料。
從 [資料來源] 視窗將 [SalesOrderHeaders] 節點拖曳至包含按鈕之資料列下方的資料格列。
Visual Studio 會產生 XAML 和程式碼,其可建立一組繫結至 [產品] 資料表之資料的控制項。 如需所產生 XAML 和程式碼的詳細資訊,請參閱將 WPF 控制項繫結至 Visual Studio 中的資料。
在設計工具中,按一下 [Customer ID] 標籤旁邊的文字方塊。
在 [屬性] 視窗中,選取 [IsReadOnly] 屬性旁邊的核取方塊。
為下列每個文字方塊設定 IsReadOnly 屬性:
Purchase Order Number
Sales Order ID
Sales Order Number
從服務載入資料
使用服務 Proxy 物件從服務載入銷售資料。 然後將傳回的資料指派給 WPF 視窗中 CollectionViewSource 的資料來源。
在設計師中,若要建立
Window_Loaded
事件處理常式,按兩下所讀取的文字:MainWindow。以下列程式碼取代事件處理常式。 確認使用開發電腦的本機主機位址,取代此程式碼中的
localhost
位址。private AdventureWorksService.AdventureWorksLTEntities dataServiceClient; private System.Data.Services.Client.DataServiceQuery<AdventureWorksService.SalesOrderHeader> salesQuery; private CollectionViewSource ordersViewSource; private void Window_Loaded(object sender, RoutedEventArgs e) { // TODO: Modify the port number in the following URI as required. dataServiceClient = new AdventureWorksService.AdventureWorksLTEntities( new Uri("http://localhost:45899/AdventureWorksService.svc")); salesQuery = dataServiceClient.SalesOrderHeaders; ordersViewSource = ((CollectionViewSource)(this.FindResource("salesOrderHeadersViewSource"))); ordersViewSource.Source = salesQuery.Execute(); ordersViewSource.View.MoveCurrentToFirst(); }
巡覽銷售記錄
新增可讓使用者使用 < 及 > 按鈕捲動銷售記錄的程式碼。
在設計工具中,按兩下視窗介面上的 < 按鈕。
Visual Studio 會開啟程式碼後置檔案,並建立 Click 事件的新
backButton_Click
事件處理常式。將下列程式碼加入至產生的
backButton_Click
事件處理常式:回到設計工具,然後按兩下 > 按紐。
Visual Studio 會開啟程式碼後置檔案,並建立 Click 事件的新
nextButton_Click
事件處理常式。將下列程式碼加入至產生的
nextButton_Click
事件處理常式:
儲存銷售記錄的變更
新增程式碼,讓使用者可以使用 [儲存變更] 按鈕檢視及儲存銷售記錄的變更:
在設計工具中,按兩下 [儲存變更] 按鈕。
Visual Studio 會開啟程式碼後置檔案,並建立 Click 事件的新
saveButton_Click
事件處理常式。將下列程式碼加入至
saveButton_Click
事件處理常式。
測試應用程式
建置並執行應用程式,以確認您可以檢視及更新客戶記錄:
在 [建置] 功能表上,按一下 [建置方案]。 確認方案建置無誤。
按 Ctrl+F5。
Visual Studio 會啟動 AdventureWorksService 專案而不進行偵錯。
在 [方案總管] 中,以滑鼠右鍵按一下 AdventureWorksSalesEditor。
在右鍵功能表 (捷徑功能表) 的 [偵錯] 之下,按一下 [開始新執行個體]。
應用程式隨即執行。 驗證下列項目:
這些文字方塊會從第一筆銷售記錄 (具有銷售訂單 ID 71774) 的資料顯示不同欄位。
您可以按一下 > 或 < 按鈕,巡覽其他銷售記錄。
在其中一個銷售記錄中,在 [註解] 方塊中鍵入部分文字,然後選取 [儲存變更]。
關閉應用程式,然後從 Visual Studio 再次啟動應用程式。
巡覽至您變更過的銷售記錄,並確認變更在您關閉及重新開啟應用程式之後仍然存在。
關閉應用程式。
下一步
完成此逐步解說後,您可以執行下列相關的工作:
了解如何使用 Visual Studio 中的 [資料來源] 視窗,將 WPF 控制項繫結至其他資料來源類型。 如需詳細資訊,請參閱將 WPF 控制項繫結至資料集。
了解如何使用 Visual Studio 中的 [資料來源] 視窗,顯示 WPF 控制項中的相關資料 (也就是父子關聯性中的資料)。 如需詳細資訊,請參閱逐步解說:在 WPF 應用程式中顯示相關資料。