Data Binding é uma ótima maneira de exibir seus dados. Este tutorial vai te ensinar passo-a-passo o básico sobre Data Binding. Se você já está familiarizado com Data Binding você pode pular este tutorial.

O Que é Data Binding

Data Binding fornece uma maneira simples e consistente para aplicações de apresentarem e interagirem com os dados. Elementos podem ser vinculados à dados de uma variedade de fontes de dados na forma de objetos Common Language Runtime(CLR) e XML. ContentControls como "Button" e ItemsControls como "ListBox" e "ListView" tem funcionalidades internas para permitir um estilo flexível de itens de dados individuais ou coleções de itens de dados. Ordenar, filtrar, e agrupar pode ser gerado sobre os dados.

Começar

Para explicar os conceitos básicos de Data Binding, vamos criar uma aplicação simples do Windows Phone 7. Esta aplicação contém quatro caixas de texto que irá mostrar as três formas de Data Binding :

  • OneTime
  • OneWay
  • TwoWay

O que eles significam ?

OneTime faz a ligação dos dados enviados da origem para o destino, no entanto, ele faz isso apenas quando o aplicativo é iniciado ou quando há mudanças no DataContext e, como resultado, não "escuta" às notificações de alteração na fonte.

Quando utiliza OneWay há ligação dos fluxos de dados da origem para o destino cada vez que uma alteração é feita na fonte. OneWay liga o modo padrão de ligação para a propriedade Text do "TextBlock" e não precisa ser especificado.

TwoWay envia os dados da origem para o destino, e se houver alterações no valor da propriedade de destino, estes serão enviados de volta para à origem.

Vamos criar um rascunho da aplicação. Para esta demonstração. Vou usar o Expression Blend, porque suporta ferramentas baseadas em XAML, especialmente o Data Binding, é bom e tanto designers como os desenvolvedores podem tirar proveito dela.

Nomeie os projetos que você quiser. Depois que o Blend termina a criação do projeto, vamos ver à seguinte tela:

Para mostrar a funcionalidade dos três Data Bindings vamos colocar quatro caixas de texto em nossas superfícies de design de navegação. A primeira caixa de texto será a origem, a segunda caixa vai demonstrar à ligação OneTime, a terceira caixa de texto à ligação OneWay, e a última caixa de texto à ligação TwoWay. O aplicativo agora deve ser algo como isto:

Agora vamos para à parte emocionante. Clique na segunda caixa de texto à partir do topo. Você deverá ver a janela de Propriedades (se não ver a janela, vá ao menu e selecione a opção Properties). Na janela de Propriedades vá para Common Properties onde você pode encontrar a propriedade Text. À direita você pode ver um pequeno ponto branco. Clique nele e no menu de contexto, escolha Data Binding ...

Agora você deve ver o menu Create Data Binding.

Escolha a guia Element Property. Na Scene elements escolha a primeira caixa de texto e em Properties selecione a propriedade Text. Depois de ter feito isso deslize para baixo e selecione a direção da ligação OneTime.

Faça o mesmo para a terceira caixa de texto (com a ligação OneWay) e para a quarta caixa de texto (com a ligação TwoWay). Não se esqueça de marcar à primeira caixa de texto como o elemento de origem. Se você está pronto iniciar o projeto. Deve ser algo parecido com isto:

Agora vamos testar a nossa ligação de dados. Altere o texto na primeira caixa de texto. Você deverá ver que o terceiro e o quarto texto vão reagir às mudanças imediatamente. Mas o que acontece com o nosso segundo? Como disse acima, a ligação OneTime só vai funcionar pela primeira vez quando o DataContext for definido. Depois que a ligação é apagada e as alterações não são refletidas nele.

Vamos dar uma olhada para a ligação OneWay. Como você tem visto à terceira caixa de texto reage sobre às mudanças da primeira caixa de texto. Será que isso também funciona na outra direção? Experimente! Você vai ver que à primeira caixa de texto irá manter o seu valor.

O último modo de ligação é a ligação TwoWay. Você já viu que à quarta caixa de texto reage sobre às mudanças da primeira caixa de texto imediatamente, mas também deve ocorrer na outra direção. É mesmo?

Faça algumas alterações para a quarta caixa de texto. Mh? O texto da primeira caixa de texto não reage imediatamente sobre as mudanças, mas por quê? Este exemplo mostra como a ligação de dados inteligente. Neste caso, a propriedade de texto da primeira caixa de texto só será definida se a quarta caixa de texto perder o foco. Por que isso é inteligente? Imagine que não faria isso. Nesse caso, ele vai entrar em um loop infinito onde as duas caixas de texto irão se atualizar um sobre o outro.

Com isso, nós acabamos e você pode dar os próximos passos na obtenção de um Data Binding ninja.

Download

Você pode fazer o download do projeto de exemplo do MSDN Samples.

Outros Idiomas

Este artigo também está disponível nos seguintes idiomas:

Deutsch

English

Italiano

Ver Também

Outro importante lugar onde pode encontrar uma enorme quantidade de artigos relacionados com Windows Phone é a própria TechNet Wiki. Onde o melhor ponto de entrada é Recursos Windows Phone no TechNet Wiki!