Compartilhar via

Como adicionar um controle personalizado a uma tela do Silverlight

  • Artigo

Você pode adicionar controles do Silverlight a uma tela do LightSwitch.Usando controles do Silverlight, você pode exibir ou coletar informações de maneira que extrapole os recursos dos controles internos do LightSwitch.

Você pode usar os controles que estão inclusos no tempo de execução do Silverlight e no Silverlight SDK.Você também pode usar controles que você cria usando modelos de projeto do Silverlight, por exemplo, aqueles que estão disponíveis no Visual Studio 2010.Ambos os tipos de controles são chamados de controles personalizados no LightSwitch.

Para obter informações sobre como criar controles personalizados usando modelos de projeto do Silverlight no Visual Studio, consulte Controle Básico (Silverlight QuickStart).

Adicionando Novos Controles e Substituindo Controles Existentes

Você pode adicionar um controle personalizado a uma tela, ou como um novo controle ou como uma substituição para um controle existente do LightSwitch.

Para adicionar um controle personalizado a uma tela

  1. Na Árvore de Conteúdo da Tela, selecione qualquer grupo.

  2. Na parte superior do Designer de Tela, clique em Adicionar Item de Layout e clique em Controle Personalizado.

  3. Na caixa de diálogo Adicionar Controle Personalizado, expanda o nó do assembly, expanda o nó do namespace e selecione o nó do controle.

    Se o assembly desejado não aparecer na caixa de diálogo Adicionar Controle Personalizado, clique em Adicionar Referência.Na caixa de diálogo Adicionar Referência, selecione um assembly ou um projeto local que contenha o controle que você deseja usar, e então clique em OK.

    ObservaçãoObservação

    Se você criou este controle usando modelos de projeto do Silverlight no Visual Studio e você associou o controle a dados alterando o XAML do controle, você não precisa executar a próxima etapa.Para obter mais informações sobre como associar um controle a dados personalizados alterando o XAML de controle, consulte Usando Controles Personalizados para Aprimorar a Interface de Usuário de seu Aplicativo do LightSwitch.Se o controle personalizado é um controle interno do Silverlight, ou se você criou este controle usando modelos de projeto do Silverlight no Visual Studio, mas deseja associar o controle aos dados usando o LightSwitch, prossiga para a próxima etapa.

  4. No campo Especifique os dados para o novo controle personalizado, digite o nome dos dados da tela que você deseja associar ao controle e clique em OK.

    Por exemplo, se você deseja que uma caixa de listagem personalizada mostre nomes de uma coleção chamada CustomerSet, digite CustomerSet.Se você deseja que o controle para mostre o nome do cliente selecionado no momento, digite CustomerSet.SelectedItem.ContactName.

  5. Adicione código que associa os dados a uma propriedade específica do controle.Para obter mais informações, consulte Associando Dados a uma Propriedade do Controle Personalizado posteriormente neste documento.

Para usar um controle personalizado para substituir um controle existente

  1. Na Árvore de Conteúdo da Tela, na lista suspensa próxima ao controle que você deseja substituir, selecione Controle Personalizado.

  2. Na janela Propriedades, próximo ao campo de Controle Personalizado, clique em Alterar

  3. Na caixa de diálogo Adicionar Controle Personalizado, expanda o nó do assembly, expanda o nó do namespace, selecione o nó do controle e clique em OK.

    Se o assembly que contém o controle não aparecer na caixa de diálogo Adicionar Controle Personalizado, clique em Adicionar Referência.Na caixa de diálogo Adicionar Referência, selecione um assembly ou um projeto local que contenha o controle que você deseja usar, e então clique em OK.

  4. Adicione código que associa os dados a uma propriedade específica do controle.Para obter mais informações, consulte Associando Dados a uma Propriedade do Controle Personalizado posteriormente neste documento.

Associando Dados a uma Propriedade do Controle Personalizado

Você deve associar os dados que você especificou na caixa de diálogo Adicionar Controle Personalizado a uma propriedade específica do controle personalizado.

Para associar dados a uma propriedade do controle personalizado

  1. No Designer de Tela, clique na seta próxima ao botão Escreva Código e clique em qualquer método.

    ObservaçãoObservação

    Escolha um método que é executado antes que você queira que dados apareçam no controle no tempo de execução, por exemplo, o CustomerListDetail_Activated.

    Um bloco de método aparece no Editor de Códigos.

  2. No bloco do método, adicione o código que associa os dados de tela a uma propriedade do controle personalizado.

    O exemplo a seguir faz referência a um controle personalizado de caixa de listagem chamado Customers.Esse código associa uma coleção de dados que foi especificada na caixa de diálogo Adicionar Controle Personalizado a uma propriedade específica da caixa de listagem.Esse código também especifica que os dados podem ser alterados usando esse controle.

    Private Sub CustomersListDetail_Activated()
    Me.FindControl("Customers").SetBinding( _
        System.Windows.Controls.ListBox.ItemsSourceProperty, _
                "Value", System.Windows.Data.BindingMode.TwoWay)
End Sub

    partial void CustomersListDetail_Activated()
{
    this.FindControl("Customers").SetBinding(
        System.Windows.Controls.ListBox.ItemsSourceProperty,
        "Value", System.Windows.Data.BindingMode.TwoWay);
}

Consulte também

Tarefas

Como adicionar um controle personalizado a uma tela do Silverlight

Como criar uma tela do Silverlight usando o Designer de Tela

Como: adicionar dados a uma tela

Como adicionar uma propriedade local a uma tela do Silverlight

Como adicionar um comando personalizado a uma tela do Silverlight

Conceitos

Tour do Editor de tela