Apresentando a ExtJS
layout usando componentes da ExtJS
ExtJS é uma biblioteca Javascript para criar aplicações ricas para internet (Rich Internet Application). Com ela é possível construir interfaces gráficas com aparência de uma aplicação para desktop. Suas principais características são:
- Alta performance e possibilidade de customizar componentes
- Bem desenhada, documentada e as classes dos componentes são
extensíveis - Possui uma versão Open Source
- Pode trabalhar em conjunto com outras bibliotecas como JQuery,
Mootools, Protoype… - Fácil de usar
- Integração entre cada um dos seus componentes
Exemplos de Componentes
Grid
Um Grid é uma ótima maneira de apresentar uma listagem de dados. A ExtJS provê avançados recursos para construção de grids, como células editáveis, agrupamento de dados, paginação de resultado, barra de ferramentas, utilização de imagens, ordenação por campo, etc.
Grid simples
Window
É possível criar janelas que podem ser redimensionadas, maximizadas, minimizadas e arrastadas. Também podem ser modais ou não modais. Um janela pode conter outros componentes como grid, tabs, forms, etc.
Window contendo TabPanel
Form
Componente para criação de formulários. Cada campo do form pode conter regras de validação que podem ser customizadas. Por padrão, um Form envia os dados no modo ajax (via POST usando o formato JSON).
Form simples
Tree
Estrutura em forma de árvore semelhante ao Windows Explorer.
Pode usar imagens como ícones e o recurso de arrastar e soltar para movimentar os elementos.
TreePanel padrão
Toolbar e Menu
Barra de ferramentas e menus também podem ser utilizados dentro de outros elementos, como Window e GridPanel.
Toolbar e MenuBar
Conclusão
A idéia desse texto foi apenas despertar a curiosidade sobre essa incrível biblioteca Javascript. Há muito mais recursos e exemplos que não mencionei, mas que podem ser vistos no site do projeto.
Tenho utilizado bastante em projetos de sistemas web em conjunto com o Django e com isso consegui mais agilidade já que não preciso mais me preocupar com assuntos referentes ao design, como cores e tipografia.
Sites relacionados:
0 Comments