Como criar uma tela do Silverlight usando o Designer de Tela
Você pode modificar a aparência de uma tela usando o designer de tela. Você pode usar o designer de tela para realizar as tarefas de design a seguir.
Tarefas de Design de Campo e Comando
Adicionar um grupo de informações a uma tela.
Modificar o layout de um grupo.
Adicionar botões.
Adicionar itens.
Remover itens.
Mover itens.
Alterar o nome para exibição de um item.
Alterar a posição do rótulo de um item.
Alterar o tamanho de um item.
Mostrar ou ocultar um item.
Alterar o tipo de controle de um item .
Adicionar um controle personalizado a uma tela.
Desfazer alterações.
Tarefas de Design da Coleta de Dados
Alterar se uma coleção exibe dados quando a tela é carregada pela primeira vez.
Habilitar ou desabilitar paginação.
Habilitar ou desabilitar classificação.
Habilitar ou desabilitar pesquisa.
Para obter mais informações sobre como realizar tarefas de design enquanto o aplicativo é executado, consulte Como personalizar uma tela do Silverlight em um aplicativo em execução.
Adicionar um grupo de informações a uma tela
Na Árvore de Conteúdo da Tela, selecione um grupo ao qual você gostaria de adicionar um grupo de informações.
Na parte superior do Designer de Tela, clique em Adicionar Item de Layout e clique em Grupo.
Um novo grupo aparece.
Arraste itens para o grupo. Você pode arrastar itens da Lista de Membros da Tela do designer ou de outras áreas da árvore de conteúdo da tela.
Modificar o layout de um grupo
Na Árvore de Conteúdo da Tela, clique na seta para baixo próxima a um grupo que você deseja modificar.
Uma lista suspensa aparece. A lista suspensa mostra todos os tipos de controle que estão disponíveis para o grupo.
Na lista suspensa de controles, clique em um tipo de controle.
O tipo de controle que você seleciona afeta o layout do grupo. Para obter mais informações sobre cada tipo de controle, consulte Referência: propriedades do Designer de Tela.
Adicionar botões
Na Árvore de Conteúdo da Tela, selecione qualquer nó Barra de Comandos.
Na parte superior do Designer de Tela, clique em Adicionar Item de Layout e em Botão.
Um botão aparece abaixo do nó Barra de Comandos.
Adicione o código que será executado quando o usuário clicar no botão. Para obter mais informações, consulte Como adicionar um comando personalizado a uma tela do Silverlight.
Adicionar itens
Na Lista de Membros da Tela do Designer de Tela, arraste um item (por exemplo, um campo ou um comando) para o local desejado na Árvore de Conteúdo da Tela.
Dica
A árvore de conteúdo da tela é a hierarquia dos objetos de tela que são mostrados no meio do designer.
À medida que você arrasta o item, o cursor do mouse muda para indicar se o item pode ser colocado em um determinado ponto. Se o cursor do mouse mudar para um círculo com um corte, você não poderá soltar o item nesse local.
Você também pode adicionar campos personalizados a uma tela. Para obter mais informações, consulte Como adicionar uma propriedade local a uma tela do Silverlight.
Remover itens
Na Árvore de Conteúdo da Tela, selecione o item (por exemplo, um campo ou um comando) que você deseja remover da tela.
Na parte superior da Árvore de Conteúdo da Tela, clique no botão Excluir.
Mover itens
Na Árvore de Conteúdo da Tela, arraste o item (por exemplo, um campo ou um comando) para o local desejado na lista de itens.
Por exemplo, arraste o campo PostalCode para colocá-lo abaixo do campo Country ou arraste o botão Editar para colocá-lo acima do botão Excluir.
Dica
À medida que você arrasta um campo, o cursor do mouse muda para indicar se o item pode ser colocado em um determinado ponto.Se o cursor do mouse mudar para um círculo com um corte, você não poderá soltar o item nesse local.
Alterar o nome para exibição de um item
Na Árvore de Conteúdo da Tela, selecione o item (por exemplo, um campo ou um comando).
Na janela Propriedades, selecione a caixa de texto em Nome para Exibição e digite o nome desejado para o item.
Mudar o nome para exibição não altera o nome do item. Isso altera apenas o nome desse item exibido na tela.
Alterar a posição do rótulo de um item
Na Árvore de Conteúdo da Tela, selecione o campo.
Na janela Propriedades, clique na lista suspensa abaixo de Posição do Rótulo e selecione a posição desejada.
A tabela a seguir descreve cada opção.
Posição do rótulo
Descrição
Alinhado à esquerda
O rótulo aparece à esquerda do controle.
Alinhado à direita
O rótulo aparece à direita do controle.
Superior
O rótulo aparece acima do controle.
Parte Inferior
O rótulo aparece abaixo do controle.
Nenhum
Nenhum rótulo aparece para o campo de dados selecionado.
Recolhido
O campo é colocado no espaço que estaria reservado para o rótulo.
Alterar o tamanho de um item
Na Árvore de Conteúdo da Tela, selecione o item (por exemplo, um campo ou um comando).
Na janela Propriedades, abaixo de Redimensionamento, selecione o tamanho desejado para a largura e a altura do controle.
Para obter informações sobre cada configuração, consulte Referência: propriedades do Designer de Tela.
Mostrar ou ocultar um item
Na Árvore de Conteúdo da Tela, selecione o item (por exemplo, um campo ou um comando).
Na janela Propriedades, marque ou desmarque a propriedade É Visível.
Se você marcar É Visível, o item aparecerá na tela quando o aplicativo for executado. Se você desmarcar É Visível, o item não permanecerá visível na tela quando o aplicativo for executado.
Dica
O rótulo (Não visível) aparece ao lado de itens que não estão visíveis na tela quando o aplicativo é executado.
Alterar o tipo de controle de um item
Na Árvore de Conteúdo da Tela, selecione a lista suspensa próxima ao item.
Na lista suspensa, selecione o tipo de controle desejado.
A maioria dos tipos de controle é de tipos de controle internos. Você também pode definir o tipo de controle como um controle personalizado que cria usando outras ferramentas. Para obter mais informações sobre controles personalizados, consulte Como adicionar um controle personalizado a uma tela do Silverlight.
Adicionar um controle personalizado a uma tela
Na Árvore de Conteúdo da Tela, selecione qualquer grupo.
Na parte superior do Designer de Tela, clique em Adicionar Item de Layout e em Controle Personalizado.
Para obter mais informações, consulte Como adicionar um controle personalizado a uma tela do Silverlight.
Desfazer alterações
No menu Editar, clique em Desfazer.
Dica
Se você desfizer acidentalmente uma edição no Designer de Tela, no menu Editar, clique em Refazer.
Alterar se uma coleção exibe dados quando a tela é carregada pela primeira vez
Na Lista de Membros da Tela do Designer de Tela, selecione o título de uma coleção (por exemplo, o título OrderCollection).
Na janela Propriedades, desmarque a caixa de seleção Executar Consulta Automaticamente se você não quiser que a coleção mostre dados quando a tela aparecer. Marque a caixa de seleção Executar Consulta Automaticamente se você quiser que a coleção mostre dados quando a tela aparecer.
Habilitar ou desabilitar paginação
Na Lista de Membros da Tela do Designer de Tela, selecione o título de uma coleção (por exemplo, o título OrderCollection).
Na janela Propriedades, desmarque a caixa de seleção Dar suporte à paginação se você quiser que os usuários vejam todas as linhas retornadas por uma consulta mesmo que a coleção de linhas seja grande. Marque a caixa de seleção Dar suporte à paginação se você quiser limitar o número de registros que aparecem para o usuário quando uma consulta retorna um grande número de registros.
Se você selecionar Dar suporte à paginação, abaixo de Número de itens a serem exibidos por página, especifique o número de linhas que deseja que apareça para o usuário.
Dica
Os usuários podem avançar conjuntos de linhas clicando em um link na tela.
Habilitar ou desabilitar classificação
Na Lista de Membros da Tela do Designer de Tela, selecione o título de uma coleção (por exemplo, o título OrderCollection).
Na janela Propriedades, desmarque a caixa de seleção Dar suporte à classificação se você não quiser que os usuários classifiquem os dados que aparecem para a coleção. Marque a caixa de seleção Dar suporte à paginação se você quiser permitir que os usuários classifiquem os dados exibidos para a coleção.
Habilitar ou desabilitar pesquisa
Na Lista de Membros da Tela do Designer de Tela, selecione o título de uma coleção (por exemplo, o título OrderCollection).
Na janela de Propriedades, desmarque a caixa de seleção Dar suporte à pesquisa se você não quiser que uma caixa de pesquisa apareça acima da coleção. Marque a caixa de seleção Dar suporte à pesquisa se você quiser que uma caixa de pesquisa apareça acima da coleção.
Consulte também
Tarefas
Como personalizar uma tela do Silverlight em um aplicativo em execução
Como adicionar uma propriedade local a uma tela do Silverlight
Como adicionar um comando personalizado a uma tela do Silverlight
Como adicionar dados a uma tela