Atenção: esse artigo tem um vídeo complementar. Clique e assista!
O artigo trata do framework ICEfaces 2.0, que tem por objetivo facilitar a utilização de AJAX em aplicações Web baseadas em JSF 2.0, além de prover uma série de componentes visuais ricos para composição das interfaces gráficas com o usuário. O artigo descreve como instalar o framework, utilizar suas funcionalidades AJAX, como o AJAX Automático, a técnica Push e o escopo da janela, além de apresentar alguns dos seus novos componentes ricos.
Para que serve:
O framework ICEfaces serve para implementar de forma mais fácil páginas JSF com funcionalidades AJAX, além de prover uma série de componentes visuais ricos para a composição das interfaces gráficas com o usuário em JSF.
Em que situação o tema é útil:
O tema é útil para desenvolvedores Web em geral que desejam conhecer os frameworks disponíveis para a arquitetura Web. Em especial, ICEfaces é útil para aqueles que estejam desenvolvendo sistemas Web empregando JSF 2.0 e utilizam ou desejam utilizar a tecnologia AJAX em suas páginas.
ICEfaces 2.0:
À medida que a tecnologia Web avançou, suas novidades foram sendo incorporadas aos frameworks que facilitam o desenvolvimento nesta arquitetura. Não seria diferente com frameworks baseados em JSF, que foram evoluindo e incorporando diversas facilidades, dentre elas o AJAX, requisição assíncrona feita com JavaScript e que aumenta a dinamicidade das páginas Web. Recentemente foi lançada a versão 2.0 do framework ICEfaces – baseado em JSF 2.0 – que, além de trazer uma biblioteca de componentes ricos, facilita a utilização de AJAX em páginas JSF. Neste artigo, descrevemos como instalar o ICEfaces em sua aplicação Web (Listagens 1 e 2, Figuras 1 e 2) e, em seguida, apresentamos as funcionalidades trazidas pelo framework: AJAX Automático (Listagens 3 a 5, Figura 3), a técnica Push (Listagens 6 a 9, Figura 4), o escopo da janela (Listagem 10) e sua biblioteca de componentes visuais ricos (Listagens 11 a 13, Figura 5).
Desde sua criação, o padrão JavaServer Faces (JSF) trouxe a ideia de componentes de interface gráfica para a Web. Segundo esse paradigma, desenvolvedores de frameworks poderiam combinar os elementos existentes (campos de formulário, painéis, tabelas, etc.) para formar um novo componente, representado por uma nova tag JSF, e utilizado pelo desenvolvedor final em suas aplicações, abstraindo toda a complexidade que se encontra por trás da tag utilizada.
A própria implementação básica do JSF oferece uma série de componentes que abstraem os elementos HTML que se encontram por trás. Por exemplo, a tag <h:panelGrid /> dispõe elementos em uma grade utilizando as tags HTML <table />, <tr />, <td />, etc., sem que o desenvolvedor da página se preocupe em como utilizar estas tags. Tal abstração facilita o desenvolvimento das interfaces à medida que utilizamos componentes de mais alto nível. Porém, muitos desenvolvedores não gostam que os elementos de mais baixo nível fiquem escondidos, pois diminui a capacidade de personalização e depuração do código.
Popular ou não, esta característica do JSF permitiu que diversas empresas e organizações de desenvolvimento de software criassem suas próprias bibliotecas de componentes. Algumas das mais conhecidas são: MyFaces Tomahawk/Trinidad/Tobago (da Apache), PrimeFaces (da Prime Teknoloji), RichFaces (da JBoss) e, nosso foco deste artigo, ICEfaces (da ICEsoft). Na seção Links, o leitor interessado encontrará os endereços dos sites destes frameworks, caso queira conhecê-los melhor.
À medida que a tecnologia Web avançou, suas novidades foram sendo incorporadas nestes frameworks. Uma das funcionalidades mais procuradas é a utilização de AJAX, que vem embutida nos componentes e alivia o desenvolvedor da necessidade de criar códigos em JavaScript. Componentes e frameworks JavaScript populares também são integrados como, no caso do ICEfaces, o CKEditor e a biblioteca YUI (veja Links).
Neste artigo, mostraremos como instalar o ICEfaces em uma aplicação JSF e construiremos diversos exemplos de interface gráfica utilizando seus componentes. Será utilizada a versão mais recente do framework, ICEfaces 2, que é baseada no JSF 2.0.
Download e Instalação
Para obter o framework ICEfaces, visite seu site (veja Links), clique no link “ICEfaces 2 Downloads” no menu à esquerda e, em seguida, clique em ICEfaces-2.0.0-bin.zip. É necessário registrar-se no site para copiar o arquivo. Após o término do download, descompacte o arquivo em alguma pasta do seu sistema.
Para sua instalação, explicaremos passo-a-passo como preparar seu projeto nas duas IDEs Java mais utilizadas atualmente: NetBeans 6.9 (com GlassFish 3) e Eclipse Helios (com Tomcat 7) – veja Links. Em ambos os casos existe um plug-in ICEfaces disponível na página de downloads, juntamente com a distribuição do framework. No entanto, mostraremos como instalar o ICEfaces no NetBeans sem a utilização do plug-in, mas no Eclipse, ao contrário, o utilizaremos. Desta maneira, nossa explicação não ficará atrelada ao seu uso.
NetBeans 6.9
No NetBeans, crie um novo projeto Web clicando em Arquivo > Novo Projeto..., escolhendo a categoria Java Web e o projeto do tipo Aplicação Web. Clique no botão Próximo e informe o nome do projeto (ex.: MinhaAplWeb). Clique em Próximo mais duas vezes e selecione, na última tela do assistente, utilizar o JavaServer Faces, mantendo a configuração padrão. Clique em Finalizar para que o projeto seja criado.
O item Bibliotecas, que pode ser encontrado abaixo do projeto MinhaAplWeb na aba Projetos, mostra as bibliotecas utilizadas pela aplicação. É possível adicionar o ICEfaces diretamente ao nosso projeto clicando com o botão direito do mouse em Bibliotecas e escolhendo a opção Adicionar JAR/pasta.... Porém, é mais interessante cadastrar o framework como uma biblioteca na IDE para podermos utilizá-lo mais facilmente em outros projetos.
Para tal, clique no menu Ferramentas > Bibliotecas para abrir o Gerenciador de bibliotecas. Clique no botão Nova biblioteca... e dê a ela o nome do framework em questão: ICEfaces2. Em seguida, clique no botão Adicionar JAR/pasta... e navegue até a pasta na qual foi descompactado o arquivo obtido anteriormente (ICEfaces-2.0.0-bin.zip). Dentro da subpasta icefaces/lib, escolha os arquivos icefaces.jar, icefaces-ace.jar e icepush.jar. Finalmente, clique OK para fechar o gerenciador.
De volta ao projeto, clique com o botão direito em ...
