Como associar dados no Designer XAML

No Designer XAML, você pode definir as propriedades de associação de dados usando o artboard e a janela Propriedades. O exemplo neste tópico mostra como associar dados a um controle. Especificamente, o procedimento mostra como criar uma classe de carrinho de compras simples que tenha uma DependencyProperty nomeada ItemCount e depois como associar a propriedade ItemCount à propriedade Texto de um controle TextBlock.

Para criar uma classe para usar como fonte de dados

  1. Crie um projeto em C# ou Visual Basic no modelo Aplicativo em Branco.

  2. Abra MainPage.xaml.cs (ou MainPage.xaml.vb) e adicione o código a seguir. Em C#, adicione o código ao namespace projectName (antes do parêntese de fechamento no arquivo). No Visual Basic, adicione a nova classe.

    public class ShoppingCart : DependencyObject
    {
        public int ItemCount
        {
            get { return (int)GetValue(ItemCountProperty); }
            set { SetValue(ItemCountProperty, value); }
        }
    
        public static readonly DependencyProperty ItemCountProperty =
             DependencyProperty.Register("ItemCount", typeof(int),
             typeof(ShoppingCart), new PropertyMetadata(0));
    }
    
    

    Esse código define um valor de 0 como a contagem de itens padrão usando o objeto PropertyMetadata.

    DicaDica

    No Visual Studio, você pode adicionar código de stub de uma propriedade de dependência digitando propdp dentro da classe ShoppingCart e depois pressionar a tecla TAB.

  3. Clique em Compilar > Compilar Solução.

Para associar a propriedade ItemCount a um controle TextBlock

  1. Clique com o botão direito do mouse em MainPage.xaml e clique em Exibir Designer.

  2. Na janela Estrutura de Tópicos de Documento, selecione o painel raiz Grade, exibido como [Grid] na janela.

  3. Com Grid selecionado, clique no botão Novo ao lado da propriedade DataContext na janela Propriedades.

  4. Na caixa de diálogo Selecionar Objeto, verifique se a opção Mostrar todos os assemblies está desmarcada e selecione ShoppingCart no namespace projectName; em seguida, clique em OK.

    A ilustração a seguir mostra a caixa de diálogo Selecionar Objeto com a opção ShoppingCart selecionada.

    Select Object dialog box
  5. Na Caixa de Ferramentas, clique duas vezes no controle TextBlock e adicione-o ao artboard.

  6. Com o controle TextBlock selecionado, clique no marcador de propriedade à direita da propriedade Texto em Comum na janela Propriedades. (O marcador de propriedade se assemelha a uma caixa pequena.)

  7. Clique em Criar Vinculação de Dados no menu resultante.

  8. Com um tipo de associação de Contexto de dados, que é o valor padrão na lista Tipo de vinculação, selecione a propriedade ItemCount na caixa Caminho e clique em OK.

    A ilustração a seguir mostra a caixa de diálogo Criar Vinculação de Dados com a propriedade ItemCount selecionada.

    Create Data Binding dialog box
  9. Pressione F5 para iniciar o aplicativo.

    O controle TextBlock deve mostrar o valor padrão de 0 como texto.

Contribuições da comunidade

Mostrar:
© 2014 Microsoft