NetBeans Visual Web JSF

NetBeans Visual Web JSF Integrado com Spring 2.5, JPA e Hibernate

Criando uma aplicação passo a passo com Visual Web JavaServer Faces,

Spring 2.5 e Hibernate utilizando JPA

O Visual Web JavaServer Faces é um editor visual de páginas JavaServer Faces, no

estilo WYSIWYG (What You See Is What You Get), baseado no Java Studio

Creator IDE, da Sun Microsystems. Adaptado como pacote para o NetBeans IDE

5.5, ao qual podia ser instalado separadamente, foi incorporado na versão 6.0 do

NetBeans IDE, tornando-se parte de seu assistente de criação de páginas Web. Como seu desenvolvimento é baseado em componentes visuais arrastáveis, com

pouco código, o desenvolvedor pode criar páginas totalmente funcionais, integradas

com banco de dados através do uso de JDBC.

Embora o Visual Web JSF possa ser utilizado para desenvolver aplicações

integradas a outros frameworks, não há assistentes ou componentes visuais que o

façam até o momento. Neste artigo vamos usar esta ferramenta, examinando

alguns de seus recursos, guiando o leitor na construção de uma aplicação integrada

ao Spring Framework 2.5, Java Persistence API e Hibernate.

Visual Web JavaServer Faces na prática

O projeto utilizado neste artigo está baseado em apenas uma entidade, que é o

suficiente para ilustrar como integrar o Visual Web JSF com os demais frameworks.

Esta aplicação fará um CRUD (Create, Read, Update and Delete) de uma tabela

proposta de contatos e seu resultado final, em execução, será similar a Figura 1.

Figura 1. Tela do exemplo em funcionamento

Preparando o ambiente de desenvolvimento

Para acompanhar este artigo, será necessário a instalação do NetBeans (6.0 ou

superior) em conjunto com um servidor suportado de aplicações Web Java. O

NetBeans pode ser baixado em seu pacote específico para o desenvolvimento Web

(Web & Java EE), ao qual já inclui o GlassFish V2 e o Apache Tomcat 6, os quais

são pré-configurados na instalação. Outros servidores poderão ser usados, desde que sejam suportados pelo NetBeans.

Neste caso, será preciso adicioná-lo manualmente, através do menu

Tools>Servers>Add Server. Para o exemplo, será utilizado o Apache Tomcat que já

vem integrado ao programa.

Os plugins do Spring Framework e Hibernate para o NetBeans

O NetBeans possui um plugin para trabalhar com o Spring Framework,

automatizando tarefas como a geração dos arquivos e a adição das bibliotecas

exigidas pelo Spring. No NetBeans 6.0, Através do menu Tools>Plugins selecione “Spring Framework

Support” em Available Plugins e clique em Install (Figura 2). Após a instalação,

poderá ser necessário reiniciar o NetBeans.

No NetBeans 6.1 não é preciso fazer nada: o suporte ao Spring já vem instalado

por padrão, sendo que o plugin mudou de nome para “Spring Web MVC Support”.

Figura 2. Seleção do plugin Spring Framework Support para instalação

Criando o projeto e adicionando suporte ao Spring

Com o NetBeans aberto, selecione File>New Project>Web>Web Application.

Preencha o Project Name, ex.: “VisualWebJM”. Altere Server para Apache Tomcat

6.0.14, conforme a Figura 3.

Figura 3. Criando o projeto de exemplo

Na terceira etapa, conforme ilustrado na Figura 4, selecione o framework Visual

Web JavaServer Faces. Altere o nome do pacote em Default Java Package e, em

Servlet URL Mapping, mude para “*.faces”.

Figura 4. Seleção dos frameworks que serão usados no projeto

Após a criação do projeto, adicione o suporte ao Spring Framework através do

botão direito do mouse sobre Libraries, em Add Library>spring-framework-2.5>Add

Library. O plugin que fora instalado possui as bibliotecas do Hibernate e do Spring.

Algumas bibliotecas podem estar faltando. Para adicioná-las, acesse

Tools>Libraries>Libraries e selecione spring-framework-2.5. Clique no botão Add

JAR/Folder e selecione as bibliotecas faltantes. No momento em que escrevo, foi

preciso adicionar as bibliotecas do Hibernate, que estão separadas em três

downloads diferentes: jboss-archive-browsing.jar, hibernate-validator.jar

(Hibernate EntityManager 3.3.1) e javassist.jar (Hibernate Core 3.2.5), que devem

ser baixadas no site oficial do Hibernate (veja a seção “Links”)

No NetBeans IDE 6.1, foram separadas as bibliotecas, sendo necessário instalar os

plugins Hibernate Support e Hibernate 3.2.5 Library. Além dos plugins, será

necessário adicionar as bibliotecas citadas anteriormente.

O banco de dados utilizado e seu driver JDBC

Utilizaremos como banco de dados o MySQL, que já possui o driver JDBC pré-

configurado com o NetBeans IDE (versão 6.0 ou superior). A Listagem 1 mostra o

script para a criação da tabela que será usada no exemplo.

Listagem 1. Script da criação da tabela no MySQL

CREATE TABLE contato(

id int NOT NULL auto_increment,

nome varchar(50),

email varchar(50),

nascimento date,

telefone varchar(20),

PRIMARY KEY id_contato(id)

);

Após criar o banco de dados no MySQL e sua respectiva tabela (veja o quadro

“Executando instruções SQL pelo NetBeans”), volte ao NetBeans, na janela

Services, e com o botão direito do mouse sobre Databases selecione New

Connection. Em Basic setting>Name selecione MySQL (Connector/J driver).

Preencha Database URL com o acesso ao seu banco de dados e, em seguida, com o

nome de usuário e senha (veja Figura 5).

Figura 5. Criação de uma nova conexão com o banco de dados

Executando instruções SQL pelo NetBeans

É possível gerar a tabela pelo NetBeans executando o script da Listagem 1. Para

isso, siga os passos descritos a seguir: 1. Através da janela Services, em Databases, vá com o direito do mouse sobre

a conexão criada e selecione Connect;

2. Com o direito do mouse sobre Tables>Execute Command, digite o script da

tabela na janela SQL Command 1 e clique no botão Run SQL(Ctrl+Shift+E);

3. Verifique a saída na janela Output>SQL Command 1 Execution;

4. Para exibir a tabela criada em Services>“Sua conexão”>Tables, clique

novamente com o direito e selecione Refresh.

Por fim, será necessário adicionar o driver JDBC do MySQL ao projeto. Com o botão

direito do mouse em Libraries, selecione Add Library>MySQL JDBC Driver>Add

Library.

Criando a entidade Contato

Sem aprofundar na JPA, para o exemplo, teremos apenas uma entidade, chamada

de Contato, que será criada por um assistente do NetBeans. Acesse File>New

File>Persistence>Entity Classes from Database e, na segunda etapa do assistente,

selecione New Data Source, em Data Source. A caixa de diálogo será semelhante à

Figura 6. Dê um nome qualquer em JNDI Name, uma vez que mais adiante esta

informação será substituída. Selecione a conexão que foi criada anteriormente em

Database Connection e confirme.

Figura 6. Criação de um novo Data Source

Retornando ao assistente, teremos a tabela contato sendo exibida na coluna

Available Tables. Selecione-a e clique em Add > para colocá-la em Selected Tables

para avançar. Na última etapa do assistente, ilustrada pela Figura 7, observe que

em Class Names>Class Name há o nome da classe que será criada, que no caso é

Contato. Altere o nome do pacote, ex.: javamagazine.entity.

Figura 7. Criando uma entidade persistente

Por ser a primeira entidade persistente do projeto, o assistente exibe o botão

Create Persistence Unit. Acione este botão, ao qual exibirá a caixa de diálogo da

Figura 8.

Figura 8. Criando uma Unidade de Persistência

Uma Persistence Unit (Unidade de Persistência) é um conjunto de configurações de

persistência da JPA; toda entidade deve pertencer a uma P.U. Você pode

determinar qual nome quer dar à sua unidade de persistência, ex.: JavaMagazine.

O provedor JPA utilizado será o Hibernate, que já está selecionado graças ao plugin

Spring Framework, que adicionou suas bibliotecas ao projeto. Para o Data Source,

mantenha o criado para o exemplo e confirme no botão Create.

A Listagem 2 exibe o POJO, incluindo a anotação @GeneratedValue, que não é

adicionado pelo assistente. Incluímos manualmente esta anotação, pois desejamos

que o valor da chave-primária seja criado de forma automática.

Listagem 2. Código da entidade Contato

package javamagazine.entity;

import java.io.Serializable;

import java.util.Date;

import javax.persistence.*;

@Entity

@Table(name = "contato")

public class Contato implements Serializable {

private static final long serialVersionUID = 1L;

@Id

@GeneratedValue(strategy = GenerationType.IDENTITY)

@Column(name = "id", nullable = false)

private Integer id;

@Column(name = "nome")

private String nome;

@Column(name = "email")

private String email;

@Column(name = "nascimento")

@Temporal(TemporalType.DATE)

private Date nascimento;

@Column(name = "telefone")

private String telefone;

//getters and setters

}

Ao criar a entidade, o NetBeans também adicionou o arquivo de configuração da

persistência ao seu projeto em Configuration Files>persistence.xml. Altere-o como

mostrado na Listagem 3.

Listagem 3. Configuração do arquivo persistence.xml

<?xml version="1.0" encoding="UTF-8"?>

<persistence ...>

<persistence-unit name="JavaMagazine">

<provider>org.hibernate.ejb.HibernatePersistence</provider>

<properties>

<property name="hibernate.archive.autodetection"

value="class, hbm" />

<property name="hibernate.show_sql" value="true" />

<property name="hibernate.format_sql" value="true" />

<property name="hibernate.dialect"

value="org.hibernate.dialect.MySQLInnoDBDialect"/>

<property name="hibernate.connection.driver_class"

value="com.mysql.jdbc.Driver" />

<property name="hibernate.connection.url"

value="jdbc:mysql://localhost/javamagazine" />

<property name="hibernate.connection.username"

value="root" />

<property name="hibernate.connection.password"

value="" />

</properties>

</persistence-unit>

</persistence>

Acessando os dados

Embora o Spring sempre tenha suportado o trabalho com persistência de dados por

outras tecnologias de mapeamento objeto-relacional (ORM), tal tarefa sempre

necessitou do conhecimento específico da biblioteca de persistência em questão. A

JPA melhora a portabilidade das aplicações, pois várias ferramentas ORM

implementam sua API padronizada. Além disso, a injeção de dependências permite

implementar o padrão DAO sem a necessidade de muitas classes, evitando o uso de

“fábricas” de objetos para isolar as implementações das interfaces. Sobre o projeto, com o direito selecione New>Java Class. Preencha o nome da

classe ContatoDaoImp e o pacote javamagazine.dao. Altere a classe como

mostra a Listagem 4.

Listagem 4. A classe DAO

package javamagazine.dao;

import java.util.List;

import javamagazine.entity.Contato;

import javax.persistence.*;

import org.springframework.transaction.annotation.*;

@Transactional(readOnly = true)

public class ContatoDaoImp {

private EntityManager entityManager;

@PersistenceContext

public void setEntityManager(EntityManager entityManager) {

this.entityManager = entityManager;

}

protected EntityManager getEntityManager() {

return entityManager;

}

@Transactional(readOnly = false)

public Contato save(Contato contato) {

this.entityManager.persist(contato);

return (Contato) contato;

}


public void delete(Contato contato) {

if (!this.entityManager.contains(contato)) {

contato = this.entityManager.merge(contato);

}

this.entityManager.remove(contato);

}


public void update(Contato contato) {

this.entityManager.merge(contato);

}

public List<Contato> findAll() {

Query q = this.entityManager.createQuery("SELECT c FROM Contato c");

return q.getResultList();

}

}

Após a alteração da classe, com o direito sobre ela, acione Refactor>Extract

Interface. Selecione as opções mostradas na Figura 9 e clique no botão Refactor.

Figura 9. Extraindo a interface da classe ContatoDaoImp

A Listagem 3 contém o código do nosso DAO, com a adição das anotações

referentes ao Spring Framework. Com @Transactional, a classe fará o controle

transacional, e com o elemento <tx:annotation-driven /> no contexto da

aplicação, o Spring examinará todos os beans que contenham esta anotação.

Declarar a transação com o atributo readOnly=true (somente leitura) indica que

esta só fará leituras de dados. O atributo propagation indica o tipo de propagação

da transação.

Com a anotação @PersistenceContext, o Spring injeta um EntityManager no

serviço quando for instanciado. Esta anotação pode ser colocada no atributo ou

método setter. Graças a esta injeção, você possui um comportamento similar ao

oferecido pelo EJB 3, incluindo transações, só que sem a necessidade de um

contêiner EJB para isso. Capacitado pelo Spring de efetuar commit ou rollback nas

transações de forma transparente e no momento adequado, a aplicação adquire

uma das grandes vantagens que um EJB tem, só que rodando num contêiner web

simples e leve como o Tomcat.

Configurando o Spring

Com a criação do DAO, o Spring precisará ser configurado para que o acesso a

dados se apóie nos recursos do framework. Com o botão direito sobre WEB-INF, em Projects, acesse New>Other. Selecione

Spring Framework>Spring Beans Context file e prossiga. Altere para

applicationContext em File Name na segunda etapa. Na terceira etapa do

assistente, selecione o Namespace exibido na Figura 10 e confirme.

Figura 10. Seleção do namespace do arquivo de configuração do Spring

Framework

O assistente adicionará automaticamente os Namespaces utilizados pelo Spring em

seu arquivo de configuração. Resta configurar os beans que serão utilizados para

que o Spring possa gerir as transações e informá-lo da classe que será usada para

a injeção de dependências.

Para a execução em ambientes Java EE, utilizamos a factory

org.springframework.orm.jpa.LocalContainerEntityManagerFactoryBean:

<bean id="entityManagerFactory"

class="org.springframework.orm.jpa.LocalContainerEntityManagerFactoryBean">

<property name="persistenceUnitName" value="JavaMagazine" />

</bean>

Com a propriedade de LocalContainerEntityManagerFactoryBean especificamos

o nome da persistence unit do arquivo persistence.xml. É neste arquivo que temos

as configurações de acesso ao banco de dados pela JPA para realizar as operações

de persistência.

Para a configuração do controle transacional em uma aplicação baseada no Spring,

é necessário declarar um gerenciador. Neste caso, a classe

org.springframework.orm.jpa.JpaTransactionManager é utilizada para

trabalhar com a JPA, independente de provedor. A declaração da classe é ilustrada

no trecho a seguir:

<bean id="transactionManager"

class="org.springframework.orm.jpa.JpaTransactionManager">

<property name="entityManagerFactory" ref="entityManagerFactory" />

</bean>

JpaTransactionManager precisa de qualquer implementação de

javax.persistence.EntityManagerFactory para colaborar com EntityManager

produzido pela fábrica, para conduzir transações. O JpaTransactionManager é

recomendado para aplicações que utilizam apenas uma EntityManager.

Para que não tenhamos que fazer injeção de dependência do EntityManager em

todos os nossos DAOs, utilizamos a classe

org.springframework.orm.jpa.support.PersistenceAnnotationBeanPostProc

essor, que procura todas as classes anotadas com @PersistenceContext e faz a

injeção de dependência automaticamente:

<bean

class="org.springframework.orm.jpa.support.PersistenceAnnotationBeanPostProces

sor" />

A Listagem 5 exibe o arquivo de configuração do Spring que será utilizado pela

aplicação. Note que o bean contatoDao não contém referência ao bean

entityManagerFactory. O elemento <tx:annotation-driven> foi utilizado porque

configuramos as transações no DAO com a anotação @Transactional.

Listagem 5. Configuração do Spring para o exemplo

<?xml version="1.0" encoding="UTF-8"?>

<beans ...>



<bean id="entityManagerFactory"

class="org.springframework.orm.jpa.LocalContainerEntityManagerFactoryBean">

<property name="persistenceUnitName" value="JavaMagazine" />

</bean>



<bean

class="org.springframework.orm.jpa.support.PersistenceAnnotationBeanPostProces

sor" />



<bean id="transactionManager"

class="org.springframework.orm.jpa.JpaTransactionManager">

<property name="entityManagerFactory" ref="entityManagerFactory" />

</bean>



<tx:annotation-driven />

<bean id="contatoDao"

class="javamagazine.dao.ContatoDaoImp">

</bean>

</beans>

Para iniciar o Spring com a aplicação, o arquivo applicationContext.xml deverá ser

registrado por um listener em web.xml:

<listener>

<listener-class>

org.springframework.web.context.ContextLoaderListener

</listener-class>

</listener>

Para trabalhar com JPA, o Spring também fornece mais configurações. Caso queira

expandir mais adiante o exemplo, criando relacionamentos para outras entidades, é

importante entender que, como estamos trabalhando com o Hibernate, em alguns

casos você poderá utilizar a estratégia Lazy. Quando a aplicação termina de ler os

dados desta estratégia, a sessão é fechada, lançando uma exceção do tipo

LazyInitializationException caso alguma associação da entidade seja lida

posteriormente. Isso significa que temos de deixar a sessão do Hibernate aberta ou

inicializar todos os relacionamentos antes de renderizar a página. Ambas opções

podem causar problemas importantes de consumo de recursos do SGBD (como

conexões) ou de desempenho. Para evitar estes problemas, no Hibernate,

utilizamos um padrão chamado de "Open Session in View". Quando um servidor

web recebe uma requisição, esta é automaticamente filtrada pelo

Interceptador/Filtro, podendo executar qualquer código antes e depois da mesma.

Embora o exemplo deste artigo não trate de relacionamentos, muito menos sobre a

estratégia Lazy, é importante comentar que, no uso de JPA, teríamos que criar um

padrão semelhante para EntityManager1[1]. O Spring possui um filtro que

trabalha sobre este conceito, criando um padrão "Open EntityManager in View",

que deve ser configurado em web.xml, conforme o trecho mostrado:

<filter>

<filter-name>openEntityManager</filter-name>

<filter-class>

org.springframework.orm.jpa.support.OpenEntityManagerInViewFilter

</filter-class>

</filter>

Como alguns desenvolvedores podem não gostar do uso de Filtros para esta tarefa,

o Spring também possui um interceptador que faz o mesmo processo. A diferença

entre os dois é que o interceptador roda no contêiner Spring e é configurado em

applicationContext.xml, conforme o trecho mostrado:

<bean name="openEntityManagerInViewInterceptor"

class="org.springframework.orm.jpa.support.OpenEntityManagerInViewInterceptor

">

...

</bean>

Para este artigo, iremos utilizar o Filtro, como exemplo, onde na Listagem 6 é

exibida toda a configuração que deve ser adicionada em web.xml.

Listagem 6. Configurando o Spring Framework em web.xml

<listener>

<listener-class>

org.springframework.web.context.ContextLoaderListener

</listener-class>

</listener>

<context-param>

<param-name>contextConfigLocation</param-name>

<param-value>/WEB-INF/applicationContext*.xml</param-value>

</context-param>

<filter>


<filter-class>

org.springframework.orm.jpa.support.OpenEntityManagerInViewFilter

</filter-class>

</filter>

<filter-mapping>


<url-pattern>/*</url-pattern>

</filter-mapping>

O controle de acesso

O Facade ContatoController (veja Listagem 7) é a classe responsável pela lógica

de negócios, delegando chamadas à camada de acesso a dados e controle

transacional. Este controle de transações será administrado pelo Spring, através da

injeção no atributo contatoDao. Esta classe terá a injeção do Spring no managed

bean para trabalhar com o JavaServer Faces.

Listagem 7. A classe ContatoController

package javamagazine.controller;

import java.util.List;

import javamagazine.dao.ContatoDao;


public class ContatoController {

private ContatoDao contatoDao;

public ContatoDao getContatoDao() {

return contatoDao;

}

public void setContatoDao(ContatoDao contatoDao) {

this.contatoDao = contatoDao;

}

public void atualizar(Contato contato) {

contatoDao.update(contato);

}

public void salvar(Contato contato) {

contatoDao.save(contato);

}

public void excluir(Contato contato) {

contatoDao.delete(contato);

}

public List todos() {

return contatoDao.findAll();

}

}

Integrando o Visual Web JSF ao Spring

Para configurar o Spring de modo que ele possibilite se integrar ao JavaServer

Faces, é necessário adicionar o elemento variable-resolver, no arquivo faces-

config.xml, para chamar a classe DelegatingVariableResolver do framework:

<application>

<variable-resolver>

org.springframework.web.jsf.DelegatingVariableResolver

</variable-resolver>

</application>

A classe DelegatingVariableResolver é capaz de resolver beans declarados no

Spring e injetá-los no managed bean de forma transparente. Esta injeção é

indicada com a sintaxe #{bean nomeado no Spring}, a mesma utilizada pelo

JSF para injetar dependências nos managed beans. Isso indica que nosso managed

bean deixa de ser responsável por instanciar o objeto que irá utilizar e passa a

recebê-lo do Spring. A Listagem 8 mostra o managed bean ContatoController

configurado em faces-config.xml.

Listagem 8. Configuração da integração do JSF com o Spring

<faces-config ...>

<application>

<variable-resolver>

org.springframework.web.jsf.DelegatingVariableResolver

</variable-resolver>

</application>

<managed-bean>

<managed-bean-name>ContatoController</managed-bean-name>

<managed-bean-class>

javamagazine.controller.ContatoController

</managed-bean-class>

<managed-bean-scope>session</managed-bean-scope>

<managed-property>

<property-name>contatoDao</property-name>

<value>#{contatoDao}</value>

</managed-property>

</managed-bean>

<managed-bean>

<managed-bean-name>SessionBean1</managed-bean-name>

<managed-bean-class>javamagazine.SessionBean1</managed-bean-class>

<managed-bean-scope>session</managed-bean-scope>

</managed-bean>

<managed-bean>

<managed-bean-name>Page1</managed-bean-name>

<managed-bean-class>javamagazine.Page1</managed-bean-class>

<managed-bean-scope>request</managed-bean-scope>

</managed-bean>

<managed-bean>

<managed-bean-name>ApplicationBean1</managed-bean-name>

<managed-bean-class>javamagazine.ApplicationBean1</managed-bean-

class>

<managed-bean-scope>application</managed-bean-scope>

</managed-bean>

<managed-bean>

<managed-bean-name>RequestBean1</managed-bean-name>

<managed-bean-class>javamagazine.RequestBean1</managed-bean-class>

<managed-bean-scope>request</managed-bean-scope>

</managed-bean>

</faces-config>

Acessando o Facade pelo Visual Web JSF

Para acessarmos a classe ContatoController, e seus métodos através do Design

do Visual Web JSF, serão necessários alguns passos a mais do que comumente

seria se estivéssemos trabalhando com instruções SQL diretamente, através do uso

direto de JDBC disponível pela ferramenta. Como o padrão do Visual Web JSF é

trafegar em um escopo de sessão (veja no quadro “Os escopos de uma aplicação

com Visual Web JSF”), vamos abrir a classe SessionBean1 para fazer esta

integração. Através do arquivo Page1.jsp, em Design, dê um duplo clique em

Navigation>SessionBean1. Como estamos usando JPA, e não acesso direto ao

banco de dados, será preciso converter os dados para que estes se tornem

acessíveis visualmente pelo Visual Web JSF. Para o caso, os dados foram

convertidos em Array, tornando-os acessíveis ao componente Table visualmente. O

acesso à classe ContatoController será feito através do método getBean(), de

com.sun.rave.web.ui.appbase.FacesBean, uma classe da biblioteca do Visual

Web. Este método retorna qualquer atributo armazenado em um escopo de sessão

sob o nome especificado. Desta forma, será possível manipular os métodos

existentes na classe determinada, como no caso de ContatoController.

Como temos apenas um formulário para manipular os contatos (cadastro e

alteração), haverá a necessidade de armazenar a identificação do contato

selecionado no componente Table. Claro que o campo escolhido é o id do contato,

que será armazenado em sessão para resgatarmos no momento de salvarmos os

dados alterados.

Para finalizar, nas alterações desta classe, adicione no método void init() uma

chamada ao método todosContatos(). O método init() inicializa o que houver em

seu escopo antes do carregamento do aplicativo e antes de componentes

gerenciados serem inicializados (ver Listagem 9). Em outras palavras, a página do

aplicativo obterá os dados encontrados no banco, podendo preencher a tabela com

os contatos existentes antes desta ser renderizada. Ao salvar as alterações, vá ao

menu Build>Build Main Project para compilar as classes. Esse passo é importante

para que torne essas alterações na classe acessíveis visualmente pelo Design.

Listagem 9. Alterações na classe SessionBean1

package javamagazine;

import com.sun.rave.web.ui.appbase.AbstractSessionBean;

import javamagazine.controller.ContatoController;


import javax.faces.FacesException;

public class SessionBean1 extends AbstractSessionBean {

// omitidos por não haver alterações...

public void init() {


todosContatos();

}


protected ContatoController getContatoController() {

return (ContatoController) getBean("ContatoController");

}

//array de Contato

private Contato[] contatos;

public Contato[] getContatos() {

return contatos;

}

public void setContatos(Contato[] contatos) {

this.contatos = contatos;

}

//carrega todos os contatos

public void todosContatos() {

contatos = (Contato[]) getContatoController().

todos().toArray(new Contato[0]);

}

//transporta em sessão o ID selecionado para atualização

private Integer id = null;

public Integer getId() {

return id;

}

public void setId(Integer id) {

this.id = id;

}

}

Os escopos de uma aplicação com Visual Web JSF

Ao criar um projeto com o framework Visual Web JSF, dentro do pacote padrão, são

colocadas três classes que representam os escopos da aplicação. Quando a

aplicação é executada em um servidor, esta consiste de vários objetos cujos ciclos

de vida dependem do escopo. Um exemplo comum é uma página, que possui

escopo de requisição. Entretanto, há casos que precisamos de um tempo maior,

onde há uma comunicação com o servidor para que este possa saber que o usuário

ainda permanece naquele estado. Este é um caso de um carrinho de compras, por

exemplo. Enquanto o usuário permanecer na página comprando, haverá o

preenchimento do carrinho até que seja esvaziado ou a página seja fechada. Este é

um escopo de sessão, que dura enquanto a “sessão” estiver aberta (ou o

navegador). Por padrão, a menos que seja alterado nas configurações do NetBeans,

os dados trafegam em um escopo de sessão. É evidente que isso pode ser alterado,

utilizando um escopo de requisição através da classe RequestBean1. A classe ApplicationBean1 possui uma estrutura parecida com SessionBean1,

contendo objetos com um escopo de aplicação.

Desenvolvendo a página

O Visual Web JSF possui diversos componentes que podem ser acessados através

da janela Palette. Se você já trabalhou com ferramentas visuais como Delphi, Visual

Studio .NET ou até mesmo com o próprio editor visual de aplicações Swing do

NetBeans, perceberá que o Visual Web JSF é semelhante. A Figura 11 representa

o resultado final do desenho da página, cuja criação explicamos passo a passo a

seguir.

Figura 11. Desenho da aplicação

1. Arraste da janela Palette o componente Static Text para o Design da página.

Posicione-o e digite “Cadastro de Contatos”;

2. Insira quatro componentes Label na página, um abaixo do outro e os alinhe.

Na janela Properties, digite em text os seguintes rótulos: “Nome:”, “E-mail:”,

“Telefone:” e “Nascimento:”;

3. Arraste quatro componentes Text Field, ao lado de cada um dos rótulos

inseridos. Altere a propriedade id na seqüência: “nome”, “email”, “telefone” e

“nascimento”;

4. Pressionando <Shift>, selecione com um clique cada, os componentes:

“nome” e “email”. Na janela Properties altere columns para 40;

5. Selecione o Text Field “nascimento” e em Properties altere Converter>(New

DateTimeConverter)2[2];

6. Na janela Navigator expanda Page1 e selecione dateTimeConverter1. Altere

timezone para o seu fuso horário, ex.: America/Sao_Paulo;

7. Adicione o componente Button na página e altere sua propriedade id para

“btSalvar” e text para “Salvar”;

8. Para finalizar, adicione o componente Message Group logo abaixo do

formulário.

Exibindo os contatos

Para exibir os contatos, utilizaremos o componente Table, que será arrastado para

a página abaixo do formulário criado, conforme a Figura 11. Com o botão direito do mouse, selecione Table Layout no menu de contexto. Na

caixa de diálogo (veja Figura 12), altere para contatos em Get Data From. Caso

esta opção não esteja sendo exibida, faça o “build” na classe SessionBean1.

Figura 12. Definindo o layout da tabela

Na caixa Selected surgirão os campos de Contato. Selecione cada um e alterando

sempre em Column Detail>Header Text o rótulo do cabeçalho que representa cada

coluna na tabela. Mude a ordem das colunas conforme a Figura 11, utilizando os

botões Up e Down.

Adicione duas novas colunas através do botão New. Altere Header Text e Value

Expression do primeiro para “Editar” e do segundo para “Excluir”. Em Component

Type mude para Hyperlink. As colunas adicionadas serão links que executarão

comandos. As demais existentes são componentes estáticos (Static Text).

Na guia Options altere Title para “Lista de Contatos”. Confirme as mudanças

clicando em OK.

Na tabela, selecione o texto estático da coluna “Nascimento” e altere a propriedade

Converter>dateTimeConverter1, conforme aponta a Figura 13. Perceba que este

conversor é o mesmo utilizado para o campo Text Field “nascimento” do formulário.

Este conversor tornará a representação da data pelo browser diferente da forma

original encontrada no objeto java.util.Date.

Figura 13. Texto estático da coluna nascimento selecionado e alteração do

converter

Você poderá dimensionar a largura da coluna arrastando, bastando somente

selecionar o título da mesma. A propriedade width poderá ser usada caso queira

maior precisão.

Adicionando código aos componentes

Agora que temos a parte visual definida, nos resta adicionar a lógica para fazê-la

funcionar. Dê um duplo clique no link Editar da tabela de sua página. Ao fazer esta

ação, perceba que o Visual Web JSF o colocou em Java, na classe Page1.java, que

é o bean de Page1.jsp. Automaticamente foi gerado um código, que representa o

método que será invocado pelo link:

public String hyperlink1_action(){

return null;

}

Ao mesmo tempo, se colocar em JSP, verá que também foi adicionado o atributo

actionExpression="#{Expressão}" em <webuijsf:hyperlink>. Isso significa

que ao clicar no link Editar, automaticamente você invocará os eventos

determinados no método hyperlink1_action(). No Design, podemos ver em

Properties>Events>action.

No NetBeans 6.1, alguns passos a mais serão necessários para trabalhar com os

componentes que estamos utilizando neste exemplo. Clique com o direito do

mouse, na janela Navigator, em table1>tableRowGroup1 e selecione Add Binding

Attribute no menu de contexto. O mesmo deverá ser feito para os TextFields:

nome, email, telefone e nascimento.

Retornando para Java, adicione o código da Listagem 10 para o link Editar do

componente Table.

Listagem 10. Código do link Editar

//link Editar do componente Table

public String hyperlink1_action() {

//pega a linha selecionada

RowKey rowKey = getTableRowGroup1().getRowKey();

//armazena o id do contato

getSessionBean1().setId(Integer.parseInt(rowKey.getRowId()));

//retorna null por não haver navegação

return null;

}

Retorne para o Design e dê um duplo clique agora sobre o link Excluir da tabela.

Adicione o código da Listagem 11. Em seguida, faça o mesmo procedimento com

o botão Salvar do formulário e altere como na Listagem 12.

Listagem 11. Código do link Excluir

//link Excluir do componente Table

public String hyperlink2_action() {

try {

//captura a linha atual do link de exclusão clicado

RowKey rowKey = getTableRowGroup1().getRowKey();

if (rowKey != null) {

Contato[] contatos = getSessionBean1().getContatos();

Integer id = Integer.parseInt(rowKey.getRowId());

//seleciona somente o contato que será removido

Contato contato = contatos[id];

//chama o controller para excluir o contato selecionado

getSessionBean1().getContatoController().excluir(contato);

//limpa o ID de SessionBean1 caso esteja com valor

getSessionBean1().setId(null);

}

//limpa os campos existentes

//caso esteja preenchidos

nome.setText(null);

email.setText(null);

nascimento.setText(null);

telefone.setText(null);

//informa ao usuário a exclusão

info("Contato excluído!");

} catch (Exception ex) {

//exibe o erro ao usuário

info("Erro encontrado: " + ex);

}

//retorna nulo por não mudar de página

return null;

}

Listagem 12. Código do botão Salvar

//botão Salvar do formulário

public String btSalvar_action() {

Integer id = getSessionBean1().getId();

//se houver algo em edição

if (id != null) {


//seleciona somente o contato que será editado


//altera seus valores em Contato

contato.setNome(nome.getText().toString());

contato.setEmail(email.getText().toString());

contato.setNascimento((java.util.Date) nascimento.getText());

contato.setTelefone(telefone.getText().toString());

//chama a atualização de ContatoController

getSessionBean1().getContatoController().atualizar(contato);

//limpa o ID de SessionBean1 caso esteja com valor

getSessionBean1().setId(null);

//informa que foi atualizado ao usuário

info("Contato atualizado!");

} else { //caso seja um novo registro

//cria um novo Contato

Contato contato = new Contato();

//atribui a este contato os valores definidos

//nos campos do formulário da página

contato.setNome(nome.getText().toString());

contato.setEmail(email.getText().toString());

contato.setNascimento((java.util.Date) nascimento.getText());

contato.setTelefone(telefone.getText().toString());

//salva pelo método de ContatoController

getSessionBean1().getContatoController().salvar(contato);

//informa que foi salvo ao usuário

info("Contato salvo!");

}

//limpa os campos existentes

//caso esteja preenchidos

nome.setText(null);

email.setText(null);

nascimento.setText(null);

telefone.setText(null);

return null;

}

Para manipular um componente Table, o Visual Web JSF utiliza a classe

TableDataProvider, um provedor de dados próprio, que fornece acesso a um

conjunto de informações organizadas por linhas-chaves. Uma estratégia utilizada

por TableDataProvider é armazenar a chave primária da fonte de dados dentro

de um objeto RowKey. Nas Listagens 10 e 11 temos a manipulação do objeto

com.sun.data.provider.RowKey, que é um índice em uma linha de dados de um

componente Table.

Muitos dos métodos para manipular a linha de dados, fornecida pela tabela, usam

RowKey para sua identificação. Para conseguir a linha selecionada, chamamos o

método getRowKey(), do objeto tableRowGroup1 (o nome do grupo do

componente Table inserido na página), através de getTableRowGroup1(), onde

obtemos o RowKey.

Com o método String getRowId(), obtemos o valor de identificação da linha,

necessário para identificar qual contato será excluído ou editado. Para a exclusão, o

array contatos, encontrado em SessionBean1, é utilizado para retornar somente

um objeto Contato, que é transmitido ao método excluir() de

ContatoController.

No caso da edição, este valor é transmitido pela classe SessionBean1, através do

atributo id, para que o mesmo possa ser recuperado durante o ciclo de exibição dos

dados no formulário e sua conseqüente submissão para alteração.

Já no botão Salvar, temos duas tarefas a cumprir na submissão do formulário:

atualizar ou adicionar dados. O método btSalvar_action(), chamado pelo botão,

fará uma verificação se há em sessão o id do contato que será atualizado. Se

houver, transmite os valores do formulário para Contato e chama o método

atualizar() de ContatoController. No caso de salvar, simplesmente é criado um

novo objeto Contato, que receberá os valores do formulário e seqüencialmente

será transmitido para salvar() de ContatoController.

Para a manipulação dos campos do formulário, perceba que utilizamos o método

getText(), que retorna java.lang.Object, para recuperar os dados encontrados

em cada um dos componentes Text Field. O método setText() fora utilizado para

transmitir valores nulos com o intuito de limpar os campos após sua utilização.

O componente Message Group é chamado, através do método info(), nas

operações de salvar, excluir e atualizar, para informar ao usuário se a operação foi

executada com sucesso.

Para finalizar, na edição dos dados, precisamos antes preencher o formulário. Note

que o link Editar da tabela possui apenas algumas linhas, transmitindo o id apenas

do contato selecionado. Para que o formulário funcione para edição, teremos que

captar este valor antes da página ser renderizada e transmiti-lo, através de

Contato, preenchendo cada campo separadamente. É exatamente este o papel do

método “Callback” prerender(), exibido na Listagem 13, com o código necessário

para tal operação. Além do papel fundamental que o método prerender() tem

para a edição dos dados, este também será responsável por sincronizar o

componente Table com os dados encontrados no banco de dados, sempre que

houver uma operação sobre os mesmos. Isso será feito chamando o método

todosContatos() de SessionBean1.

Listagem 13. Código do método prerender()

public void prerender() {

//capta o id armazenado em SessionBean1

Integer id = getSessionBean1().getId();

//se não for nulo, é porque está em edição

if (id != null) {

//capta os contatos


//filtra somente o selecionado para edição


//preenche os campos do formulário

nome.setText(contato.getNome());

email.setText(contato.getEmail());

nascimento.setText(contato.getNascimento());

telefone.setText(contato.getTelefone());

}

//atualiza todos os contatos

//para o componente Table

getSessionBean1().todosContatos();

}

Customizando a saída na janela Output

A biblioteca de logging Log4j permite gerar uma saída organizada do que está

acontecendo com a aplicação. Para fazê-lo, com o direito sobre Source Packages

selecione New>Other. Em New File>Other>Properties File, clique no botão Next.

Preencha com log4j em File Name e confirme. A Listagem 14 exibe o arquivo

log4j.properties. Ao executarmos a aplicação dentro do NetBeans, os logs serão

exibidos pela janela Output.

Listagem 14. Arquivo log4j.properties

log4j.appender.stdout=org.apache.log4j.ConsoleAppender

log4j.appender.stdout.Target=System.out

log4j.appender.stdout.layout=org.apache.log4j.PatternLayout

log4j.appender.stdout.layout.ConversionPattern=%d{ABSOLUTE} %5p %c{1}:%L

- %m%n

log4j.rootLogger=debug, stdout

log4j.logger.org.hibernate=debug

log4j.logger.org.hibernate.hql=on

log4j.logger.org.springframework = info

Conclusões

Neste artigo foi mostrado que o Visual Web JSF possui flexibilidade para trabalhar

com outros frameworks, através de um exemplo prático utilizando o Spring, o

Hibernate e a JPA. Aprendemos também que o Spring Framework, suportado mais facilmente pelo

NetBeans através de um plugin, simplificou seu desenvolvimento com anotações,

integrando suavemente com a JPA, com pouca escrita em arquivo XML.

Um fator importante no trabalho com Visual Web JSF é sua facilidade de desenhar

aplicações JavaServer Faces, com componentes arrastáveis no estilo WYSIWYG, o

que poupa muito trabalho do desenvolvedor. Embora suas configurações sejam

visuais, compreender a estrutura do JavaServer Faces para trabalhar com o Visual

Web JSF é importantíssimo, mesmo tendo a grande maioria de seus componentes

específicos à ferramenta.

Vimos também que é simples integrar o Visual Web a outras tecnologias, mesmo as

que carecem de suporte direto. Assim, você não fica limitado a usar componentes,

bibliotecas ou frameworks que sejam suportados “de fábrica” pelo Visual Web –

mesmo o desenvolvimento visual pode ser habilitado para componentes de

terceiros.

NetBeans Visual Web JSF

Documents

Transcript of NetBeans Visual Web JSF