Atenção: esse artigo tem uma palestra complementar. Clique e assista!
Atenção: esse artigo tem um vídeo complementar. Clique e assista!
O objetivo do artigo é apresentar ao leitor que já conhece o Windows Forms a tecnologia WPF (Windows Presentation Foundation). Durante o artigo uma aplicação completa será criada introduzindo o leitor ao Microsoft Expression Blend 4 que auxiliará no exemplo.
Para que serve
Os aplicativos feitos com a tecnologia WPF permitem criar softwares com uma interface rica, visualmente mais elaborada que as aplicações Windows Forms, além de proporcionar uma manutenção mais organizada e códigos mais extensíveis.
Em que situação o tema é útil
Cada vez mais as aplicações desenvolvidas para a web ou Windows, exigem recursos visualmente ricos. Se você está pensando em migrar sua aplicação Windows Forms para WPF esse artigo apresenta alguns conceitos interessantes que poderão auxiliá-lo no início dessa tarefa em relação ao design da aplicação.
Resumo do DevMan
O artigo apresentará o WPF através da criação de um aplicativo com uma interface visualmente bem elaborada, um dos pontos fortes dessa tecnologia. Durante o artigo vamos conhecer alguns recursos do WPF, além de utilizarmos uma ferramenta muito importante chamada Microsoft Expression Blend 4, que nos auxiliará na parte visual do exemplo de aplicativo.
Autores: Robson Fernandes e Alexandre Tadashi Sato
O WPF (Windows Presentation Foundation) é a evolução do Windows Forms da plataforma .NET. Atualmente, o mercado cada vez mais está exigindo que as aplicações além de funcionais, extensíveis e com boa usabilidade, sejam também visualmente bem elaboradas, com componentes que permitam enriquecer a experiência do usuário com o aplicativo.
O artigo apresenta inicialmente uma introdução rápida ao WPF. Vamos conhecer os tipos de layouts para aplicações WPF, trabalhar com alguns controles disponíveis, executar eventos em WPF e em seguida vamos conhecer o Microsoft Expression Blend 4. Na sequência vamos criar uma aplicação completa em WPF e Expression Blend 4.
O WPF surgiu em 2001, nessa época, ele tinha o codinome “Avalon”, ele chegou sendo a nova tecnologia de apresentação do Windows Vista, o ponto forte da nova tecnologia era a capacidade de criar interfaces ricas.
Também trouxe para os aplicativos desktop o conceito de separar o código criado pelo designer do código criado pelo programador, facilitando muito nos casos onde existe uma equipe responsável pela aparência e usabilidade do aplicativo, e permitindo que essa equipe trabalhe sem se preocupar em afetar o código do restante da aplicação.
Dentre as novidades estavam a facilidade de implementar os recursos de animação, 3D, áudio e vídeo e a personalização em um nível muito flexível, permitindo modificar a aparência de botões ou modificar a forma de apresentar conteúdos em componentes como ListBox e DataGrid.
Outra característica muito importante é o modelo de ligação de dados dessa tecnologia, permitindo ligar elementos na interface com outros elementos da mesma interface ou diretamente com uma classe que fornece informações sobre dados retornados de um banco de dados ou outra fonte. Essa ligação é chamada de DataBinding, através da linguagem declarativa chamada XAML (eXtensible Application Markup Language), os dados são ligados sem que tenhamos que codificar em C# ou VB.NET para essa tarefa. O XAML é uma marcação também utilizada no Silverlight para a mesma finalidade, ou seja, criar interfaces ricas. Silverlight é a tecnologia para aplicações RIA da Microsoft.
Por muitos anos o modelo de aplicações para desktop foi semelhante, sendo que houve poucas melhorias significativas, quando se trata de criação de aplicativos com uma aparência rica. O WPF já é uma tecnologia madura para o desenvolvimento de projetos, já está sendo utilizada por um grande número de profissionais e inclusive a última versão do Visual Studio, o Visual Studio 2010, foi criada com a tecnologia WPF.
O Windows Forms não deve ter mais uma evolução significativa, a migração para o WPF pode proporcionar neste momento a facilidade de inclusão de uma série de recursos para o ganho de produtividade além de uma melhoria visual significativa.
Atualmente o WPF se encontra na versão 4, nesta versão houve melhorias no desempenho e um destaque é a integração com o Windows 7 permitindo criar aplicativos Multitouch.
Além dos componentes principais do WPF, existe um conjunto de componentes que pode ser instalado para ajudar a enriquecer ainda mais a sua aplicação, esses componentes estão agrupados em um aplicativo chamado WPF ToolKit, com ele podemos utilizar componentes para a criação de gráficos ou utilizar o Ribbon, componente que permite criar menus semelhantes ao utilizados no Microsoft Office.
Para auxiliar na parte gráfica a Microsoft disponibilizou uma ferramenta focada totalmente nesta tarefa, essa ferramenta é o Microsoft Expression Blend, como ele podemos trabalhar a parte visual da aplicação utilizando de recursos visuais, mais próximo de ferramentas que trabalham somente com imagens. Usando os menus da ferramenta e o mouse é possível realizar uma série de tarefas que facilitam muito no resultado da aparência
O Microsoft Expression Blend é um produto que faz parte do Microsoft Expression Suite. O Blend auxilia designers e desenvolvedores na concepção de aplicações, sendo uma ferramenta de interface gráfica para aplicações web e desktop, que mistura as características de ambas. Ele foi apelidado de Sparkle, e inicialmente o produto foi anunciado como o nome de Microsoft Expression Interactive Designer, antes de ser renomeado para Expression Blend em dezembro de 2006. O Expression Blend é uma ferramenta interativa, que segue o modelo de WYSIWYG (“What you see is what you get”) para a construção de interfaces baseadas em XAML para WPF e Silverlight. Você pode integrá-lo com Visual Basic. NET ou C# como linguagens de back-end para a interface desenvolvida. Ele possui suporte a mecanismos de texto WPF com tipografia OpenType avançada e ClearType, vetor 2D baseada em widgets e 3D com aceleração de hardware via DirectX. Ele tem vários controles prontos como menus, botões, barras e caixas de listagem etc., e possibilita também a criação de controles customizados, caso necessite em sua aplicação.
Em sua versão 4, o Microsoft Expression Blend trouxe consigo suporte para o Silverlight 4 e Windows Presentation Foundation 4 - WPF, mantendo também a capacidade de criar e editar aplicações em Silverlight 3 e WPF 3.5 com Service Pack 1 (SP1). Outro recurso interessante é interoperabilidade com o Visual Studio 2010, mantendo o fluxo entre as duas ferramentas. Foram adicionados novos recursos na criação de prototipagem de aplicações com o SketchFlow, tornando a criação de protótipos mais dinâmico para ser desenvolvido, além de proporcionar uma experiência fácil e agradável para o desenvolvedor apresentar seus projetos. Agora com o SketchFlow Player, você pode redimensionar as telas em tempo de execução, isso torna muito mais fácil de explorar layouts dinâmicos em protótipos, principalmente em situações de telas muito grande. Além disso, o Expression Blend 4 adicionou diversos recursos para se trabalhar com Behaviors em todos os tipos de aplicativos, de forma que é possível torná-los configuráveis e utilizar declarações condicionais. O Expression Blend 4 apresenta também, novos recursos que suportam o padrão de projeto Model-View-ViewModel (MVVM), para o desenvolvimento de aplicativos de negócios. Novos controles como PathListBox foram adicionados assim como novos efeitos de PixelShader, melhor suporte a importação de arquivos do Adobe Photoshop e Adobe Ilustrator, geração de dados estáticos e a partir de classes CLR, para efetuar testes em tempo real, efeitos de transição e diversas outras melhorias na ferramenta. Um destaque é o suporte a Shapes, onde é possível utilizar várias formas pré-definidas de objetos como: Estrelas, Setas, Círculos, Triângulos, entre outras formas geométricas e não geométricas, que são muito utilizadas por designers em softwares de criação vetorial. O Blend 4 também trouxe consigo a possibilidade de desenvolver aplicativos para o Windows Phone, bastando apenas baixar a extensão do plug-in para o ambiente de desenvolvimento. Com o recurso instalado, ele disponibiliza modelos de projetos para o Windows Phone, onde é possível testar o aplicativo no emulador do Windows Phone que é disponibilizado na instalação ou diretamente em um dispositivo. O Microsoft Expression Blend 4 vem proporcionando grandes melhorias a cada nova versão, sempre buscando a união entre designers e desenvolvedores, de modo que ambos possam trabalhar em conjunto para criar aplicações mais ricas e interativas, com uma grande capacidade de recursos e produtividade em uma única ferramenta de desenvolvimento.
Para ver um pouco do WPF na prática, vamos construir um exemplo. O objetivo da aplicação de exemplo é ler um serviço do Google que fornece informações sobre o tempo em uma determinada cidade. Uma imagem será apresentada de acordo com o tempo indicado pela consulta ao serviço. Por exemplo, se estiver um dia ensolarado a tela exibirá um sol, se estiver um dia chuvoso, nuvens e raios estarão no topo da tela. Além disso, vamos apresentar outras informações na tela como a umidade, temperatura e condições de outros dias da cidade pesquisada. Essas informações serão apresentadas em um ListBox personalizado. Neste mesmo aplicativo vamos consumir outro serviço, neste caso a API do Flickr, onde uma imagem da cidade de Santo André, previamente disponibilizada no serviço, será apresentada quando o usuário clicar no botão de consulta. Finalmente, um efeito de reflexo será criado nas imagens utilizando os recursos do Expression Blend. O resultado final desse projeto pode ser visto na Figura 1.
Figura 1. Aplicativo a ser desenvolvido em WPF
Neste tutorial será utilizada a versão final do Visual Studio 2010 e o Expression Blend 4 RC. É importante ressaltar que você pode programar em WPF somente com o Visual Studio 2008 ou 2010, sendo que o Expression Blend não é essencial para criar aplicativos em WPF. Contudo, o Expression Blend é uma ferramenta que tem o objetivo de ajudar a criar interfaces ricas para o Silverlight ou WPF. Tudo que você cria com o Blend você também pode criar com o Visual Studio, em alguns casos digitando os códigos XAML em vez de serem gerados pelo Expression Blend.
Silverlight é um plug-in cross-browser e cross-platform, considerada a nova geração para a apresentação de conteúdo interativo e multimídia. Essa tecnologia facilita muito quando queremos disponibilizar vídeos, áudios, trabalhar com imagens, criar formulários, trabalhar com informações em base de dados, criar aplicações LOB (Line of Business) entre diversas outras possibilidades.
