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

  • Artigo

Em essa explicação passo a passo, você criará um aplicativo do Silverlight que contém controles associados a dados.Os controles são associados aos registros de clientes acessados com WCF Data Services.

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

  • Criando Modelo de Dados de Entidade que é gerado de dados no banco de dados de exemplo AdventureWorksLT.

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

  • Executando Assistente para Configuração de Fonte de Dados para se conectar ao serviço de dados que preenche a janela de Fontes de Dados .

  • Criando um conjunto de controles associados a dados arrastando itens da janela de Fontes de Dados a Silverlight Designer.

  • Criando os botões que navegam registros de módulos dianteiros e compatível.

    ObservaçãoObservação

    Seu computador pode mostrar nomes ou locais diferentes para alguns dos elementos da interface do usuário do Visual Studio nas instruções a seguir. A edição do Visual Studio que você possui e as configurações que você usa determinam esses elementos. Para obter mais informações, consulte Configurações de Visual Studio.

Pré-requisitos

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

  • Visual Studio

  • Acesso a uma instância em execução de SQL Server ou SQL Server Express que tenha o banco de dados de exemplo AdventureWorksLT anexou-lhe.Você pode baixar o banco de dados AdventureWorksLT de site de CodePlex.

O conhecimento prévio dos seguintes conceitos também é útil, mas não necessário para concluir a explicação passo a passo:

Criando o projeto de serviço

Iniciar este explicação passo a passo criar um novo projeto de aplicativo web vazio hospedar 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 Basic, selecione Web.

  3. Selecione o modelo de projeto de Vazia aplicativo da Web do ASP.NET .

  4. Em a caixa de Nome , o tipo AdventureWorksWebApp e clique em OK.

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

Para expor dados a um aplicativo usando WCF Data Services, um modelo de dados deve ser definido para o serviço.Em essa explicação passo a passo, crie 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 item de projeto de Modelo de entidade de dados ADO.NET .

  3. Altere o nome para AdventureWorksDataModel.edmx, clique em Adicionar.

    Assistente de modelo de dados de entidade Abre.

  4. Em a página de Escolha o conteúdo modelo , clique em Gere de banco de dados, e clique em Avançar.

  5. Em a página de Escolha a Conexão de Dados , selecione uma das seguintes opções:

    • Se uma conexão de dados ao banco de dados de exemplo AdventureWorksLT está disponível na lista suspensa, selecione.

      ou

    • Clique Nova conexão e criar uma conexão para o banco de dados AdventureWorksLT.

  6. Verifique se a opção de Salvar configurações de conexão de entidade em Web.Config como está selecionada e clique em Avançar.

  7. Em a página de Escolher Objetos do Banco de Dados , expanda Tabelas, selecione a tabela de cliente .

  8. Clique em Concluir.

Criando o serviço

Crie WCF Data Services para expor os dados em Modelo de Dados de Entidade.

Para criar o serviço

  1. No menu Project, selecione Add New Item.

  2. Selecione o item de projeto de Serviço de dados WCF .

  3. Em a caixa de NomeAdventureWorksDataService.svc , digite e clique em Adicionar.

Configurando o serviço

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

Para configurar o serviço

  1. Em o arquivo de código de AdventureWorksDataService.svc , substitua a declaração de classe de AdventureWorksDataService 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. Compilar o projeto, e verifique que compila sem erros.

Criando o aplicativo Silverlight

Crie um novo aplicativo do Silverlight, e então adicione uma fonte de dados para acessar o serviço.

Para criar o aplicativo do Silverlight

  1. Em Gerenciador de Soluções, clique com o botão direito do mouse no nó da solução, clique Adicionar, e selecione Novo Projeto.

  2. Em a caixa de diálogo de Novo Projeto , expanda Visual C# ou Visual Basic, selecione Silverlight.

  3. Selecione o modelo de projeto de Silverlight aplicativo .

  4. Em a caixa de Nome , o tipo AdventureWorksSilverlightApp e clique em OK.

  5. Em a caixa de diálogo de Novo aplicativo do Silverlight , clique OK.

Adicionar uma fonte de dados para o aplicativo do Silverlight

Crie uma fonte de dados que é baseado 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. Em a página de Escolher um Tipo de Fonte de Dados do assistente, Serviço selecione e clique em Avançar.

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

    Visual Studio procura a solução atual por serviços disponíveis, e adiciona AdventureWorksDataService.svc à lista de serviços disponíveis na caixa de Serviços .

  5. Em a caixa de Namespace , digite AdventureWorksService.

  6. Em a caixa de Serviços , clique em AdventureWorksDataService.svc e clique em OK.

  7. Em a página de Adicionar referência de serviço , clique Concluir.

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

Definindo a interface do usuário da janela

Adicionar botões à janela alterando XAML em Silverlight Designer.

Para criar o layout da janela

  1. Em Gerenciador de Soluções, clique duas vezes MainPage.xaml.

    A janela é aberta em Silverlight Designer.

  2. Em o modo de XAML o designer, adicione o seguinte código entre as marcas de <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. Crie o projeto.

Criando controles associados a dados

Criar controles que exibem registros de clientes arrastando o nó de clientes da janela de Fontes de Dados para o designer.

Para criar controles associados a dados

  1. Em a janela de Fontes de Dados , clique no menu drop-down para o nó de clientes e selecione Detalhes.

  2. Expanda o nó de clientes .

  3. Para esse exemplo alguns campos não serão exibidos então clique no menu suspenso próximo dos nós e selecione Nenhum:

    • NameStyle

    • PasswordHash

    • PasswordSalt

    • rowguid

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

  4. De a janela de Fontes de Dados , arraste o nó de clientes o designer nos botões.

    Visual Studio gera XAML e o código que cria um conjunto de controles associados a dados do cliente.

Carregar os dados de serviço

Use o serviço para carregar dados, e depois atribua os dados retornados para a fonte de dados associada aos controles.

Para carregar os dados de serviço

  1. Em o designer, clique em uma área vazia ao lado de um dos botões.

  2. Em a janela de Propriedades , verifique UserControl é selecionado e clique na guia de Eventos .

  3. Localize o evento de Carregado clique duas vezes em.

  4. Em o código que abre o arquivo ()MainPage.xamlseguir adiciona using (C#) ou instruções de Imports (Visual Basic):

    Imports System.Windows.Data
Imports AdventureWorksSilverlightApp.AdventureWorksService

    using System.Windows.Data;
using AdventureWorksSilverlightApp.AdventureWorksService;

  5. Substitua o manipulador de eventos pelo código a seguir.Certifique-se de que você substituir o endereço de localhost em esse código com o endereço do host local no seu 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

Compilar e executar o aplicativo para verificar que você possa exibir registros de clientes.

Para testar o aplicativo

  1. Em o menu de Compilar , clique em Compilar solução.Verifique se a solução compile sem erros.

  2. Pressione F5.

  3. Verifique o primeiro registro na tabela clientes que aparece.

  4. Feche o aplicativo.

    ObservaçãoObservação

    Se você ver um erro aqui verifique se o código contém o correto move para o servidor de desenvolvimento do ASP.NET.

Adicione código que permite rolagem pelos registros usando botões < e >.

Para permitir que os usuários naveguem entre registros de vendas

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

  2. Substitua o manipulador de eventos gerado de backButton_Click 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, clique duas vezes no botão >.

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

  4. Substitua o manipulador de eventos gerado de nextButton_Click 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

Compilar e executar o aplicativo para verificar que você possa exibir e navegar em registros de clientes.

Para testar o aplicativo

  1. Em o menu de Compilar , clique em Compilar solução.Verifique se a solução compile sem erros.

  2. Pressione F5.

  3. Verifique o primeiro registro na tabela clientes que aparece.

  4. Clique nos botões < e > para navegar para trás e encaminhar-la através de registros de cliente.

  5. Feche o aplicativo.

    ObservaçãoObservação

    Se você ver um erro aqui verifique se o código contém o correto move para o servidor de desenvolvimento do ASP.NET.

Próximas etapas

Após concluir essa explicação passo a passo, você pode executar as seguintes tarefas relacionadas:

  • Aprender como salvar alterações de volta para o banco de dados.Para obter mais informações, consulte Associação de Dados.

  • Aprender como incorporar mais recursos usando WCF Data Services em aplicativos do Silverlight.Para obter mais informações, consulte Serviços de dados ADO.NET) (Silverlight.

Consulte também

Outros recursos

acesso a dados e estruturas de dados