JSF com Primefaces

JavaServer Faces e Primefaces Palestrante: Jean Paulo da Silva

JavaServer Faces e Primefaces INTRODUÇÃ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 Faces INTRODUÇÃ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 Faces CONFIGURAÇÃO • Configuração do servidor (Tomcat) • Criação do projeto: New/Dynamic Web Project

JavaServer Faces CONFIGURAÇÃO • Configuração do arquivo web.xml • Inclusão das bibliotecas (WebContent) Classes Páginas/CSS/JavaScript/Imagens Bibliotecas Configurações

JavaServer Faces CARACTERÍSTICAS • Arquitetura MVC • RAD • ManagedBeans • Componentes UI • Validators • Converters • Eventos e Listeners • Controle de Navegação • Mensagens • Internacionalização

Arquitetura MVC Model View Controller

JavaServer Faces CARACTERÍ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

RAD Rapid 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

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

ManagedBeans ESCOPOS • @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

ManagedBeans ESCOPOS • @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

ManagedBeans ESCOPOS • @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

JavaServer Faces CARACTERÍ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 UI EXEMPLOS • 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 UI EXEMPLOS • 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 UI EXEMPLOS • 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 UI EXEMPLOS • 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 UI EXEMPLOS • 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 UI EXEMPLOS • 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 UI EXEMPLOS • 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"/>

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)

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 customizados: • implements Converter • @FacesConverter • Métodos: • public Object getAsObject(FacesContext context, UIComponent component, String valor); • public String getAsString(FacesContext context, UIComponent component, String valor);

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:

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:

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

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ção PASSO A PASSO • Criação do arquivo nomeArquivo_abreviacao.properties • Exemplos:

Internacionalização PASSO A PASSO • faces-config.xml • teste

Primefaces INTRODUÇÃ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

Primefaces INTRODUÇÃO • Download do jar http://www.primefaces.org/downloads.html • WebContent/WEB-INF/lib • Utilização da tag

Primefaces INTRODUÇÃ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”)

Primefaces COMPONENTES • Showcase - http://www.primefaces.org/showcase • Alteração de temas: • Download jar - http://www.primefaces.org/themes.html • WebContent/WEB-INF/lib • web.xml

Contato: Telefone: (45) 3576-7064 E-mail: b3@b3informatica.com Site: www.b3informatica.com

JSF com Primefaces

Mais conteúdo relacionado

Mais procurados

Destaque

Semelhante a JSF com Primefaces

JSF com Primefaces