Este tutorial é uma continuação da Parte I, como parte do tutorial do Windows Phone: Apenas copiando e colando o código do Visual Studio para a mesclagem de expressões, criamos uma réplica do aplicativo Silverlight no Expression Blend. Agora vamos projetar um botão personalizado seguindo as etapas:
1. Confirme que o MainPage.xaml está aberto na janela do designer e que a área de trabalho atual está definida como desenhar. Para visualizar a área de trabalho atual, selecione Espaços de trabalho no Janela menu e garantir que o desenhar opção está marcada.
2. Na janela do designer, clique com o botão direito do mouseClique em mimBotão , aponte para Editar modelo e selecione Criar vazio.
3. No Criar Recurso ControlTemplate diálogo, defina o Nome paraFancyButton, mantenha o valor atual de “ Esse documento no Definir em opção e clique em Está bem.
4. Certifique-se de que o painel Objetos e Linha do tempo esteja visível, se não, selecione Janela e depois Objetos e Linha do Tempo para mostrar este painel. Senão você pode redefinir seu espaço de trabalho.
5. Altere o contêiner de layout raiz atual do modelo. No Objetos e Linha do Tempo painel, clique com o botão direito do mouse Grade elemento dentro Modelo, aponta para Alterar o tipo de layout, e selecione Fronteira.
6. Com o Fronteira elemento ainda selecionado no Objetos e Linha do Tempo painel, vá para o Propriedades painel e sob Aparência, defina o valor do Espessura da borda propriedade para2 para cada um dos lados e, em seguida, defina o valor do Raio de canto propriedade para15.
7. Em seguida, no Escovas seção, selecione o fundo propriedade e escolher o Escova de gradiente opção. Em seguida, selecione a parada de gradiente à esquerda e defina seu valor para uma cor cinza clara, por exemplo#FFADADAD. Em seguida, selecione a parada de gradiente correta e defina seu valor para uma cor cinza escura, por exemplo# FF0A0A0A.
8. Agora, no Escovas seção, selecione o BorderBrush propriedade, escolha um Pincel de cor sólida e escolha uma cor cinza clara, por exemplo# FFC0C0C0.
9. O próximo passo é adicionar uma legenda. Primeiro, certifique-se de que Fronteira elemento permanece selecionado no Objetos e Linha do Tempo painel.
10. Agora, mude para o Ativos painel, selecione o Controles categoria e role para baixo na lista exibida à direita da categoria para localizar o TextBlock ao controle. Em seguida, clique duas vezes no item na lista para inserir uma instância desse controle aninhada dentro do Fronteira elemento do modelo.
11. Agora, no Ferramentas painel, escolha o Seleção ferramenta ou pressione V para restaurar o modo de seleção.
12. No Objetos e Linha do Tempo painel, selecione o recém-adicionado TextBlock elemento. Então, no Propriedades painel, expanda o Escovas categoria e definir o Primeiro plano pincel para uma cor clara, por exemplo#FFFFFFFF.
13. Agora, expanda o Layout categoria e definir o valor do Alinhamento horizontal e Alinhamento vertical propriedades paraCentro. Em seguida, defina o valor do Margem propriedade para10 para os lados esquerdo e direito, e para4 para os lados superior e inferior.
14. Ligue o Texto propriedade do Caixa de texto controle no modelo para o Conteúdo propriedade do controle modelado por botão. Para fazer isso:
- Expandir o Propriedades Comuns categoria
- Clique Opções de propriedades avançadas-indicado por um ícone quadrado ao lado do valor da propriedade
- Selecione Encadernação de Modelos exibir uma lista de propriedades no controle de modelo que pode ser vinculado a essa propriedade
- Escolha o Conteúdo propriedade desta listaNotique que o valor do Texto propriedade muda para “Clique em mim”-O valor atualmente definido para o Conteúdo propriedade do botão - e que a propriedade agora é mostrada com um contorno amarelo para indicar que está vinculado ao modelo.
15. Pressione CTRL + S para salvar o arquivo atualizado.
16. Agora você está pronto para testar o novo botão personalizado. pressione F5 para construir e executar o aplicativo
Posts relacionados:
- Instaladores offline do Windows Live Essentials para TODOS os idiomas Links
- Lista completa de atalhos de teclado do Windows Live Writer
- Modelo gratuito do Windows Metro Style para usuários do Visual Basic
- Tutorial do Windows Phone 11: Criando uma animação para o texto do banner
- Unidade de teste do sistema operacional Windows no VirtualBox - Guia detalhado de capturas de tela
