DevExpress NavBar
Adicionando diferença/melhoria nas aplicações
Para quem trabalha no desenvolvimento de sistemas, sabe que seu projeto/aplicação deve ter algo que o diferencie dos demais, como por exemplo: um layout bonito, componentes com o estilo XP, um relatório bem formatado etc. Isso tudo para garantir a satisfação do cliente, sem contar é claro com o pagamento do mesmo pelo seu serviço.
Existem componentes da empresa DevExpress (www.devexpress.com) que fazem essa diferença com muita qualidade. Encontramos ótimos componentes: Grids, barras de ferramentas, relatórios, enfim várias opções. Mostrarei neste artigo o NavBar para criar barras semelhantes a que temos na Pesquisa do Windows.
Infelizmente, a empresa não disponibiliza versões demos para testar os componentes, temos no site alguns demos (executáveis) de aplicações. O componente possui versão do Delphi 5 ao 2005 e CBuilder 5 e 6.
NavBar
Basicamente o componente é uma barra lateral, onde você adiciona itens dentro de grupos. Essa barra pode ter vários estilos: como do Office 2003, Windows XP, além de podermos customizar esses estilos. Veja na Figura 1 alguns estilos que podemos usar no componente.
Figura 1. Alguns estilos do NavBar
Para adicionar os grupos e itens, basta dar um duplo clique no componente para abrir o seu editor, onde também fazemos a “ligação” dos itens com os grupos.
Os itens podem ser “linkados” a Actions provenientes de um ActionList. Isso torna a criação muito mais rápida e simples, onde apenas precisamos indicar nessa propriedade a ação pré-definida. Sendo feita na action toda a codificação e configuração, como Caption, ImageIndex etc.
O componente possui duas propriedade para vincular a imagens, o LargeImagens e SmallImagens. Como o próprio nome diz serve para mostrar imagens pequenas e grandes. As imagens grandes servem para os grupos e as pequenas para os itens, obviamente.
Veja na Figura 2 um exemplo utilizando dois tamanhos de ícones e também com imagens em background no componente, disponível nos demos do NavBar (o link para baixar os demos está no final do artigo).
Figura 2. Componente configurado com dois tamanhos de ícones e imagem de fundo
O componente permite ainda utilizar a técnica de drag-drop nos itens (Figura 3).
Figura 3. Utilizando drag-drop com o NavBar
Temos a possibilidade de adicionar controles da VCL nos itens do componente. Ao criar um grupo, indicamos True na propriedade UseControl, depois basta “colar” no grupo o componente desejado. Na Figura 4 tem um exemplo utilizando TreeView, ListView e outros componentes nos grupos do NavBar.
Figura 4. Colocando componentes dentro de grupos do NavBar
Vimos neste artigo “apenas” algumas possibilidades desse maravilhoso componente da DevExpress. Temos muito mais possibilidades, principalmente na parte de customização de estilos. Temos mais componentes instalados com o NavBar, como: cxPropertiesStore, cxStyleRepository e cxLookAndFeelController. Dos quais falaremos em outra oportunidade.
Um grande abraço e até a próxima.
Links
Demos
www.devexpress.com/Downloads/VCL/ExNavbar
Screen-shots das características do NavBar
www.devexpress.com/Products/VCL/ExNavbar/Features.xml