Atenção: esse artigo tem um vídeo complementar. Clique e assista!
Utilização do JavaServer Faces 2 para criação de componentes de interface com o usuário customizados. Neste artigo você verá o que existe por trás dos componentes customizados, além de aprender a criar seus próprios componentes.
Para que serve:
O JavaServer Faces é uma tecnologia component-based que permite a customização de componentes existentes ou a criação de novos. A construção de componentes IU customizados permite o reuso dos códigos de interface que possuem comportamento. Com isso, é possível aumentar a velocidade e a qualidade do desenvolvimento web através do uso e da construção de bibliotecas de componentes.
Em que situação o tema é útil:
O reuso é uma palavra fundamental no desenvolvimento de software, e diversos paradigmas de desenvolvimento se preocupam com ela há décadas. A customização de componentes IU é útil para as empresas e desenvolvedores que se preocupam com o reuso e que implementam, repetidas vezes, interfaces com o usuário semelhantes que podem ser unificadas em um componente com configurações específicas.
Customizando Componentes no JSF 2.0:
A tecnologia JSF permite a customização de componentes de interface com usuário que pode ser realizada com ou sem o uso de código Java, utilizando, respectivamente, composite components ou non-composite components. Este artigo aborda o uso de composite components para a criação de componentes IU. Além disso, é visto como a arquitetura dos componentes é definida, tendo como base a interface UIComponent, suas subclasses e diversas interfaces importantes. Em seguida são apresentadas as responsabilidades destas classes e interfaces. Na parte prática, o exemplo para construção de componentes IU se dá em cima de um leitor para Twitter, que é apresentado em dois momentos distintos: com e sem comportamento e AJAX. Por fim, é descrito uma forma de agilizar o desenvolvimento de composite components utilizando o assistente de criação disponível na IDE NetBeans.
O JavaServer Faces (JSF) é uma especificação da Sun para desenvolvimento web que utiliza como base componentes. O uso destes componentes para a construção de interfaces com o usuário (IU), simplifica o desenvolvimento mantendo escondida a implementação de tarefas complexas e apresentando ao programador apenas tags com atributos que descrevem as entradas necessárias para o correto funcionamento do componente.
A possibilidade de customização de componentes é um recurso poderoso de extensão para atender às demandas específicas de reuso presentes nas aplicações web atuais. Estas aplicações possuem cada vez mais objetivos em comum (com comportamentos diversificados), que podem vir a se tornar reusáveis de forma fácil com o apoio de JSF. Por exemplo, é comum termos uma tela de login nos sistemas, entretanto cada tela pode ter configurações específicas como a ação necessária para efetuar o login. Dessa forma, ao mudarmos a configuração de uma tela alteramos o seu comportamento.
A partir da versão 2 do JSF, foi definido uma nova maneira para criar componentes IU denominada composite component. Esta técnica facilitou a tarefa de customização, dispensando o uso de código Java e definindo um conjunto de tags que permitem construir componentes através de páginas XHTML. Com isso, o desenvolvedor front-end não precisa mais saber Java para reusar códigos com comportamento, bastando conhecer as tags do JSF.
Como o JSF é baseado em componentes que podem ser criados e estendidos, ao longo do tempo surgiram diversas bibliotecas, algumas gratuitas, outras proprietárias. Estas bibliotecas são mantidas por empresas ou comunidades que buscam facilitar a vida do desenvolvedor, com códigos de qualidade e prontos para serem usados nos mais diversos tipos de aplicação web. Alguns exemplos de bibliotecas são RichFaces, PrimeFaces, IceFaces, Tomahawk, OpenFaces, entre muitas outras.
Neste artigo, você irá aprender a criar componentes IU customizados utilizando composite components através do exemplo de um leitor para Twitter. Além disso, irá compreender como utilizar o assistente da IDE NetBeans para apoio à customização, tornando ainda mais fácil esta tarefa.
Veremos como é simples e útil aplicar esta técnica do JSF 2. Os conceitos serão apresentados aos poucos e o exemplo será explicado em duas etapas para facilitar a compreensão.
O que são componentes de interface com o usuário?
O conceito de componente pode ser definido como uma unidade de software utilizada para a construção de vários sistemas que tem como principal característica a possibilidade de configuração para a modificação do seu funcionamento, alterando, dessa forma, o seu comportamento.
Através de uma abstração da implementação podemos realizar substituições destes componentes por outros mais robustos sem muito esforço, desde que estes tenham a mesma especificação (interface). Ao desenvolver um componente é importante definir estas interfaces com cuidado, porque os serviços são providos através delas e para que no futuro não apareçam necessidades que não foram planejadas.
Os componentes IU do JSF são caracterizados por auxiliarem o desenvolvimento de elementos visuais com comportamento que pode ser alterado de acordo com a necessidade. Estes elementos podem ser reutilizados em vários contextos diferentes e estendidos para a composição de novos componentes.
Ao utilizar um componente IU, o desenvolvedor não precisa conhecer a implementação, ele precisa conhecer apenas a interface (contrato). Esta interface informa os atributos necessários (obrigatórios e não obrigatórios) para a utilização do componente.
O JSF oferece diversos componentes básicos para o desenvolvimento de aplicações web que utilizam HTML, entre eles, botões, caixas de texto, formulários, checkboxes, comboboxes e muitos outros. Contudo, durante o desenvolvimento, é comum surgir a necessidade de outros componentes mais avançados que não existam na biblioteca padrão. Nestes casos, o desenvolvedor pode criar os seus próprios componentes.
O uso de componentes no JSF tem como objetivo trazer a forma de criar programas desktops para o desenvolvimento web, buscando simplificar este desenvolvimento que é bem mais complexo por envolver diversas outras variáveis, como: request, response e escopo. Um exemplo de simplificação presente em todos os componentes IU está na comunicação entre a camada de visão (páginas) e a camada de controle, que é realizada através da chamada de managed beans nos atributos dos componentes.
Quando customizar componentes IU?
A customização de componentes deve ser realizada considerando alguns critérios que justifiquem sua implementação. Por isso, avalie os seguintes critérios antes de desenvolver seus próprios componentes:
...
