Demonstra Passo a passo: Controles do WPF de ligação a um Dataset

Esta explicação passo a passo, você criará um aplicativo do WPF que contém os controles ligados a dados. Os controles são vinculados aos registros de produtos que são encapsulados em um dataset. Você também irá adicionar botões para navegar em produtos e salvar alterações em registros de produtos.

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

• Criando um aplicativo WPF e um dataset que é gerado a partir de dados no banco de dados de exemplo AdventureWorksLT.

• A criação de um conjunto de controles vinculados a dados arrastando uma tabela de dados a partir de Fontes de dados janela para uma janela no WPF Designer.

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

• Criar um botão que salva as alterações feitas pelos usuários para os registros de produto para a tabela de dados e fonte de dados subjacente.

  Observação
  Seu computador pode mostrar diferentes nomes ou localizações para alguns dos elementos de 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 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 de SQL Server ou SQL Server Express tem o banco de dados de exemplo AdventureWorksLT anexado a ele. 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:

• DataSets e TableAdapters. Para obter mais informações, consulte Trabalhando com conjuntos de dados Visual Studio e Visão geral do TableAdapter.

• Trabalhando com o WPF Designer. Para obter mais informações, consulte Visão geral do WPF e do Silverlight Designer.

• Vinculação de dados do WPF. Para obter mais informações, consulte Revisão de Associação de Dados.

Criando o projeto

Crie um novo projeto do WPF. O projeto irá exibir os registros de produto.

Para criar o projeto

1. Inicie o Visual Studio.

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

3. Expanda Visual Basic ou **Visual C#**e selecione Windows.

4. Selecione o Aplicativo WPF o modelo de projeto.

5. No nome , digite AdventureWorksProductsEditor e clique em OK.

   Visual Studio cria o AdventureWorksProductsEditor project.

Criando um Dataset para o aplicativo.

Antes de criar controles ligados a dados, você deve definir um modelo de dados para seu aplicativo e adicioná-lo para o Fontes de dados janela. Esta explicação passo a passo, você pode criar um dataset para usar como modelo de dados.

Para criar um dataset.

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

   A janela Data Sources é aberta.

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

   O Data Source Configuration Wizard é aberto.

3. Sobre o Escolher um tipo de fonte de dados página, selecione banco de dadose, em seguida, clique em próximo.

4. Sobre o Escolher um modelo de banco de dados página, selecione Datasete em seguida, clique em próximo.

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 e clique em próximo.

     - ou -

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

6. Sobre o Save the Connection String no arquivo de configurar o aplicativo página, selecione o Yes, save the connection as caixa de seleção e clique em próxima.

7. No Escolha seus objetos de banco de dados de página, expanda tabelase selecione o o produto (SalesLT) tabela.

8. Clique em Finish.

   Visual Studio adiciona um novo arquivo de AdventureWorksLTDataSet.xsd para o projeto e adiciona um correspondente AdventureWorksLTDataSet item para o Fontes de dados janela. O arquivo de AdventureWorksLTDataSet.xsd define um dataset tipado chamado AdventureWorksLTDataSet e um TableAdapter chamado ProductTableAdapter. Posteriormente nesta explicação passo a passo, você usará o ProductTableAdapter para preencher o dataset com dados e salvar as alterações de volta para o banco de dados.

9. Crie o projeto.

Editando o método de preenchimento de padrão do TableAdapter

Para preencher o dataset com dados, use o Fill método de ProductTableAdapter. Por padrão, o Fill método preenchimentos a ProductDataTable na AdventureWorksLTDataSet com todas as linhas de dados da tabela Produtos. Você pode modificar esse método para retornar apenas um subconjunto das linhas. Para esta explicação, modificar o Fill método para retornar somente linhas de produtos que têm fotos.

Para carregar as linhas de produto que tem fotos

1. Em Solution Explorer, duas vezes no arquivo AdventureWorksLTDataSet.xsd.

   O Dataset designer abre.

2. No designer, clique com o botão direito do Fill,GetData() de consulta e selecione Configure.

   O TableAdapter Configuration Wizard abre.

3. No Enter uma instrução SQL página, adicione a seguinte cláusula WHERE após o SELECT a instrução na caixa de texto.

   WHERE ThumbnailPhotoFileName <> 'no_image_available_small.gif'
   

4. Clique em Finish.

Definindo a Interface do usuário

Adicione vários botões na janela, modificando o XAML no WPF Designer. Posteriormente nesta explicação passo a passo, você irá adicionar código que permite aos usuários rolar através de e salvar as alterações nos registros de produtos usando esses botões.

Para definir a interface do usuário da janela

1. Em Solution Explorer, clique duas vezes em MainWindow. XAML.

   A janela é aberta no WPF Designer.

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

   <Grid.RowDefinitions>
       <RowDefinition Height="75" />
       <RowDefinition Height="625" />
   </Grid.RowDefinitions>
   <Button HorizontalAlignment="Left" Margin="22,20,0,24" Name="backButton" Width="75">&lt;</Button>
   <Button HorizontalAlignment="Left" Margin="116,20,0,24" Name="nextButton" Width="75">&gt;</Button>
   <Button HorizontalAlignment="Right" Margin="0,21,46,24" Name="saveButton" Width="110">Save changes</Button>
   

3. Crie o projeto.

Criando controles vinculados a dados

Criar controles que exibem os registros de clientes, arrastando o produto tabela da Fontes de dados janela para o WPF Designer.

Para criar controles ligados a dados

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

2. Expanda o produto 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:

   • ProductCategoryID

   • ProductModelID

   • ThumbnailPhotoFileName

   • ROWGUID

   • ModifiedDate

4. Clique no menu drop-down ao lado do ThumbNailPhoto nó e selecione imagem.

   Observação
   Por padrão, itens na Fontes de dados janela que representam imagens têm seu controle padrão definido para Nenhum. Isso ocorre porque as imagens são armazenadas como matrizes de bytes em bancos de dados e matrizes de bytes podem conter desde uma simple matriz de bytes para o arquivo executável de um aplicativo grande.

5. Do Fontes de dados janela, arraste o produto o nó para a linha de grade em linha que contém os botões.

   Visual Studio gera o XAML que define um conjunto de controles ligados a dados a produtos tabela. Ele também gera o código que carrega os dados. Para obter mais informações sobre o XAML e o código gerado, consulte Controles do WPF de ligação a dados em Visual Studio.

6. No designer, clique na caixa de texto ao lado do Identificação do produto rótulo.

7. No Propriedades janela, selecione a caixa de seleção ao lado do IsReadOnly propriedade.

Navegar pelos registros de produto

Adicione código que permite aos usuários percorrer os registros de produtos usando o < e > botões.

Para permitir aos usuários navegar pelos registros de produto

1. No designer, clique duas vezes o < o botão na superfície de janela.

   Visual Studio abre o arquivo de code-behind e cria um novo backButton_Click o manipulador de eventos para o Click de evento.

2. Modificar o Window_Loaded manipulador de eventos para que as ProductViewSource, AdventureWorksLTDataSet, e AdventureWorksLTDataSetProductTableAdapter estão fora do método e acessível para o formulário inteiro. Apenas esses declarar globais para o formulário, atribuí-los dentro do Window_Loaded manipulador de eventos similar à seguinte:

   Dim ProductViewSource As System.Windows.Data.CollectionViewSource
   Dim AdventureWorksLTDataSet As AdventureWorksProductsEditor.AdventureWorksLTDataSet
   Dim AdventureWorksLTDataSetProductTableAdapter As AdventureWorksProductsEditor.AdventureWorksLTDataSetTableAdapters.ProductTableAdapter
   
   Private Sub Window_Loaded(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles MyBase.Loaded
       AdventureWorksLTDataSet = CType(Me.FindResource("AdventureWorksLTDataSet"), AdventureWorksProductsEditor.AdventureWorksLTDataSet)
       'Load data into the table Product. You can modify this code as needed.
       AdventureWorksLTDataSetProductTableAdapter = New AdventureWorksProductsEditor.AdventureWorksLTDataSetTableAdapters.ProductTableAdapter()
       AdventureWorksLTDataSetProductTableAdapter.Fill(AdventureWorksLTDataSet.Product)
       ProductViewSource = CType(Me.FindResource("ProductViewSource"), System.Windows.Data.CollectionViewSource)
       ProductViewSource.View.MoveCurrentToFirst()
   End Sub
   

   private AdventureWorksProductsEditor.AdventureWorksLTDataSet AdventureWorksLTDataSet;
   private AdventureWorksProductsEditor.AdventureWorksLTDataSetTableAdapters.ProductTableAdapter adventureWorksLTDataSetProductTableAdapter;
   private System.Windows.Data.CollectionViewSource productViewSource;
   
   private void Window_Loaded(object sender, RoutedEventArgs e)
   {
       AdventureWorksLTDataSet = ((AdventureWorksProductsEditor.AdventureWorksLTDataSet)(this.FindResource("adventureWorksLTDataSet")));
       // Load data into the table Product. You can modify this code as needed.
       adventureWorksLTDataSetProductTableAdapter = new AdventureWorksProductsEditor.AdventureWorksLTDataSetTableAdapters.ProductTableAdapter();
       adventureWorksLTDataSetProductTableAdapter.Fill(AdventureWorksLTDataSet.Product);
       productViewSource = ((System.Windows.Data.CollectionViewSource)(this.FindResource("productViewSource")));
       productViewSource.View.MoveCurrentToFirst();
   }
   

3. Adicione o seguinte código para o manipulador de eventos backButton_Click:

   If ProductViewSource.View.CurrentPosition > 0 Then
       ProductViewSource.View.MoveCurrentToPrevious()
   End If
   

   if (productViewSource.View.CurrentPosition > 0)
   {
       productViewSource.View.MoveCurrentToPrevious();
   }
   

4. Retornar ao designer e clique duas vezes o > botão.

5. Adicione o seguinte código para o manipulador de eventos nextButton_Click:

   If ProductViewSource.View.CurrentPosition < CType(ProductViewSource.View, CollectionView).Count - 1 Then
       ProductViewSource.View.MoveCurrentToNext()
   End If
   

   if (productViewSource.View.CurrentPosition < ((CollectionView)productViewSource.View).Count - 1)
   {
       productViewSource.View.MoveCurrentToNext();
   }
   

Salvando alterações em registros de produtos

Adicione código que permite aos usuários salvar as alterações para registros de produtos usando o Salvar as alterações botão.

Para adicionar a capacidade de salvar as alterações em registros de produtos

1. No designer, clique duas vezes o Salvar alterações botão.

   Visual Studio abre o arquivo de code-behind e cria um novo saveButton_Click o manipulador de eventos para o Click de evento.

2. Adicione o seguinte código para o manipulador de eventos saveButton_Click:

   AdventureWorksLTDataSetProductTableAdapter.Update(AdventureWorksLTDataSet.Product)
   

   adventureWorksLTDataSetProductTableAdapter.Update(AdventureWorksLTDataSet.Product);
   

   Observação

   Este exemplo usa a Save método de TableAdapter para salvar as alterações. Isso é adequado para esta explicação passo a passo, porque a tabela de dados apenas uma está sendo alterada. Se você precisar salvar alterações em várias tabelas de dados, você também pode usar o UpdateAll método o TableAdapterManager que Visual Studio gera com o dataset. Para obter mais informações, consulte Visão geral do TableAdapterManager.

Testando o aplicativo

Criar e executar o aplicativo. Verifique se você pode exibir e atualizar registros de produto.

Para testar o aplicativo

1. Pressione F5.

   O aplicativo é compilada e executada. Verifique o seguinte:

   • As caixas de texto exibem dados do primeiro registro de produto que tem uma foto. Este produto tem o produto 713 de ID e o nome Jersey do logotipo de manga longa, S.

   • Você pode clicar a > ou < os botões para navegar pelos registros de outros produtos.

2. Em um dos registros de produtos, alterar o tamanho valor e, em seguida, clique em Salvar as alterações.

3. Feche o aplicativo e reiniciá-lo pressionando F5 em Visual Studio.

4. Navegue até o registro de produto que você alterou e verificar que a alteração será mantida.

5. Feche o aplicativo.

Próximas etapas

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

• Saiba como usar o Fontes de dados janela no Visual Studio para ligar o WPF controla a outros tipos de fontes de dados. Para obter mais informações, consulte Demonstra Passo a passo: A vinculação de controles do WPF para um serviço de dados do WCF e Demonstra Passo a passo: A vinculação de controles do WPF para um modelo de dados de entidade.

• Saiba como usar o Fontes de dados janela no Visual Studio para exibir dados relacionados (ou seja, os dados em uma relação pai-filho) controles do WPF. Para obter mais informações, consulte Demonstra Passo a passo: Exibindo dados relacionados em um aplicativo WPF.

Consulte também

Tarefas

Como: Vincular controles WPF dados em Visual Studio

Demonstra Passo a passo: A vinculação de controles do WPF para um modelo de dados de entidade

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

Conceitos

Controles do WPF de ligação a dados em Visual Studio

Trabalhando com conjuntos de dados Visual Studio

Visão geral do WPF e do Silverlight Designer

Revisão de Associação de Dados