Download - JSF com Primefaces
JavaServer Faces e
Primefaces
Palestrante:
Jean Paulo da Silva
JavaServer Faces e PrimefacesINTRODUÇÃO
• Complexidade das aplicações web
• Enorme quantidade de recursos pra se gerenciar
• Aplicações corporativas
• Complexidade e desordem nos códigos, dificultando a
manutenção
• Pouca ou nenhuma dinamicidade e reusabilidade, diminuindo
a produtividade
• Problemas na utilização de lógicas de negócio mais
complexas
• Desempenho
• Segurança
JavaServer FacesINTRODUÇÃO
• Framework para construção de interfaces web em Java
• Implementação de referência da especificação JSR-314
• Possui um conjunto de componentes pré-fabricados
• Programação orientada a eventos
• Permite a união entre apresentação visual, lógica da
aplicação e lógicas de negócio
JavaServer FacesARQUITETURA
JavaServer FacesCONFIGURAÇÃO
• Configuração do servidor (Tomcat)
• Criação do projeto: New/Dynamic Web Project
JavaServer FacesCONFIGURAÇÃO
• Configuração do arquivo web.xml
• Inclusão das bibliotecas (WebContent)
Classes
Páginas/CSS/JavaScript/Imagens
Bibliotecas
Configurações
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• Componentes UI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• Componentes UI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
Arquitetura MVCModel View Controller
Arquitetura MVCModel View Controller
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• Os componentes UI se mantém sincronizados com
objetos java do lado servidor
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
RADRapid Application Development
Características:
• Arquitetura fundamental de componentes
• Arquitetura extensível para geração de componentes de
terceiros
• Um conjunto de componentes padrão
• Infra-estrutura de aplicação
• É uma ferramenta
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• Componentes UI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
ManagedBeans
• Coleta inputs dos usuários nos componentes de
formulários
• Manipulação dos componentes de forma dinâmica
• Intermediar a comumicação entre as páginas
(componentes JSF) e o modelo
• Trabalham com objetos do modelo para executar lógica
de negócio
• Manipulação de eventos de interface
• JSF 2.0 - @ManagedBean
• JSF 1.x – faces-config.xml
ManagedBeansESCOPOS
• @RequestScoped – Escopo de requisição
– O managed bean é instanciado e permanece disponível durante
o tempo da requisição HTTP
– Recomendado quando o interesse é a economia de recursos do
servidor
– Quando os dados não precisam ser mantidos de uma requisição
pra outra
• @SessionScoped – Escopo de sessão
– O managed bean é instanciado no momento de uma requisição
e só finaliza quando a sessão é finalizada
– Recomendado quando o interesse é guardar os estados dos
objetos a medida em que se vai realizando a navegação, pois os
mesmos são mantidos mesmo em caso de uma nova requisição
– Exemplo: Carrinho de compras
ManagedBeansESCOPOS
• @ApplicationScoped – Escopo de aplicação
– O managed bean é instanciado no momento em que a aplicação
é iniciada no servidor com o atributo eager setado em true, caso
contrário, é instanciado na primeira requisição feita ao bean
– Recomendado em caso de disponibilização de serviços que
precisam estar sempre disponíveis
• @ViewScoped – Escopo de visualização
– O managed bean é instanciado no momento em que é feita uma
requisição para uma página que use seus objetos e é destruído
quando os seus objetos não são mais utilizados pela página
– Meio termo entre @RequestScoped e @SessionScoped
– Recomendado em caso de utilização de aplicações que utilizem
AJAX, ou seja, que atualizam parte da página ou toda ela
ManagedBeansESCOPOS
• @NoneScoped – Nenhum escopo
– Os objetos do managed bean não são instanciados pela
camada de visão, mas podem ser utilizados por outros managed
beans conforme a necessidade
– Recomendado quando os objetos ou métodos não tem ligação
direta com alguma página
• @CustomScoped – Escopo personalizado
– Escopo definido conforme a necessidade do desenvolvedor,
implementado em uma classe auxiliar que define as
características do escopo como ciclo de vida, acessibilidade,
estrutura de dados e outros
ManagedBeansEXEMPLO
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• ComponentesUI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
Componentes UI
• Componentes que gerenciam a interação com o usuário
• São armazenados numa árvore no servidor (view)
• Tags interpretadas para apresentação (html)
• Tag Libraries h e f
• h: tags de componentes que combinam tags HTML
com objetos UIComponent definidos na
especificação JSF
• f : tags com ações independentes do HTML
Componentes UI
• Sujeito a estilização (css)
• Interação com funções JavaScript e com objetos e
métodos do lado servidor (ManagedBean)
Componentes UIEXEMPLOS
• Componentes:
• <h:body/> <h:head/> <h:form/>
• <h:ouptutText value="Texto estático" />
• <h:ouptutText
value="#{contatoBean.txtDinamico}"/>
• <h:ouptutLabel /> //atributo for
• <h:graphicImage value="/images/img1.jpg"
width="400" height="150"/>
• <h:panelGrid columns="3"
Componentes UIEXEMPLOS
• Entrada de dados:
• <h:inputText id="itNome"
value="#{contatoBean.nome}"
size="40" maxlength="40"
style="font-size: 15px;"/>
• <h:inputHidden/>
• <h:inputTextArea cols="150"
rows="4" />
• <h:inputSecret />
Componentes UIEXEMPLOS
• Selects:• <h:selectBooleanCheckbox value="true" />
• <h:selectOneRadio value="#{contatoBean.tipo}">
<f:selectItem id="item1" itemLabel="Amigo"
itemValue="Amigo" />
<f:selectItem id="item2" itemLabel="Conhecido"
itemValue="Conhecido" />
<f:selectItem id="item3" itemLabel="Trabalho"
itemValue="Trabalho" />
<f:selectItem id="item4" itemLabel="Família"
itemValue="Família" />
</h:selectOneRadio>
Componentes UIEXEMPLOS
• Selects:• <h:selectOneListBox value="#{contatoBean.tipo}">
<f:selectItem id="item1" itemLabel="Amigo"
itemValue="Amigo" />
<f:selectItem id="item2" itemLabel="Conhecido"
itemValue="Conhecido" />
<f:selectItem id="item3" itemLabel="Trabalho"
itemValue="Trabalho" />
<f:selectItem id="item4" itemLabel="Família"
itemValue="Família" />
</h:selectOneListBox>
Componentes UIEXEMPLOS
• Selects:• <h:selectOneMenu value="#{contatoBean.tipo}">
<f:selectItem id="item1" itemLabel="Amigo"
itemValue="Amigo" />
<f:selectItem id="item2" itemLabel="Conhecido"
itemValue="Conhecido" />
<f:selectItem id="item3" itemLabel="Trabalho"
itemValue="Trabalho" />
<f:selectItem id="item4" itemLabel="Família"
itemValue="Família" />
</h:selectOneMenu>
Componentes UIEXEMPLOS
• Tabela:• <h:dataTable value="#{contatoBean.contatos}"
var="con" border="1">
<h:column>
<f:facet name="header">Nome</f:facet>
<h:outputText value="#{con.nome}" />
</h:column>
<h:column>
<f:facet name="header">Telefone</f:facet>
<h:outputText value="#{con.telefone}"/>
</h:column>
</h:dataTable>
Componentes UIEXEMPLOS
• Actions e Listeners:
• <h:commandButton value="Executar“
action="#{contatoBean.executar}"
alt="Executa uma ação"
image="../images/executar.png"/>
• <h:commandLink value="Executar“
action="#{contatoBean.executar}"/>
• <h:outputLink value="www.b3informatica.com">
B3 Informática
</h:outputLink>
• <h:button outcome="page.xhtml" value="Contato"/>
• <h:link outcome="page.xhtml" value="Contato"/>
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• ComponentesUI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
Validators
• Validadores padrão e validadores customizados
• Impedem as ações e exibem mensagens
• Atributo “required”
• Ex.: <h:inputText id="itNome"
value="#{contatoBean.nome}"
required="true"
requiredMessage="Deu erro!"/>
Validators
• Validadores implícitos (padrão)
• Ex.:
• <f:validateLength maximum="10" />
• <f:validateDoubleRange
minimum="10" maximum="100" />
• <f:validateLongRange
minimum="10" maximum="100" />
• <f:validateRegex pattern=" ^[0-9]" />
Validators
• Validadores customizados:
• implements javax.faces.validator.Validator
• public void validate(FacesContext context,
UIComponent component,
Object value)
Validators
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• ComponentesUI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
Converters
• Conversão de valores de entrada e de saída
• Conversores implícitos para tipos primitivos
• Disparam mensagens que podem ser configuradas
(converterMessage)
• Impedem as ações
• Conversores padrão e customizados
Converters
• Conversores padrão:
Converters
• Conversores padrão:
Converters
• Conversores customizados:
• implements Converter
• @FacesConverter
• Métodos:
• public Object getAsObject(FacesContext context,
UIComponent component, String valor);
• public String getAsString(FacesContext context,
UIComponent component, String valor);
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• ComponentesUI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
Eventos e Listeners
• Eventos
• Atributo action aponta para um método no bean
• Retorno void ou String apontando para próxima
página
• Exemplo:
Eventos e Listeners
• Listeners
• Retorno void e parâmetro referente ao listener
utilizado
• Exemplo:
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• ComponentesUI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
Controle de Navegação
• JSF 1.x
• faces-config.xml
• navigation-rule
• JSF 2
• Retorno dos métodos através de chamadas
declaradas no atributo action
• Não há necessidade de retorno das extensões
• ?faces-redirect=true para redirecionamento de url
Controle de Navegação
• Exemplos:
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• ComponentesUI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
Mensagens
• Globais:
• <h:messages showDetail=“true”/>
• Locais:
• <h:message for=“id_do_componente”/>
• Disparadas no managedBean:
• FacesMessage msg =
new FacesMessage(mensagem, detalhes);
• FacesContext.getCurrentInstance().addMessage(
clientId, msg);
Mensagens
• FacesMessage msg = new FacesMessage(severity,
mensagem, detalhes);
• Severity = Tipos de Mensagem
• FacesMessage.SEVERITY_ERROR
• FacesMessage.SEVERITY_FATAL
• FacesMessage.SEVERITY_INFO
• FacesMessage.SEVERITY_WARN
JavaServer FacesCARACTERÍSTICAS
• Arquitetura MVC
• RAD
• ManagedBeans
• ComponentesUI
• Validators
• Converters
• Eventos e Listeners
• Controle de Navegação
• Mensagens
• Internacionalização
Internacionalização
• O JavaServer Faces oferece suporte à
internacionalização, possibilitando que a aplicação seja
visível em vários idiomas
• Configuração:
• faces-config.xml (global)
• <f:loadBundle/> (local)
InternacionalizaçãoPASSO A PASSO
• Criação do arquivo nomeArquivo_abreviacao.properties
• Exemplos:
InternacionalizaçãoPASSO A PASSO
• faces-config.xml
• teste
PrimefacesINTRODUÇÃO
• Biblioteca de componentes para JSF de código aberto
• Possui um rico conjunto com mais de 100 componentes
de interface
• Suporte nativo a Ajax
• Mais de 30 temas pré-definidos, oferecendo a
possibilidade de criação de temas
• Documentação de fácil acesso e demonstração do uso
dos componentes disponíveis no site
http://www.primefaces.org/showcase
PrimefacesSHOWCASE
PrimefacesINTRODUÇÃO
• Download do jar
http://www.primefaces.org/downloads.html
• WebContent/WEB-INF/lib
• Utilização da tag
PrimefacesINTRODUÇÃO
• Ajax – atributo update
• Sintaxe: update="id_form1:id_comp1 id_form2:id_comp2
id_formn:id_compn"
• Exemplo:
• Atributo ajax=“false” (padrão ajax=“true”)
PrimefacesCOMPONENTES
• Showcase - http://www.primefaces.org/showcase
• Alteração de temas:
• Download jar - http://www.primefaces.org/themes.html
• WebContent/WEB-INF/lib
• web.xml