Depois de aprender sobre como criar e implantar um aplicativo na versão Silverlight de ferramentas CTP, como parte dessa série de tutoriais do Windows Phone, passamos para o Expression Blend. O Expression Blend é um sistema de autoria para designers profissionais que criam experiências de usuário que visam a plataforma.NET 3.0 + e, mais especificamente, o WPF ou o Windows Presentation Foundation.
Em geral, os controles do Silverlight têm uma lógica separada de sua aparência visual usando modelos. UMA ControlTemplate especifica a estrutura visual e o comportamento visual de um controle. Você pode personalizar a aparência da maioria dos controles modificando seu padrão ControlTemplate definições. Isso permite que você altere a aparência do controle sem alterar sua funcionalidade. Por exemplo, você pode fazer com que os botões na sua aplicação girem em vez da forma quadrada padrão, mas o botão ainda aumentará Clique evento.
Neste tutorial, você abre o projeto do Visual Studio criado no exercício anterior no Expression Blend e substitui o ControlTemplate do botão para alterar sua aparência. Porque você cria um ControlTemplate em XAML, você pode alterar a aparência de um controle sem escrever nenhum código.
2. Se você concluiu as etapas do exercício anterior, pode continuar com a solução criada para esse exercício.
3. Abra a solução atual no Expression Blend. Para fazer isso no Visual Studio, clique com o botão direito do mouse MainPage.xaml no Solution Explorer e, em seguida, selecione Abrir no Expression Blend. Se esta opção não estiver disponível-O motivo mais provável é que sua versão atual do Expression Blend não suporta o tipo de projeto necessário - siga as próximas etapas para criar um projeto temporário que possa ser editado usando o Expression Blend
4. Abra o Microsoft Expression Blend
5. Crie um novo projeto de aplicativo para manter seus ativos de design temporariamente. Para fazer isso, abra o Arquivo menu e, em seguida, escolha Novo projeto
6. No Novo projeto diálogo, selecione o Silverlight tipo de projeto e, em seguida, escolha o Aplicativo Silverlight 3 modelo. Definir o nome para DesignHelloPhone, escolha um local adequado e mantenha o idioma Visual C #e clique em Está bem.
7. No Visual Studio, clique duas vezes App.xaml em Gerenciador de Soluções para abrir este arquivo no editor. Agora, abra a exibição XAML e, em seguida, selecione e copie todo o Application.Resources seção para a área de transferência
8. Abra o Expression Blend novamente, expanda o DesignHelloPhone projeto no Projetos painel e clique duas vezes App.xaml para abrir o arquivo
9. Aponte para Vista do documento ativo no Visão menu e selecione Visualização XAML.
10. Encontre o Application.Resources seção neste arquivo - ele deve estar vazio - e cole o conteúdo da área de transferência para substituí-lo.
11. Agora, localize a seção no texto recém-inserido que é delimitado com o comentário “ ***** MODELOS LISTBOX / LISTBOXITEM ***** ”; Ele contém estilos que não são compatíveis com um projeto do Silverlight 3. Exclua toda a seção entre os delimitadores inicial e final.
12.Agora localize o Aplicação elemento na parte superior do arquivo e insere uma nova declaração de namespace para fazer referência Sistema namespace no mscorlib montagem, como mostrado abaixo.
xmlns:system='clr-namespace:System;assembly=mscorlib' > # FF1F1F1F Preto ?> var13 ->
13. Agora salve a alteração App.xaml em Expression Blend.
14. Em seguida, abra o Visual Studio novamente e abra o MainPage.xaml arquivo na exibição XAML. Em seguida, selecione e copie o Grade elemento chamado LayoutRoot incluindo seus filhos para a área de transferência.
15. Retorne ao Expression Blend, abra o MainPage.xaml arquivo na exibição XAML e cole o conteúdo da área de transferência para substituir LayoutRootGrade elemento neste arquivo.
16. No MainPage.xaml arquivo, localize a raiz UserControl elemento e alterar os valores do Altura atribuir a 800 e a Largura atribuir a 480.
17. Volte para o Visual Studio, clique com o botão direito do mouse MainPage.xaml.cs em Gerenciador de Soluções e selecione Ver código. Em seguida, copie o ClickMeButton_Click manipulador de eventos para a área de transferência.
18. Finalmente, retorne ao Expression Blend, expanda o MainPage.xaml nó no Projetos painel, clique duas vezes no MainPage.xaml.cs para abrir o arquivo no editor e cole o código na área de transferência no Página principal classe.
Agora nós replicamos com sucesso nosso projeto para a mistura de expressões. Para criar um design para o botão personalizado, leia o próximo tutorial a ser publicado amanhã.
