演练:将 Silverlight 控件绑定到 WCF 数据服务

在本演练中,您将创建一个包含数据绑定控件的 Silverlight 应用程序。 这些控件将绑定到通过 WCF 数据服务访问的客户记录。

本演练阐释了以下任务:

  • 创建一个利用 AdventureWorksLT 示例数据库中的数据生成的实体数据模型。

  • 创建一个向 Silverlight 应用程序公开实体数据模型中的数据的 WCF 数据服务。

  • 运行**“数据源配置向导”以连接到填充“数据源”**窗口的数据服务。

  • 通过将项从**“数据源”**窗口拖到 Silverlight Designer 来创建一组数据绑定控件。

  • 创建用于向前和向后浏览记录的按钮。

    备注

    以下说明中的某些 Visual Studio 用户界面元素在你计算机上的名称或显示位置可能有所不同。这些元素取决于你所使用的 Visual Studio 版本和你所使用的设置。有关详细信息,请参阅 在 Visual Studio 中自定义开发设置

系统必备

您需要以下组件来完成本演练:

  • Visual Studio

  • 对附加了 AdventureWorksLT 示例数据库的 SQL Server 或 SQL Server Express 的正在运行的实例的访问权限。 您可以从 CodePlex 网站下载 AdventureWorksLT 数据库。

事先了解以下概念也很有用,但对于完成本演练并不是必需的:

  • WCF 数据服务。 有关更多信息,请参见 WCF 数据服务概述

  • 实体数据模型和 ADO.NET Entity Framework。 有关更多信息,请参见 实体框架概述

  • 使用 Silverlight Designer。

  • Silverlight 数据绑定。 有关更多信息,请参见 Data Binding(数据绑定)。

创建服务项目

通过创建一个用于承载 WCF 数据服务的空 Web 应用程序项目来开始本演练。

创建服务项目

  1. 在**“文件”菜单上指向“新建”,再单击“项目”**。

  2. 展开**“Visual C#”“Visual Basic”,然后选择“Web”**。

  3. 选择**“ASP.NET 空 Web 应用程序”**项目模板。

  4. 在**“名称”框中,键入 AdventureWorksWebApp,然后单击“确定”**。

为服务创建实体数据模型

若要通过使用 WCF 数据服务向应用程序公开数据,则必须为该服务定义一个数据模型。 在本演练中,请创建实体数据模型。

创建实体数据模型

  1. 在**“项目”菜单上,单击“添加新项”**。

  2. 选择**“ADO.NET 实体数据模型”**项目项。

  3. 将名称更改为 AdventureWorksDataModel.edmx,然后单击**“添加”**。

    **“实体数据模型向导”**将打开。

  4. 在**“选择模型内容”页上,单击“从数据库生成”,然后单击“下一步”**。

  5. 在**“选择您的数据连接”**页上,选择下列选项之一:

    • 如果下拉列表中包含到 AdventureWorksLT 示例数据库的数据连接,请选择该连接。

    • 单击**“新建连接”**并创建到 AdventureWorksLT 数据库的连接。

  6. 验证是否选择了**“将 Web.Config 中的实体连接设置另存为”选项,然后单击“下一步”**。

  7. 在**“选择数据库对象”页上,展开“表”,然后选择“Customer”**表。

  8. 单击**“完成”**。

创建服务

创建 WCF 数据服务以公开实体数据模型中的数据。

创建服务

  1. 在**“项目”菜单上选择“添加新项”**。

  2. 选择**“WCF 数据服务”**项目项。

  3. 在**“名称”框中键入 AdventureWorksDataService.svc,然后单击“添加”**。

配置服务

若要操作所创建的实体数据模型,您必须对服务进行配置。

配置服务

  1. 在 AdventureWorksDataService.svc 代码文件中,用下面的代码替换 AdventureWorksDataService 类声明:

    Public Class AdventureWorksDataService
        Inherits DataService(Of AdventureWorksLTEntities)
    
        ' This method is called only once to initialize service-wide policies. 
        Public Shared Sub InitializeService(ByVal config As DataServiceConfiguration)
            config.SetEntitySetAccessRule("*", EntitySetRights.All)
            config.DataServiceBehavior.MaxProtocolVersion = DataServiceProtocolVersion.V2
        End Sub 
    
    End Class
    
    public class AdventureWorksDataService : DataService<AdventureWorksLTEntities>
    {
        // This method is called only once to initialize service-wide policies. 
        public static void InitializeService(DataServiceConfiguration config)
        {
            config.SetEntitySetAccessRule("*", EntitySetRights.All);
            config.DataServiceBehavior.MaxProtocolVersion = DataServiceProtocolVersion.V2;
        }
    }
    
  2. 生成项目,并确认生成过程中未发生错误。

创建 Silverlight 应用程序

创建新的 Silverlight 应用程序,然后添加数据源以访问服务。

创建 Silverlight 应用程序:

  1. 在**“解决方案资源管理器”中,右击解决方案节点,单击“添加”,然后选择“新建项目”**。

  2. 在**“新建项目”对话框中,展开“Visual C#”“Visual Basic”,然后选择“Silverlight”**。

  3. 选择**“Silverlight 应用程序”**项目模板。

  4. 在**“名称”框中,键入 AdventureWorksSilverlightApp,然后单击“确定”**。

  5. 在**“新建 Silverlight 应用程序”对话框中,单击“确定”**。

向 Silverlight 应用程序中添加数据源

创建基于服务所返回的数据的数据源。

创建数据源

  1. 在**“数据”菜单上,单击“显示数据源”**。

  2. 在**“数据源”窗口中,单击“添加新数据源”**。

    **“数据源配置向导”**打开。

  3. 在该向导的**“选择数据源类型”页上,选择“服务”,然后单击“下一步”**。

  4. 在**“添加服务引用”对话框中,单击“发现”**。

    Visual Studio 将在当前解决方案中搜索可用服务,并将 AdventureWorksDataService.svc 添加到**“服务”**框中可用服务的列表中。

  5. 在**“命名空间”**框中,键入 AdventureWorksService。

  6. 在**“服务”框中,单击 AdventureWorksDataService.svc,然后单击“确定”**。

  7. 在**“添加服务引用”页上,单击“完成”**。

    Visual Studio 将表示该服务返回的数据的节点添加到**“数据源”**窗口中。

定义窗口的用户界面

通过在 Silverlight Designer 中修改 XAML,向窗口中添加按钮。

创建窗口布局

  1. 在**“解决方案资源管理器”**中,双击 MainPage.xaml。

    窗口将在 Silverlight Designer 中打开。

  2. 在设计器的 XAML 视图中,在 <Grid> 标记之间添加以下代码:

    <Grid.RowDefinitions>
        <RowDefinition Height="75" />
        <RowDefinition Height="525" />
    </Grid.RowDefinitions>
    <Button HorizontalAlignment="Left" Margin="22,20,0,24" Name="backButton" Width="75" Content="&lt;"></Button>
    <Button HorizontalAlignment="Left" Margin="116,20,0,24" Name="nextButton" Width="75" Content="&gt;"></Button>
    
  3. 生成项目。

创建数据绑定控件

通过将 Customers 节点从**“数据源”**窗口拖动到设计器中,创建显示客户记录的控件。

创建数据绑定控件

  1. 在**“数据源”窗口中,单击“Customers”节点的下拉菜单,并选择“详细信息”**。

  2. 展开**“Customers”**节点。

  3. 在本示例中,由于一些字段不会显示,因此单击以下节点旁边的下拉菜单并选择**“无”**:

    • NameStyle

    • PasswordHash

    • PasswordSalt

    • rowguid

    此操作将阻止 Visual Studio 在将控件拖到设计器上时为这些节点创建控件。 对于本演练,假定最终用户不需要查看此数据。

  4. 从**“数据源”窗口中,将“Customers”**节点拖动到按钮下面的设计器。

    Visual Studio 将生成 XAML,以及用于创建绑定到客户数据的一组控件的代码。

从服务中加载数据

使用服务来加载数据,然后将返回的数据分配给绑定到控件的数据源。

从服务中加载数据

  1. 在设计器中,单击某个按钮旁边的空区域。

  2. 在**“属性”窗口中,验证“UserControl”是否处于选定状态,然后单击“事件”**选项卡。

  3. 找到**“Loaded”**事件并双击该事件。

  4. 在打开的代码文件 (MainPage.xaml) 中,添加以下 using (C#) 或 Imports (Visual Basic) 语句:

    Imports System.Windows.Data
    Imports AdventureWorksSilverlightApp.AdventureWorksService
    
    using System.Windows.Data;
    using AdventureWorksSilverlightApp.AdventureWorksService;
    
  5. 用下面的代码替换该事件处理程序。 确保用您的开发计算机上的本地主机地址替换此代码中的 localhost 地址:

    Private advWorksService As AdventureWorksLTEntities
    Private customersViewSource As CollectionViewSource
    
    Private Sub UserControl_Loaded(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles MyBase.Loaded
        advWorksService = New AdventureWorksLTEntities(New Uri("https://localhost:6188/AdventureWorksDataService.svc"))
        customersViewSource = Me.Resources("CustomersViewSource")
        advWorksService.Customers.BeginExecute(Sub(result As IAsyncResult)
                                                   customersViewSource.Source = advWorksService.Customers.EndExecute(result)
                                               End Sub, Nothing)
    End Sub
    
    private AdventureWorksLTEntities advWorksService;
    private System.Windows.Data.CollectionViewSource customersViewSource;
    
    private void UserControl_Loaded(object sender, RoutedEventArgs e)
    {
        advWorksService = new AdventureWorksLTEntities(new Uri("https://localhost:54961/AdventureWorksDataService.svc"));
    
        customersViewSource = this.Resources["customersViewSource"]
        as System.Windows.Data.CollectionViewSource;
        advWorksService.Customers.BeginExecute(result => customersViewSource.Source = advWorksService.Customers.EndExecute(result), null);
    }
    

测试应用程序

生成并运行应用程序,以验证您是否能够查看客户记录。

测试应用程序

  1. 在**“生成”菜单上,单击“生成解决方案”**。 验证解决方案已生成且未发生错误。

  2. 按 F5。

  3. 验证 Customers 表中的第一条记录是否显示。

  4. 关闭应用程序。

    备注

    如果在此处看到错误,请验证代码是否包含 ASP.NET Development Server 的正确端口。

导航记录

添加可通过使用**“<”“>”**按钮来浏览记录的代码。

使用户能够导航销售记录

  1. 在设计器中打开 MainPage.xaml,并双击**“<”**按钮。

  2. 用下面的代码替换生成的 backButton_Click 事件处理程序:

    Private Sub backButton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles backButton.Click
        customersViewSource.View.MoveCurrentToPrevious()
        If customersViewSource.View.IsCurrentBeforeFirst Then
            customersViewSource.View.MoveCurrentToFirst()
        End If 
    End Sub
    
    private void backButton_Click(object sender, RoutedEventArgs e)
    {
        customersViewSource.View.MoveCurrentToPrevious();
        if (customersViewSource.View.IsCurrentBeforeFirst)
            customersViewSource.View.MoveCurrentToFirst();
    }
    
  3. 返回到设计器,并双击 > 按钮。

    Visual Studio 将打开代码隐藏文件,并创建新的 nextButton_Click 事件处理程序。

  4. 用下面的代码替换生成的 nextButton_Click 事件处理程序:

    Private Sub nextButton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles nextButton.Click
        customersViewSource.View.MoveCurrentToNext()
        If customersViewSource.View.IsCurrentAfterLast Then
            customersViewSource.View.MoveCurrentToLast()
        End If 
    End Sub
    
    private void nextButton_Click(object sender, RoutedEventArgs e)
    {
        customersViewSource.View.MoveCurrentToNext();
        if (customersViewSource.View.IsCurrentAfterLast)
            customersViewSource.View.MoveCurrentToLast();
    }
    

测试应用程序

生成并运行应用程序,以验证您是否能够查看和导航客户记录。

测试应用程序

  1. 在**“生成”菜单上,单击“生成解决方案”**。 验证解决方案已生成且未发生错误。

  2. 按 F5。

  3. 验证 Customers 表中的第一条记录是否显示。

  4. 单击**“<”“>”**按钮,向前和向后浏览客户记录。

  5. 关闭应用程序。

    备注

    如果在此处看到错误,请验证代码是否包含 ASP.NET Development Server 的正确端口。

后续步骤

完成本演练后,您可以执行以下相关任务:

  • 了解如何将更改保存回数据库。 有关更多信息,请参见 Data Binding(数据绑定)。

  • 了解如何使用 Silverlight 应用程序中的 WCF 数据服务结合更多功能。 有关更多信息,请参见 ADO.NET 数据服务 (Silverlight)

请参见

其他资源

Data Access and Data Structures(数据访问和数据结构)