Curso jsf

9.278 visualizações

Publicada em

Curso de JSF da VerdeSource

0 comentários
6 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
9.278
No SlideShare
0
A partir de incorporações
0
Número de incorporações
223
Ações
Compartilhamentos
0
Downloads
605
Comentários
0
Gostaram
6
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Curso jsf

  1. 1. JSF<br />Introdução<br />
  2. 2. Introdução<br />Desenvolvimento Web<br />Aplicações web tornam-se mais e mais importantes <br />Mais e mais complexas:<br />Ajax, validação (server vs. client), efeitos... <br />Exigência mais elevada do cliente durante os anos <br />Interfaces ricas (fáceis de usar) <br />Prazos cada vez mais curtos <br />Desenvolvimento considerado difícil <br />
  3. 3. Introdução<br />Surgiram diversos frameworks MVC:<br />Apache Struts<br />WebWork (Struts2) <br />Spring MVC <br />Tapestry<br />JbossSeam<br />E muito outros.. continuam surgindo mais <br />
  4. 4. Introdução<br />Problemas <br />Java não nos fornece o bastante para <br /> desenvolvermos aplicações web com produtividade <br />Dificuldade para integrar vários frameworks (algumas <br /> vezes nem é possível) <br />Falta de padrão para um framework web <br />Ausência de uma API padrão para construir <br /> componentes web java <br /> <br />
  5. 5. Introdução<br />Um pouco da história<br /> <br />HTML<br />Servlets<br />JSP<br /> <br />
  6. 6. Introdução<br />HTML<br />Estático, simples<br />Não tem conexão com Base De Dados<br />Ótimo para criar Home Pages<br />OlaMundo.html<br /><html><br /> <head><br /> <title>Olá Mundo</title><br /> </head><br /> <body><br /> Olá Mundo.<br /> </body><br /> </html><br /> <br />
  7. 7. Introdução<br />Servlets<br /> <br />É uma extensão de servidores<br />Disponibiliza uma interface para o servidor<br />Recursos Dinâmicos para web<br />Interage com os clientes<br />Necessita de um Servlet Container (Ex: Tomcat)<br /> <br />
  8. 8. Introdução<br />Servlets<br /> import java.io.*;<br />import javax.servlet.*;<br /> import javax.servlet.http.*;<br /> public class HelloWorldServlet extends HttpServlet {<br /> public void doGet(HttpServletRequest request, HttpServletResponse response)<br />throws ServletException, IOException {<br /> response.setContentType("text/html");<br /> PrintWriter out = response.getWriter();<br /> out.println("<html><body>Olá Mundo</body></html>");<br /> out.close();<br /> }<br /> }<br />
  9. 9. Introdução<br />Java Server Pages – JSP<br /> <br />O JSP foi desenvolvido APENAS para mostrar resultados, o SERVLET deveria fazer a ponte com o banco de dados e fazer as regras de negócio<br />Facilitar a criação de HTML<br />Scriplets: colocar código Java no JSP ;-(<br />
  10. 10. Introdução<br />OlaMundo.jsp<br /><html><br /> <body><br /> <% String mensagem = "Olá Mundo!"; <br /> out.println(mensagem); %><br /> <br> <br /> Muito mais simples de editar o html e muito maiscomplicado de editar o codigo Java<br /> <br><br /></body><br /></html><br />
  11. 11. Introdução<br />Frameworks<br />Frameworks são projetados com a intenção de facilitar o desenvolvimento de software, habilitando designers e programadores a gastarem mais tempo determinando as exigências do software do que com detalhes de baixo nível do sistema<br />Não reinventar a roda<br />
  12. 12. Introdução<br />Struts Framework: Action Based<br /> <br />MVC para construções de aplicações WEB<br />Cada solicitação HTTP tem que ser respondida com uma resposta HTTP<br />O .do é mapeado no arquivo struts-config.xml<br />O ActionServlet define o Action correspondente para a solicitação<br />
  13. 13. Introdução<br />Struts Framework: Action Based<br /> <br />O ActionServlet coloca a entrada em um JavaBean , estes JavaBeans são definidos como FormBeans<br />O Action pode acessar o FormBean efetuar qualquer operação e armazenar o resultado em um ResultBean<br />O Action interage com a camada de negócio onde uma base de dados poderá ser atualizada<br />
  14. 14. Introdução<br />Struts Framework: Action Based<br /> <br />
  15. 15. Introdução<br />Framework: Component Based<br />Rápido aprendizado<br />Baseado em Componentes<br />Deixa o programador despreocupado com a parte visual<br />Programação Web como Desktop<br />Simplicidade<br />Agilidade<br />
  16. 16. Introdução<br />Frameworks Web Component Based<br />Java Server Faces<br />JBossSeam<br />Wicket<br />
  17. 17. JSF - Introdução<br />JavaServer Faces é...<br />Uma especificação ?<br />Um framework baseado em componentes ?<br />Interface com o usuário ?<br />Um framework dirigido a eventos ?<br />Padrão de mercado ?<br />RAD ?<br />Um framework MVC ?<br />
  18. 18. JSF - Introdução<br />JavaServer Faces é... <br />Uma especificação <br />JSR 127 (JSF 1.0 e JSF 1.1) – 2004 <br /> JSF 1.0 – não alcançou o sucesso esperado <br /> JSF 1.1 – corrigiu os erros da versão anterior <br /> JSR 252 (JSF 1.2) - 2006 (Java EE 5.0) <br /> JSF 1.2 – melhor compatibilidade com JSP 2.1 e correção de <br /> bugs <br />
  19. 19. JSF - Introdução<br />JavaServer Faces é... <br /> • JSR 314 (JSF 2.0) <br /> • Arquitetura, produtividade, ferramentas RAD, AJAX, melhores <br /> componentes UI.. <br /> • Em desenvolvimento, porém estão planejando deixar bem integrado e intuitivo.<br />
  20. 20. JSF - Introdução<br />JavaServer Faces é... <br />... um framework baseado em componentes de <br />interface com o usuário <br />JSF é construído sob o conceito de componentes <br />Os componentes são a base para a construção da interface <br /> com o usuário <br />Existem componentes padrões equivalentes a quase todas <br /> as tags HTML e diversos componentes auxiliares <br />
  21. 21. JSF - Introdução<br />JavaServer Faces é... <br />Existem diversas bibliotecas de componentes disponíveis <br /> comerciais e open source <br />Os componentes são expressos através de tags em um <br />JSP e posteriormente transformados em HTML <br />
  22. 22. JSF - Introdução<br />... um framework dirigido a eventos <br />Possui um modelo para manipulação de eventos <br />Componentes geram determinados eventos <br />Faz chamada à um método (ação no servidor) <br />O estado da aplicação web muda devido ao evento disparado pelo usuário <br />Um evento pode ser um click em um botão, focar sobre um input ou mesmo alterar o valor de uma combo-box <br />
  23. 23. JSF - Introdução<br />... padrão de mercado <br />É uma especificação (JCP) <br />Java EE 5.0 <br />Suporte de Big Players <br /> Sun, Apache, IBM, Oracle, BEA Systems, Borland, ... <br />IDEs (NetBeans, Eclipse, MyEclipse, JDeveloper, ...) <br />Implementações (Sun (R.I), Apache, IBM, ...) <br />Conjuntos de componentes (ADF Faces, Apache MyFaces, WoodStock, IceFaces, JBoss RichFaces, ...) <br />
  24. 24. JSF - Introdução<br />.. RAD (Rapid Application Development) <br />4 camadas: <br /> Arquitetura de componentes básica <br /> Conjunto de componentes padrão <br /> Infra-estrutura da aplicação <br /> Ferramenta RAD <br />
  25. 25. JSF - Introdução<br />.. RAD (Rapid Application Development) <br />JSF padroniza os primeiros três pontos e permite a criação de ferramentas RAD <br />Utiliza-se IDEs drag-and-drop para construir aplicações <br />Sun Studio Creator, NetBeans, Jdeveloper,Eclipse etc <br />
  26. 26. JSF - Introdução<br />... um framework MVC para construir interfaces com o <br />usuário para aplicações web. JSF inclui: <br />Um conjunto de APIs para: <br />representar os componentes UI e gerenciar o estado destes componentes <br />manipular os eventos e validação de entrada do usuário <br />definir e controlar a navegação entre as páginas <br />dar suporte a internacionalização e acessibilidade <br />
  27. 27. JSF - Introdução<br />Resumo<br />É mais do que um framework, é uma especificação baseada em MVC<br />Suporte à internacionalização<br />Facilita criação de telas<br />Facilita a transferência dos dados entre telas e camadas de negócio através da EL<br />Facilidade para criação de componentes<br />
  28. 28. JSF - Introdução<br />Resumo<br />Produtividade para conversores recebidos do formulário para os tipos nas classes<br />Flexibilidade para renderização<br />Criar modelos simples de eventos entre interfaces gráficas e as classes no servidor<br />Mecanismos produtivos para validação de campos na tela<br />
  29. 29. JSF - Introdução<br />Por que usar JSF? <br />É um padrão de mercado <br />Presente na especificação JEE5.0 e em breve JEE6.0 <br />Suporte de Big Players <br />Fácil de usar e produtivo <br />Fornece separação de funções que envolvem a construção de aplicações Web <br />
  30. 30. JSF<br />Por que usar JSF? <br />Alta abstração para desenvolvimento de aplicação web <br />Modelo de programação dirigido a eventos (oposto ao modelo HTTP request/response) <br />Baixa curva de aprendizagem da equipe <br />Vários pontos de extensão (converters, validators, listeners etc) <br />Componentes já prontos! <br />
  31. 31. JSF<br />Por que usar JSF? <br />Reusabilidade e estrutura de componentes extensível <br />Acessibilidade (browsers, celulares, pda’s, ...) <br />Segurança OWASP (Open Web Application Security Project) cross-site scripting, session hijacking, execução de métodos, ... <br />Natureza orientada a componentes, validação e pontos de extensão <br />
  32. 32. JSF<br />Por que usar JSF? <br />Grande atividade da comunidade em fóruns, listas de <br /> discussão, blogs, portais, revistas, livros etc <br />Integração com diversos frameworks:<br /> Spring, Spring-Annotation, Spring-Webflow, Hibernate, EJB3, JPA, <br />JBoss Seam, Acegi, JAAS, Struts, Struts2, Shale, Tiles, Facelets, Sitemesh, DWR, EXT, Crank, Beehive-Webflow, GWT, Portlets e muitos outros <br />
  33. 33. JSF<br />Por que usar JSF? <br />Testes unitários <br />Shaletesting framework <br />Templates <br />Tiles e Sitemesh <br />Facelets<br />
  34. 34. JSF<br />Por que usar JSF? <br />IDEs e WYSIWYG (What you see is what you get) <br />Eclipse (MyEclipse, Europa, Ganymed), IntelliJ IDEA, Jbuilder, NetBeans (Visual WebPack) , IBM Rational App/Web Sun Java Studio Creator , Oracle Jdeveloper, Red Hat Developer Studio (antigo Exadel Studio) e JSFToolbox (Dreamweaver) <br />
  35. 35. JSF<br />Por que usar JSF? <br />Grande variedade de componentes comerciais e open- <br />source disponíveis <br />Myfaces Tomahawk Backbase <br />Myfaces Sandbox Simplica (ECruiser Suite) <br />Myfaces Tobago QuipuKit <br />Myfaces Trinidad Blueprints <br />
  36. 36. JSF<br />Por que usar JSF? <br />Myfaces Orchestra RCFaces <br />ADF Faces Jenia4Faces <br />IceFaces ZK <br />WoodStock G4JSF (GWT API)<br />JBoss RichFaces Dynamic Faces <br />JBoss Ajax4jsf Crank <br />
  37. 37. JSF<br />Conceitos chaves do JSF <br />Componentes <br />Renderers <br />Managed-beans <br />Converters / Validators <br />Navegação <br />Eventos <br />Ciclo de vida (Request Lifecycle) <br />
  38. 38. JSF<br />Componentes<br />Separa a lógica de negócio da apresentação <br />Cada view é composta por uma hierarquia de componentes <br />Componentes podem ser adicionados na view <br /> programaticamente ou via template (JSP por default, ou <br /> Facelets para melhor desempenho e fácil desenvolvimento) <br />
  39. 39. JSF<br />Componentes são expressos em tags em uma página JSP e em sua maioria são de interface com o usuário <br />Os componentes padrões são divididos em dois grupos: <br />Faces Core <f:view>, <f:loadBundle>, <f:param> <br /> HTML wrappers <h:dataTable>, <h:selectOneMenu> <br /> Componente = class + [renderer] + tag handler (JSP) <br />
  40. 40. JSF<br />Renderers <br />Responsável por exibir o componente no cliente <br />São agrupados em render kits <br />Render kit padrão é o HTML, mas podemos ter WML, SVG etc. <br />Efetua o encode (gera HTML do componente) <br />Efetua o decode (seta o componente com os dados da URL query string e do formulário) <br />
  41. 41. JSF<br />Exemplo:<br /><h:inputText id=“login” size=“16” /> <br /><input type=“text” id=“myForm:login” <br /> name=“myForm:login” size=“16” /> <br />
  42. 42. JSF<br />Renderes:<br />
  43. 43. JSF<br />Managed beans <br />POJO – Plain Old Java Objects <br />
  44. 44. JSF<br />Managed beans <br />Podem ser definidos nos escopos de:<br />Application, Session, Request e None<br />É uma classe que envia objetos de negócio para camada de apresentação<br />São registrados no faces-config.xml<br />
  45. 45. JSF<br />Managed beans <br />Objetos que sofrerão alterações em seus atributos durante uma requisição, assim como seus métodos podem ser chamados a partir de um command<br />São como as Actions do Struts, porém os form beans são injetados por setters dentro do seu próprio bean<br />Os ManagedBeans serão usados na EL das páginas<br />
  46. 46. JSF<br />Managed beans <br />
  47. 47. JSF<br />Obtendo o Managed beans nos escopos:<br />Request:<br />User user = (User)FacesContext.getCurrentInstance().getExternalContext().getRequestMap().get("user");<br />Session<br />User user = (User)FacesContext.getCurrentInstance().getExternalContext().getSessionMap().get("user");<br />Inserindo o Managed beans nos escopos:<br />Request:<br />FacesContext.getCurrentInstance().getExternalContext().getRequestMap().put("user", (User)users.getRowData());<br />Session<br />FacesContext.getCurrentInstance().getExternalContext().getSessionMap().put("user", (User)users.getRowData());<br />
  48. 48. JSF<br />JSF Value Binding <br />“Binda” valor do componente ao managed-bean <br />O binding ocorre através de JSF Expression Language (EL) <br />Semelhante a JSTL, porém usa-se ‘#{}’ no lugar de ‘${}’ <br />Pode-se executar métodos no modelo através de expressões <br />Não é processada imediatamente como na JSTL <br />A partir da JSF 1.2 utiliza-se a Unified Expression Language (JSP 2.1) que resolve problemas de incompatibilidade entre a JSF-EL e JSP-EL <br /> <h:outputText value="#{pessoa.nome}"/><br />
  49. 49. JSF<br />JSF Value Binding <br />
  50. 50. JSF<br />JSF Value Binding <br />
  51. 51. JSF<br />Converters <br />Tem por finalidade converter e/ou formatar <br /> objetos do tipo Java para String e vice-versa <br />Converters são bi-direcionais <br />Managed-bean faz: getAsObject() <br />JSP faz: getAsString() <br />
  52. 52. JSF<br />Converters <br />JSF já fornece converters padrões para date / time, numbers etc <br />Você pode implementar seu próprio converter:<br />Basta implementar a interface javax.faces.convert.Converter<br />Registrar o converter no faces-config.xml <br />O converter pode atuar de forma explícita(id) ou implícita(class) de acordo com a sua configuração no faces-config.xml <br />
  53. 53. JSF<br />Converters <br />javax.faces.convert.Converter<br />Converter é registrado dentro faces-config.xml<br />
  54. 54. JSF<br />Converter para que toda propriedade do tipo org.com.model.CPF de<br />qualquer bean use este converter <br /><converter> <br /> <converter-for-class> <br /> org.com.model.CPF <br /> </converter-for-class> <br /> <converter-class> <br /> org.com.faces.CPFConverter <br /> </converter-class> <br /></converter> <br />
  55. 55. JSF<br />Converter declarado explicitamente:<br /><h:inputText id=“cpf“ value="#{UserRegistration.user.cpf}"> <br /> <f:converter converterId=“br.com.CPFConverter“ /> <br /></h:inputText> <br />Ou implicitamente (converter mapeado para objetos do tipo CPF) <br /><h:inputText id=“cpf“ value="#{UserRegistration.user.cpf}"> <br />NADA AQUI ;-)<br /></h:inputText> <br />
  56. 56. JSF<br />Converter Padrões do JSF:<br /><h:inputText id="age" value="#{UserRegistration.user.age}"> <br /><f:converter id="javax.faces.Short"/> <br /></h:inputText> <br />
  57. 57. JSF<br />Validatores <br />Tem por responsabilidade garantir que o valor <br /> informado pelo usuário seja válido <br />Validador trabalha com objetos, não somente com Strings <br />JSF já fornece validadores padrões como required, length, range etc <br />
  58. 58. JSF<br />Você pode implementar seu próprio validador <br />Basta implementar a interface javax.faces.validator.Validator<br />Registrar o validador no faces-config.xml <br />Você pode associar um ou mais validadores aum <br /> componente <br />
  59. 59. JSF<br />javax.faces.validator.Validator<br />Validadores são registrados no faces-config.xml <br /><validator><br /> <validator-id>br.com.validaCPF</validator-id><br /> <validator-class>faces.validaCPF </validator-class><br /></validator><br />
  60. 60. JSF<br />Validação de obrigatoriedade e comprimento do campo:<br /><h:inputText id=“firstName“ value="#{user.firstName}“ required=“true”><br /><f:validateLength minimum="2“ maximum="25“ /> <br /></h:inputText> <br />
  61. 61. JSF<br />Navegação<br />Navegação de uma página para outra <br />Simples e poderoso sistema de navegação <br />O framework seleciona a próxima view baseado: <br />Na view anterior <br />Resultado(outcome) de uma action <br />EL de ação (ex.: #{mBean.user.save}) <br />Qualquer combinação acima<br />Permite wildcard (‘*’) para páginas de origem (from-view-id) <br />
  62. 62. JSF<br />Navegação<br />
  63. 63. JSF<br />Navegação<br />
  64. 64. JSF<br />Eventos<br />Componentes geram determinados eventos <br /> que por sua vez disparam ações no servidor (método(s) no managed-bean ou listeners) <br />Você também pode implementar listeners de ação <br /> associados a outros componentes do formulário <br />Os listeners mais comuns do JSF são <br />ActionListener <br />ValueChangeListener <br />
  65. 65. JSF<br />Action event para navegação :<br /><h:commandButton action=“listar” value=“Listar” /> <br />Action event que executa método no managed-bean <br /><h:commandLink action=“#{cadastroBean.cadastrar}” value=“Cadastrar” /> <br />Método no managed-bean <br />public String cadastrar() { <br />// processa evento <br />return “listar”; // retorna para view “listar” <br />} <br />
  66. 66. JSF<br />Value-change event que executa método após alterar o<br />valor do componente <br /><h:selectOneMenu id=“UF” value=“#{cadastroBean.uf}” valueChangeListener=“#{cadastroBean.carregaCidades}” onchange=“submit();”> <br /> <f:selectItems value=“#{cadastroBean.ufList}” /> <br /></h:selectOneMenu> <br />
  67. 67. JSF<br />Método no managed-bean <br />public void carregaCidades(ValueChangeEvent event) { <br /> // processa evento <br /> String uf = event.getNewValue(); // obtém novo valor <br /> this.cidadesList = Servico.carregaCidades(uf); <br /> // processa evento <br />} <br />
  68. 68. JSF<br />JSF Request Lifecycle<br />
  69. 69. JSF (Fases)<br />São Atendidas pelo Reader Response e Restore Component Tree<br />Restore Component Tree: O conjunto de componentes JSF é criado ou restaurado dependento da requisição (Primeira ou demais vezes executadas)<br /> <br />
  70. 70. JSF (Fases)<br />Apply request Values: Os componentes irão extrair seu novo valor dos parâmetros da Request, colocando-os em variáveis de estado no servidor<br />
  71. 71. JSF (Fases)<br />Process Validations: todos os validadores serão executados, em caso de erro de qualquer valor, a mensagem é alocada no FacesContext, caso contrário ele atualiza (Update Model Values) os valores dos inputs na camada de negócio através da EL<br /> <br />
  72. 72. JSF (Fases)<br />Invoke Application: Os métodos do ManagedBeans são executados e as regras de navegação (Gravar, Excluir, Alterar,...) são resolvidas.<br /> Se tudo ocorrer bem é renderizada pelo container do JSP, caso contrário as mensagens gravadas no FacesContext são apresentadas<br /> <br />
  73. 73. JSF (Fases)<br />Caso queira pular as fazer de validação e conversão, basta utilizar o parametro immediate=true<br /><h:commandButton action=“proximo" value=“Proximo" immediate="true"/><br /> <br />
  74. 74. JSF<br />JSF Extension Points <br />Customizar componentes <br />Phase listeners (antes, depois de qualquer fase) <br />Customizar converters / validators <br />Customizar renderers <br />Customizar ActionListenerImpl para manipular <br /> eventos <br />Decorar ou substituir view handler, navigation <br /> handler, state manager etc <br />
  75. 75. JSF<br />faces-config.xml<br />Arquivo XML para configurar recursos da aplicação <br />Contém regras de navegação, customização e extensão de converters, validators, componentes etc <br />Geralmente está localizado dentro de /WEB-INF/faces-config.xml <br />Pode ser dividido em diretórios e sub-diretórios ou dentro de arquivos jar <br />Seta javax.faces.application.CONFIG_FILES no web.xml <br />Ou então coloca-se META-INF/faces-config.xml dentro de um jar <br />
  76. 76. JSF<br />faces-config.xml (Resumo)<br /><faces-config ... > <br /><converter> <br /> <converter-id>core.faces.CnpfCnpjConverter</converter-id> <br /> <converter-class>converter.CnpfCnpjConverter</converter-class> <br /></converter> <br />
  77. 77. JSF<br />faces-config.xml (Resumo)<br /><managed-bean> <br /> <managed-bean-name>reportBean</managed-bean-name> <br /> <managed-bean-class>bean.ReportBean</managed-bean-class> <br /> <managed-bean-scope>request</managed-bean-scope> <br /></managed-bean> <br />
  78. 78. JSF<br />faces-config.xml (Resumo)<br /><navigation-rule> <br /> <from-view-id>/jsp/deposito/tiporeq/searchList.jsp</from-view-id> <br /> <navigation-case> <br /> <from-outcome>deposito.tiporeq.update</from-outcome> <br /> <to-view-id>/jsp/deposito/tiporeq/update.jsp</to-view-id> <br /> </navigation-case> <br /></navigation-rule> <br />
  79. 79. Componentes JSF (Form)<br /><h:form id="jsftags"><br /> ...<br /></h:form><br /><form id="jsftags" method="post"<br /> action="/jsftags/faces/pages/tags.jsp"<br /> enctype="application/x-www-form-urlencoded"><br /> ...<br /> <input type="hidden" name="jsftags"<br /> value="jsftags" /><br /> <input type="hidden" name="jsftags:link" /><br /></form><br />
  80. 80. Componentes JSF (commandButton)<br /><h:commandButton id="submit"<br /> value="#{msg.buttonHeader}"<br /> action="nextPage"><br /></h:commandButton><br /><input<br /> id="_id0:submit"<br /> type="submit"<br /> name="_id0:submit"<br /> value="Next Step"/><br />
  81. 81. Componentes JSF (commandLink)<br /><h:commandLink id="link" action="goto"><br /> <h:outputText value="#{msg.linkName}"/><br /></h:commandLink><br /><a id="_id0:link“ href="#" onclick= "document.forms['_id0']['_id0:link'].value= '_id0:link';<br /> document.forms['_id0'].submit(); return false;“<br />>Next Page</a><br />
  82. 82. Componentes JSF (graphicImage)<br /><h:graphicImage id="image"<br /> alt="jsf-sun“ url="/images/jsf-sun.gif"><br /></h:graphicImage><br /> <br /><img id="jsftags:image"<br /> src="/jsf-example/images/jsf-sun.gif"<br /> alt="jsf-sun" /><br />
  83. 83. Componentes JSF (inputText)<br /><h:inputText id="address"<br /> value="#{jsfexample.address}" /><br /> <br /><input type="text" name="jsftags:_id1"<br /> value="123 JSF Ave" /><br />
  84. 84. Componentes JSF (inputText / inputSecret)<br /><h:inputText id="address” value="#{jsfexample.address}" /><br /><input type="text" name="jsftags:_id1” value="123 JSF Ave" /><br /><h:inputSecret redisplay="false“ value="#{jsfexample.password}" /><br /> <br /><input id="jsftags:password“ type="password“ name="jsftags:password“ value="secret" /><br />
  85. 85. Componentes JSF (inputHidden /inputTextarea)<br /><h:inputHidden id="hidden“ value="userPreference" /><br /> <br /><input id="jsftags:hidden” type="hidden“ name="jsftags:hidden"<br /> value="userPreference" /><br /><h:inputTextarea id="textArea“ rows="4" cols="7“ value="Text goes here.."/><br /><textarea id="jsftags:textArea“ name="jsftags:textArea“ cols="5" rows="3"><br /> Text goes here..<br /></textarea><br />
  86. 86. Componentes JSF (outputText / outputLabel)<br /><h:outputText value="#{jsfexample.zipCode}"/><br />123<br /><h:outputLabel for="address“> <br /> <h:outputText id="addressLabel“ value="User Home Address"/><br /></h:outputLabel><br /><span id="jsftags:addressLabel"><br /> User Home Address</span><br />
  87. 87. Componentes JSF (outputLink)<br /><h:outputLink value="#{msg['jsfstudio.home.url']"> <br /> <f:verbatim>JSF Studio</f:verbatim><br /></h:outputLink><br /> <br /><a href="http://www.jsf-studio.com"><br /> JSF Studio<br /></a><br />
  88. 88. Componentes JSF (message)<br /><h:message style="color: red“ for="useraddress" /><br /> <h:inputText id="useraddress“ value="#{jsfexample.address}“ required="true"/><br /><h:commandButton action="save" value="Save"/><br /><span style="color: red"> Validation Error: Value is required. </span> <br /> <input id="jsftags:useraddress" type="text" name="jsftags:useraddress" value="" /> <br /><input type="submit" name="jsftags:_id1" value="Save" /> <br />Escrevendo uma mensagem:<br /> FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Usuário já Cadastrado!"));<br />
  89. 89. Componentes JSF (selectBooleanCheckbox)<br /><h:selectBooleanCheckbox title="emailUpdates“ value="#{jsfexample.wantsEmailUpdates}" ><br /></h:selectBooleanCheckbox><br /><h:outputText value="Would you like email updates?"/><br /><input type="checkbox“ name="jsftags:_id6" checked title="emailUpdates" /><br />Would you like email updates?<br />
  90. 90. Componentes JSF (selectManyCheckbox)<br /><h:selectManyCheckbox id="cars” value="#{carsBean.car}"><br /> <f:selectItems value="#{carBean.carList}"/><br /></h:selectManyCheckbox><br />span id="jsftags:cars"><br /><table><tr><br /> <td><label for="jsftags:cars"> <input name="jsftags:cars“ value="accord" type="checkbox"><br /> Honda Accord</input></label></td><br /> <td><label for="jsftags:cars“><input name="jsftags:cars“ value="4runner" type="checkbox"><br /> Toyota 4Runner</input> </label></td> <br /><td><label for="jsftags:cars“><input name="jsftags:cars“ value="nissan-z" type="checkbox"><br /> Nissan Z350</input<</label></td><br /> </tr></table><br /></span> <br />
  91. 91. Componentes JSF (selectManyListbox)<br /><h:selectManyListbox id="cars_selectManyListbox“ value="#{carBean.car}"><br /> <f:selectItems value="#{carBean.carList}"/><br /></h:selectManyListbox><br /> <br /><select id="jsftags:cars_selectManyListbox” name="jsftags:cars_selectManyListbox”<br /> multiple size="3"><br /> <option value="accord">Honda Accord</option><br /> <option value="4runner">Toyota 4Runner</option><br /> <option value="nissan-z">Nissan Z350</option><br /></select><br />
  92. 92. Componentes JSF (selectOneMenu)<br /><h:selectOneMenu id="selectCar“ value="#{carBean.currentCar}"><br /> <f:selectItems value="#{carBean.carList}" /><br /></h:selectOneMenu> <br /> <br />Honda Accord Toyota 4Runner Nissan Z350 <br /><select id="jsftags:selectCar“ name="jsftags:selectCar" size="1"><br /> <option value="accord">Honda Accord</option><br /> <option value="4runner">Toyota 4Runner</option><br /> <option value="nissan-z">Nissan Z350</option><br /></select> <br />
  93. 93. Componentes JSF (dataTable)<br /><h:dataTable id="books" value="#{BookStore.items}" var="store"> <br /> <h:column><br /> <f:facet name="header“><h:outputText value="#{msg.storeNameLabel}"/></f:facet><br /> <h:outputText value="#{store.name}"/><br /> </h:column><br /> <h:column><br /> <f:facet name="header“>Subject</f:facet><br /> <h:outputText value="#{store.subject}"/><br /> </h:column><br /> <h:column><br /> <f:facet name="header“><h:outputText value="#{msg.storePriceLabel}"/></f:facet><br /> <h:outputText value="#{store.price}"/><br /> </h:column><br /></h:dataTable> <br />
  94. 94. Componentes JSF (dataTable)<br /><table id="jsftags:books” class="list-background“> <thead><br /> <tr><th class="list-header” scope="col">Title</th> <th class="list-header” scope="col">Subject</th><br /> <th class="list-header” scope="col">Price ($)</th><br /> </tr><br /> </thead><br /> <tbody><br /> <tr class="list-row"><br /> <td class="list-column-center“> JSF For Dummies</td><br /> <td class="list-column-right“> JSF</td><td class="list-column-center“> 25.0</td><br /> </tr><br /> <tr class="list-row"><br /> <td class="list-column-center“> Struts For Dummies</td><br /> <td class="list-column-right“>Struts</td><br /> <td class="list-column-center“> 22.95</td><br /> </tr><br /> </tbody><br /></table><br />
  95. 95. Componentes JSF<br />Atributos importantes:<br />required, immediate, readonly, rendered .....<br /> <h:inputText value="#{numberBean.userNumber}" required="true" validatorMessage="O número tem que ser entre 0 e 100" readonly=“false" rendered=“true” ><br /> <h:commandButton value="Desistir" action="desistir" immediate="true"/><br />
  96. 96. Exercício 1<br /> <br />Criar um cadastro de Pessoa.<br /> <br />Criar um bean que represente o formulário (Nome, Endereço, Telefone )<br />Usar f:view e h:form para os formulários<br />Especificar o Action Controller com o atributo de ação h:commandButton<br />Criar uma Action para inserir os dados do formulário, chame a lógica de negócio, guarde os resultados em uma lista e imprima os valores no console<br />Usar o faces-config para declarar o form bean e navegação<br />Após inserir, imprimir no console quem foi inserido e enviar para uma página de sucesso com um botão voltar<br />
  97. 97. Exercício 1 (Continuação)<br /> <br />Validação:<br /> <br />Utilizar o h:messages e h:message<br /><h:messages style="color: red"/><br />Inserir algumas validações nos campos:<br /><h:inputText value="#{user.name}" required="true" requiredMessage="Campo Obrigatorio" validatorMessage="Tamanho inválido"><br /><f:validateLength maximum="30" minimum="3"/><br /></h:inputText><br/><br />Enviar uma mensagem de sucesso após cadastrar o usuário<br />FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("Usuário já Cadastrado!"));<br />
  98. 98. Componentes JSF (dataTable)<br /> <br />DataModel<br /> <br /><ul><li>Para enviar os dados para view em fomato de tabela, basta criar um objeto DataModel
  99. 99. Para inserir os objetos no DataModel: dataModel.setWrappedData(Lista)
  100. 100. Para obter os objetos da tabela : dataModel.getWrappedData() ou getRowData()</li></li></ul><li>Exercício 2<br /> <br />Usando DataModel<br /> <br /><ul><li>Inserir uma tabela no cadastro do exercício 1
  101. 101. Criar um link para apagar o registro da tabela</li></li></ul><li>Exercício 3<br /> <br />Criar um evento de mudança em um combo.<br /> <br /><ul><li>Criar um combo na tela de tipo de endereço
  102. 102. Inserir os tipos (Rua, Quadra, Lote ....)
  103. 103. Criar um método para capturar essa mudança e imprimir no console o valor antigo e o novo</li></li></ul><li>Exercício 4 (Opcional)<br /> <br />Navegação: <br /> <br /><ul><li>Sortear um número usando o Math.random()*100
  104. 104. Pedir para o usuário entrar com o número
  105. 105. Se estiver certo, enviar para página de sucesso com opção de sair ou jogar novamente, se estiver errado avisar que está errado e informar se é maior ou menor, o usuário pode desistir, enviando para uma tela confirmação.</li></li></ul><li>Exercício 4 (Opcional)<br /> <br />Navegação: <br /> <br />
  106. 106. Exercício 5 (Opcional)<br /> <br />Criar validadores:<br /><ul><li>Validador de Nome, que só aceite seu nome.
  107. 107. Validador de email
  108. 108. Validador que não aceite data no passado.</li></li></ul><li>Exercício 5 (Opcional)<br /> <br />Criar validadores:<br />public class ValidatorNome implements Validator {<br />@Override<br />public void validate(FacesContext arg0, UIComponent arg1, Object arg2)<br /> throws ValidatorException {<br /> String nome = (String)arg2;<br /> if (nome != null && nome.equalsIgnoreCase("gabriel")) {<br /> throw new ValidatorException(new FacesMessage(arg1.getClientId(arg0),"Nome Inválido")); <br /> }<br /> }<br />}<br />
  109. 109. Exercício 6 (Opcional)<br /> <br />Criar conveter:<br /><ul><li>Criar um objeto UF (código e nome)
  110. 110. Utilizá-lo em um combo
  111. 111. Criar um converter para UF</li></li></ul><li>Exercício 6 (Opcional)<br /> <br />Converter:<br />public class UFConverter implements Converter {<br />@Override<br />public Object getAsObject(FacesContext arg0, UIComponent arg1, String value) {<br />if(StringUtils.isEmpty(value)){<br />return null;<br /> }<br /> UF uf = new UF();<br />if (value.equals("DF")) {<br /> uf.setCodigo(1);<br /> uf.setNome("DF");<br /> } else if (value.equals("SP")) {<br /> uf.setCodigo(3);<br /> uf.setNome("SP");<br /> } else if (value.equals("GO")) {<br /> uf.setCodigo(3);<br /> uf.setNome("GO");<br /> }<br />return uf;<br />}<br />@Override<br />public String getAsString(FacesContext arg0, UIComponent arg1, Object value) {<br />return value.toString();<br />}<br /> <h:selectOneMenu value="#{user.uf}" valueChangeListener="#{userAction.mudarUF}" onblur="submit()" converter="ufConverter"><br /> <f:selectItems value="#{userAction.listaUF}" /><br /> </h:selectOneMenu> <br />public List<SelectItem> getListaUF() {<br />List<SelectItem> items = new ArrayList<SelectItem>();<br />items.add(new SelectItem(new UF(1 , "DF")));<br />items.add(new SelectItem(new UF(2 , "SP")));<br />items.add(new SelectItem(new UF(3 , "GO")));<br />return items;<br />}<br />
  112. 112. JSF 2.0<br /> <br />O que vem aí com JSF 2.0<br /><ul><li> Suporte a templates, baseado no Facelets, Tiles, dentre outros
  113. 113. Simplificar a criação de aplicações do tipo CRUD
  114. 114. Melhor tratamento de mensagens de erro
  115. 115. Mecanismo de tratamento de exceções padrão
  116. 116. Criação de aplicações Web sem XML, utilizando anotações
  117. 117. Simplificação no desenvolvimento de componentes
  118. 118. Especificar onde os artefatos (Conversores, Renderizadores, etc.) devem ser colocados no WAR, permitindo ao container encontrá-los sem a necessidade de sua definição em arquivos de configuração
  119. 119. Permitir que artefatos sejam alterados sem a necessidade de reinicializar o servidor</li></li></ul><li>FIM<br />

×