DevMedia
Você precisa estar logado para dar um feedback. Clique aqui para efetuar o login
Para efetuar o download você precisa estar logado. Clique aqui para efetuar o login
Este é um post disponível para assinantes MVP
Este post também está disponível para assinantes da .net Magazine DIGITAL
ou para quem possui Créditos DevMedia.

Clique aqui para saber como acessar este post

1) Torne-se um assinante MVP e por apenas R$ 59,90 por mês você terá acesso completo a todos os posts. Assinar MVP

2) Adquira Créditos: comprando R$ 180,00 em créditos esse post custará R$ 1,20. Comprar Créditos

post favorito     comentários
.net Magazine 74 - Índice

WPF para aplicações comerciais – Parte 1 - .Net Magazine 74

A Microsoft criou o WPF inicialmente como uma plataforma para desenvolvimento de aplicações multimídia. Porém, a comunidade de desenvolvedores também o adotou para o desenvolvimento de aplicações comerciais, também conhecidas como LOB (Line-Of-Business). Neste artigo vamos abordar as melhores práticas para o desenvolvimento desse tipo de aplicação utilizando WPF e NHibernate juntos.

[fechar]

Você não gostou da qualidade deste conteúdo?

(opcional) Você poderia comentar o que não lhe agradou?

Confirmo meu voto negativo

WPF para aplicações comerciais – Parte 1

 

Desde o advento da internet, principalmente após a tecnologia ter disponibilizado altas velocidades de transmissão de dados, temos ouvido falar que tudo estará online. Seus documentos, suas imagens, seus negócios, sua vida. Parte disso é realidade, não temos como negar. Contudo, o desktop ainda está aí. Trazendo essas afirmações para o campo do desenvolvimento de sistemas vemos que as ferramentas para o desenvolvimento web se especializaram, evoluíram.

Se compararmos a experiência do usuário ao utilizar um sistema desktop e um sistema web, podemos dizer que uma aplicação desktop é mais prazerosa ao usuário final e até, porque não, ao desenvolvedor. Sistemas desktop ainda existem e vão permanecer entre nós por muito tempo, mas não devido a limitações tecnológicas. Temos aí o Silverlight que tem a tarefa de construir interfaces ricas, melhorando a experiência do usuário. O que fará com que tenhamos ainda sistemas desktop são as regras de negócio. Em ambientes corporativos, onde a segurança é altamente rígida, talvez possuir ERP totalmente online é inviável, mas talvez ter partes dele desktop para garantir agilidade de uso e tempo de resposta seja mais interessante.

Pensando na evolução da interação homem/máquina, a Microsoft aos poucos foi substituindo sua plataforma de desenvolvimento desktop, criando algo totalmente novo, o WPF. A grande adoção (internacional) do uso da plataforma no desenvolvimento de aplicações comerciais pegou o time de criação do WPF de surpresa, o que fez com que na sua versão 3.5 várias adequações fossem adicionadas para deixá-lo mais preparado ao desenvolvimento de aplicações comerciais. É justamente este o foco de artigo, onde vamos entender como utilizar a plataforma WPF para desenvolvimento de aplicações comerciais e quais boas práticas estão envolvidas. Mas antes, vamos entender ligeiramente o que é o WPF.

 

Windows Presentation Foundation

Por volta de 2004 surgiu um projeto chamado até então de Avalon, declarado como a nova tecnologia de interface do Windows Vista. Com seu amadurecimento ele se tornou o WPF, um conjunto de classes – ou seja, uma plataforma – para o desenvolvimento de interfaces ricas, de alta definição, livres da limitação de resolução, que utilizam o poder de processamento das GPUs (Graphics Processing Unit, ou Unidade de Processamento Gráfico) onde estão em execução. O WPF também introduziu uma nova linguagem para criação de interfaces, o XAML, que tem o papel de definir, de forma declarativa, todos os controles que uma interface pode possuir, bem como animações 2D, 3D, efeitos, sons e vídeos. Desta forma temos uma espécie de code-behind, que pode ser em C#, VB.NET ou qualquer outra linguagem .NET. Veja no seguinte código a declaração em XAML de uma janela, que pode ser vista na Figura 1:

 

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    Title="Window with Button"

    Width="250" Height="100">

                     

 

Figura 1. Resultado da execução do código XAML

 

Agora, como ficaria se desejássemos clicar no botão e exibir uma mensagem? Basta dar um clique duplo no botão e seremos levados pela IDE ao code-behind, onde então podemos codificar o evento Click como a seguir:

 

void button_Click(object sender, RoutedEventArgs e)
        {
            MessageBox.Show("Hello, Windows Presentation Foundation!");
        }

 

E o resultado pode ser visto na Figura 2.

 

Figura 2. Code-behind sendo executado

 

O XAML foi desenvolvido para ser independente de linguagem de programação e garantir uma integração entre equipe de design e programação. Além disso, garante que ferramentas para o desenvolvimento de interface sejam utilizadas sem atrapalhar os programadores. A própria Microsoft desenvolveu o Expression Blend, exclusivo para desenvolvimento de interfaces WPF e Silverlight, que pode ser facilmente utilizado por qualquer designer ou até mesmo desenvolvedor. Na Figura 3 vemos a arquitetura por dentro do WPF.

 

 

Figura 3. Arquitetura do WPF

 

O fato é que aos poucos o WPF está substituindo o Windows Forms, que reinou por muito tempo no mundo desktop. O WPF é levado muito a sério pela Microsoft, tendo recebido grandes investimentos nos últimos anos. O resultado disso, por exemplo, é um Visual Studio 2010 desenvolvido em WPF!

A aplicação de exemplo

A ideia, como já mencionado, é explorar situações de uma aplicação comercial, como validação de dados por exemplo. Mas, como o espaço é curto, vou limitar a aplicação para algo simples, sem muita complicação. Vamos fazer uma pequena agenda, que mesmo simples, nos permitirá mostrar como fazer uma boa aplicação comercial usando WPF. Nessa aplicação poderemos cadastrar contatos e seus telefones, além de poder consultá-los claro. Como requisitos de negócio, temos: um contato não pode ter seu nome vazio, e no máximo deve ter 100 caracteres. O telefone por sua vez não pode ter seu número vazio também. Essa agenda deve permitir uma busca fonética dos contatos. E esses contatos devem ser armazenados em algum banco de dados relacional. Para persistir as informações vamos utilizar o NHibernate, assim, qualquer banco de dados (dentre os mais de 10 suportados) poderá ser utilizado.

Mãos à obra

Para desenvolver este exemplo vou utilizar o Visual Studio 2010 RC, mas no momento que você estiver lendo este artigo já teremos a sua versão final disponível, o que a princípio não deve impactar o desenvolvimento do exemplo.

Portanto, abra o Visual Studio, acesse o menu File > New > Project. Em Installed Templates escolha Other Project Types > Visual Studio Solutions e então Blank Solution.  Em Name, dê o nome de AgendaWPF e escolha uma pasta para o projeto. Pressione OK. Nesse instante temos uma solução vazia.

Como vamos utilizar boas práticas, dividiremos o sistema em camadas:

·         Apresentação – nesta camada teremos as janelas da aplicação;

·         Serviços – aqui vamos encontrar classes que irão manipular objetos de negócio e acesso aos dados;

·         Negócios – as classes que representam nosso domínio do problema estarão aqui;

·         Acesso a dados – vamos utilizar o padrão DAO para abstrair o acesso aos dados;

·         Persistência – frameworks como NHibernate ficam alojados nessa camada, pois tratam diretamente com o banco de dados.

 

Nota: Utilizaremos neste exemplo, em todos os projetos, a versão 3.5 do .NET Framework.

 

Entidades

Como já sabemos qual é o objetivo do projeto, vamos implementar nossas classes de negócio. Clique com o botão direito do mouse sobre a solução, escolha Add > New Project. Na janela que se abre, escolha Visual C# >Windows > Class Library. Dê o nome de AgendaWPF.Dominio. Automaticamente uma classe é adicionada. Exclua essa classe e adicione outra, clicando com o botão direito no projeto e então em Add > Class. No assistente que surge, escolha Class e dê o nome de Contato.cs.  Adicione agora mais outra classe e lhe dê o nome de Telefone.cs.

Como vamos utilizar uma ferramenta ORM para persistir os objetos, vamos criar uma classe base para nossas entidades, chamada de Entidade.cs. Nessa classe vamos apenas definir uma propriedade Id do tipo int. Essa propriedade representará a chave primária do objeto no banco de dados. Nessa classe também adicionamos um construtor que ajusta o valor de Id para 0 (zero), como mostra o código a seguir:

 

    public class Entidade

    {

        public int Id { get; set; }

        public Entidade()

        {

            Id = 0;

        }

    }

 

Agora vamos implementar Contato e Telefone de tal forma que herdem de Entidade. Na Listagem 1 podemos ver as classes completas.

 

·                     Listagem 1. Classes Contato e Telefone

    public class Contato: Entidade

    {

        private string _nome = string.Empty;

        public string Nome

        {

            get { return _nome; }

            set

            {

                _nome = value;

            }

        }

 

        private IList<Telefone> _telefones = new List<Telefone>();

        public IList<Telefone> Telefones

        {

            get { return _telefones; }

            set

            {

                _telefones = value;

            }

        }

    }

 

    public class Telefone

    {

        private TipoTelefoneEnum _tipo = TipoTelefoneEnum.Residencial;

        public TipoTelefoneEnum Tipo

        {

            get { return _tipo; }

            set

            {

                _tipo = value;

            }

        }

 

        private string _numero = string.Empty;

        public string Numero

        {

            get { return _numero; }

            set

            {

                _numero = value;

            }

        }

    }

 

    public enum TipoTelefoneEnum

    {

        Residencial,

        Comercial,

        Celular,

        Recado

    }

 

Observe que as classes são simples. Os campos privados nós já temos definidos com um valor padrão e a diferença fica para a classe Telefone, que possui uma propriedade do tipo TipoTelefoneEnum, que é um enumerado representando os tipos de telefones disponíveis.

Interface

Projetar uma tela antes de já começar a construí-la é uma boa prática. Além de posteriormente poder ser usada como guia durante o desenvolvimento, é bom colocar esse tipo de coisa no papel e apresentar para a equipe, para que todos possam opinar e assim ter algo de qualidade. Nas Figuras 4 e 5 você pode conferir o esquema, a representação básica da interface de usuário.

 

Figura 4. Tela principal do sistema

 

Figura 5. Tela de edição de contatos

 

Nota: Essas telas foram projetadas utilizando o Balsamiq (veja sessão Links).

 

Vamos adicionar um novo projeto à solução. Clique com o botão nela e escolha Add > New Project. Na tela que surgiu, escolha Visual C# > Windows > WPF Application.  No campo Name dê o nome de AgendaWPF.Sistema e confirme. O projeto então será criado com uma janela já adicionada, a MainWindow. Agora vamos criar nossa tela.

Como já foi mencionado, a interface em WPF é codificada usando XAML. O Visual Studio oferece suporte para se fazer isso visualmente, arrastando controles da Toolbox. Entretanto, eu prefiro codificar manualmente, já que o IntelliSense nos auxilia bastante.

Layout

O WPF nos oferece alguns layouts para disposição de controles. Temos por padrão:

·         Canvas: É um container muito simples, similar a um formulário comum, pois nele é possível posicionar os controles utilizando coordenadas X/Y absolutas;

·         StackPanel: Também é simples, porém não está limitado às coordenadas. Nele o posicionamento é organizado através de enfileiramento. Você adiciona um controle, então adiciona outro e assim por diante. Todo esse conteúdo fica posicionado horizontalmente ou verticalmente. Isso é determinado por uma propriedade chamada Orientation;

·         WrapPanel: Como seu nome diz, ele faz uma quebra em seu conteúdo. Por exemplo, você vai adicionando botões a um WrapPanel e, quando não couber mais na mesma linha, ele automaticamente joga para a linha de baixo;

·         DockPanel: É um container muito versátil, pois ao utilizá-lo ele adiciona aos controles nele contidos a capacidade de escolherem onde ficarão, se à esquerda, direita, no topo ou abaixo;

·         Grid: Este é o container mais flexível, pois nele podemos criar linhas e colunas e nelas inserir os controles, bem semelhante a tabelas HTML.

Para nossa tela principal vamos utilizar um StackPanel, em conjunto de outros. Na Listagem 2 vemos o código XAML já pronto.

 

·                     Listagem 2. Janela principal

<Window x:Class="AgendaWPF.Sistema.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

"

A exibição deste artigo foi interrompida

Este post está disponível para assinantes MVP.



Editor Geral da revista ClubeDelphi. Formado em processamento de dados pela FATEC-TQ. Atua como Analista de Sistemas na Siplan Control-M unidade Jaboticabal (www.siplancontrolm.com.br), prof. na FATEC-TQ e consultor na NHibernate [...]

O que você achou deste post?
Publicidade
Serviços

Mais posts