演练：将 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 数据服务的空 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（数据访问和数据结构）