ComicReader X – Parte 5. Layouts

Layout é uma das coisas mais importantes em qualquer projeto WPF, bem, não só WPF mas em qualquer projeto que necessite de uma interação com usuários. Para quem vem de uma origem de desenvolvimento desktop, seja windows forms ou Delphi, o WPF oferece mais que apenas "arrastar e clicar". Você realmente precisa pensar em como dispor os controles.

O que o WPF oferece?

Essencialmente temos os seguintes controles de layouts disponibilizados:

  • Canvas
  • Stackpanel
  • Wrappanel
  • Dockpanel
  • Grid

Na figura abaixo vemos os controles de layout que utilizei para o desenvolvimento do ComicReader X

 

Canvas

Este é um dos controles de layout mais fáceis de se utilizar. Semelhantemente aos formulários windows forms ou VCL, nele podemos posicionar os controle utilizando as coordenadas X,Y.

StackPanel

Também é bem fácil de ser utilizado, nele os controles são empilhados verticalmente ou horizontalmente. Isso pode ser feito pela propriedade Orientation.

Wrappanel

O wrappanel distribui os controles que estão contidos nele. No ComicReader X ele é utilizado para criar a barra de movimentação da janela.

Dockpanel

É muito útil e pode servir como layout base para qualquer janela WPF. Através dele podemos construir os mais variados layouts, posicionando por exemplo uma menu ao topo, uma área livre à direita e até mesmo um outro controle de layout à esquerda. Sim, é possível aninhar controles de layout. Cada controle que é inserido em um dockpanel pode ser alinhado através da propriedade DockPanel.Dock, como visto abaixo.

O Dockpanel também oferece uma propriedade muito interessante, a LastChildFill, que faz com que o último controle inserido nele preencha todo o espaço restante. Utilizei essa propriedade para fazer o Scrollbox preencher todo o espaço disponível da janela

Grid

O Grid é semelhante a uma tabela, com ele definimos colunas e linhas, e dentro delas inserimos os controles.

Conclusão

Confesso que demorei um pouco até chegar nesse layout, que defino como apropriado para o ComicReader X. Achei meio complicado montar isso direto no Blend, de forma visual. Foi mais fácil eu rascunhar em um papel e depois no VS2008 mesmo, direto no XAML, definir os controles de layout.

Esse post foi publicado em WPF. Bookmark o link permanente.

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s