Compartilhar via


Demonstra Passo a passo: A vinculação de controles do Silverlight para um serviço de dados do WCF

Esta explicação passo a passo, você criará um aplicativo do Silverlight que contém os controles ligados a dados. Os controles estão vinculados para registros de clientes, acessados através de um WCF Data Services.

Essa explicação passo a passo ilustra as seguintes tarefas:

  • Criando um Modelo de Dados de Entidade que é gerada a partir de dados no banco de dados de exemplo AdventureWorksLT.

  • Criando um WCF Data Services que expõe os dados do Modelo de Dados de Entidade para um aplicativo do Silverlight.

  • Executando o Data Source Configuration Wizard para se conectar ao serviço de dados que preenche a Fontes de dados janela.

  • A criação de um conjunto de controles ligados a dados, arrastando itens da Fontes de dados janela para o Silverlight Designer.

  • Criando botões navegam para frente e para trás através de registros.

    ObservaçãoObservação

    Seu computador pode mostrar diferentes nomes ou localizações para alguns do Visual Studio elementos de interface do usuário as instruções a seguir. O Visual Studio edição que você tem e as configurações que você usar determinam esses elementos. Para obter mais informações, consulte Trabalhando com configurações.

Pré-requisitos

Para completar este passo a passo, são necessários os seguintes componentes:

  • Visual Studio 2010.

  • Acesso a uma instância em execução SQL Server ou SQL Server, Express que tem o banco de dados de exemplo AdventureWorksLT anexado ao proprietário. Você pode baixar o banco de dados de AdventureWorksLT a site CodePlex da.

Conhecimento prévio dos seguintes conceitos também é útil, mas não é necessária para concluir o passo a passo:

Criando o projeto de serviço

Iniciar esta explicação passo a passo, criando um projeto de aplicação web vazia ao host uma WCF Data Services.

Para criar o projeto de serviço

  1. No menu File, aponte para New, e em seguida, clique em Project.

  2. Expanda Visual C# ou Visual Basice selecione Web.

  3. Selecione o ASP.NET vazio Web Application o modelo de projeto.

  4. No nome , digite AdventureWorksWebApp e, em seguida, clique em OK.

Criando um modelo de dados de entidade para o serviço.

Para expor os dados para um aplicativo usando um WCF Data Services, um modelo de dados deve ser definido para o serviço. Nesta explicação, criar um Modelo de Dados de Entidade.

Para criar um modelo de dados de entidade

  1. No menu Project, clique em Add New Item.

  2. Selecione o ADO.Modelo de dados de entidade NET o item de projeto.

  3. Altere o nome para AdventureWorksDataModel.edmxe em seguida, clique em Add.

    O Assistente de modelo de dados de entidade abre.

  4. Sobre o Escolher o modelo de conteúdo página, clique em gerar do banco de dadose, em seguida, clique em próxima.

  5. Sobre o Choose Your Data Connection de página, selecione uma das seguintes opções:

    • Se uma conexão de dados no banco de dados de amostra de AdventureWorksLT estiver disponível na lista suspensa, selecione-o.

      ou

    • Clique em Nova conexão e crie uma conexão ao banco de dados AdventureWorksLT.

  6. Verifique o Salvar configurações de conexão de entidade em Web. config, como opção é selecionada e clique em próximo.

  7. Sobre o Escolha seus objetos de banco de dados página, expanda tabelase selecione o cliente tabela.

  8. Clique em Finish.

Criando o serviço

Criar um WCF Data Services para expor os dados de Modelo de Dados de Entidade.

Para criar o serviço.

  1. No menu Project, selecione Add New Item.

  2. Selecione o O serviço do WCF dados o item de projeto.

  3. No nome , digite AdventureWorksDataService.svc e, em seguida, clique em Add.

Configurando o serviço

Você deve configurar o serviço para operar o Modelo de Dados de Entidade que você criou.

Para configurar o serviço

  1. No AdventureWorksDataService.svc o arquivo de código, substitua o AdventureWorksDataService classe declaração com o seguinte código:

    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. Compile o projeto e verifique se ele foi compilado sem erros.

Criando o aplicativo do Silverlight

Criar um novo aplicativo do Silverlight e, em seguida, adicione uma fonte de dados para acessar o serviço.

Para criar o aplicativo do Silverlight

  1. Em Solution Explorer, o botão direito do mouse no nó da solução, clique em Adde selecione Novo projeto.

    ObservaçãoObservação

    Em projetos de Visual Basic, o nó de solução aparece apenas na Solution Explorer quando o Always show solution caixa de seleção estiver marcada na Geral, projetos e soluções, caixa de diálogo Options.

  2. No Novo projeto caixa de diálogo, expanda Visual C# ou Visual Basice selecione Silverlight.

  3. Selecione o Aplicativo do Silverlight o modelo de projeto.

  4. No nome , digite AdventureWorksSilverlightApp e, em seguida, clique em OK.

  5. No Novo aplicativo do Silverlight caixa de diálogo, clique em OK.

Adicionando a fonte de dados ao aplicativo do Silverlight

Crie uma fonte de dados é baseada nos dados retornados pelo serviço.

Para criar o DataSet

  1. No menu Data, clique em Show Data Sources.

  2. Na janela Data Sources, clique em Add New Data Source.

    O Data Source Configuration Wizard é aberto.

  3. No Escolher um tipo de fonte de dados página do assistente, selecione Service e, em seguida, clique em próximo.

  4. Na caixa Adicionar serviço de referência caixa de diálogo, clique em Descubra .

    Visual Studioprocura a solução atual para os serviços disponíveis e, em seguida, adiciona AdventureWorksDataService.svc à lista de serviços disponíveis na serviços caixa.

  5. No Namespace , digite AdventureWorksService.

  6. No serviços , clique em AdventureWorksDataService.svc e, em seguida, clique em OK.

  7. No Add Service Reference página, clique em Concluir.

    Visual Studio adiciona nós que representam os dados retornados pelo serviço para o Fontes de dados janela.

Definindo a Interface do usuário da janela

Adicionar botões à janela modificando o XAML na Silverlight Designer.

Para criar o layout de janela

  1. Em Solution Explorer, clique duas vezes em MainPage.xaml.

    A janela é aberta do Silverlight Designer.

  2. No XAML Exibir do designer, adicione o seguinte código entre o <Grid> marcas:

    <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. Crie o projeto.

Criação de controles ligados a dados

Criar controles que exibem os registros de clientes, arrastando o os clientes nó a partir do Fontes de dados janela para o designer.

Para criar os controles ligados a dados

  1. No Fontes de dados janela, clique no menu drop-down para o os clientes nó e selecione detalhes.

  2. Expanda o os clientes nó.

  3. Neste exemplo, alguns campos não serão exibidos assim, clique em menu drop-down ao lado de nós a seguir e selecione Nenhum:

    • NameStyle

    • PasswordHash

    • PasswordSalt

    • ROWGUID

    Isso impede que Visual Studio criar controles para esses nós quando eles são descartados no designer. Para esta explicação passo a passo, presume-se que o usuário final não deseja ver esses dados.

  4. Da Fontes de dados janela, arraste o os clientes o nó para o designer sob os botões.

    Visual Studiogera XAML e o código que cria um conjunto de controles que são acoplados a dados do cliente.

Carregar os dados do serviço

Usar o serviço para carregar os dados e, em seguida, atribuir os dados retornados para a fonte de dados é vinculada aos controles.

Para carregar os dados do serviço

  1. No designer, clique em uma área vazia em um dos botões.

  2. No Propriedades janela, verifique se a UserControl está selecionada e clique no eventos guia.

  3. Localize o Loaded evento e clique duas vezes nele.

  4. No arquivo de código aberto (MainPage.xaml) adicione o seguinte using (C#) ou Imports (Visual Basic) instruções:

    Imports System.Windows.Data
    Imports AdventureWorksSilverlightApp.AdventureWorksService
    
    using System.Windows.Data;
    using AdventureWorksSilverlightApp.AdventureWorksService;
    
  5. Substitua o manipulador de eventos com o código a seguir. Certifique-se de que você substitua o localhost endereço nesse código, com o endereço de host local no computador de desenvolvimento:

    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);
    }
    

Testando o aplicativo

Construir e executar o aplicativo para verificar o que você pode exibir registros de clientes.

Para testar o aplicativo

  1. Em Build menu, clique em Build Solution. Verifique se que a solução foi compilado sem erros.

  2. Pressione F5.

  3. Verifique se que o primeiro registro na tabela Customers aparece.

  4. Feche o aplicativo.

    ObservaçãoObservação

    Se você vir um erro aqui é verificar que o código contém a porta correta para seu aplicativo ASP.NET Development Server.

Adicione código que permite rolar registros usando o < e > botões.

Para permitir aos usuários navegar pelos registros de vendas

  1. Abra MainPage.xaml no designer e clique duas vezes o < botão.

  2. Substitua o gerado backButton_Click o manipulador de eventos com o seguinte código:

    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. Retornar ao designer e clique duas vezes o > botão.

    Visual StudioAbre o arquivo de code-behind e cria um novo nextButton_Click manipulador de eventos.

  4. Substitua o gerado nextButton_Click o manipulador de eventos com o seguinte código:

    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();
    }
    

Testando o aplicativo

Construir e executar o aplicativo para verificar que você pode exibir e navegar pelos registros de cliente.

Para testar o aplicativo

  1. Em Build menu, clique em Build Solution. Verifique se que a solução foi compilado sem erros.

  2. Pressione F5.

  3. Verifique se que o primeiro registro na tabela Customers aparece.

  4. Clique na < e > botões para voltar e Avançar pelos registros de cliente.

  5. Feche o aplicativo.

    ObservaçãoObservação

    Se você vir um erro aqui é verificar que o código contém a porta correta para seu aplicativo ASP.NET Development Server.

Próximas etapas

Depois de concluir este passo a passo, você pode executar as seguintes tarefas:

Consulte também

Outros recursos

Acesso a dados e estruturas de dados