Curso richfaces 3.3.3 II

3,906 views
3,802 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
3,906
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
137
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Curso richfaces 3.3.3 II

  1. 1. I. Sesión 2 Noviembre 2010 Claudio Chaucca Umana [email_address]
  2. 2. Contenidos I <ul><li>Sesión 2 </li></ul><ul><ul><li>Arquitectura RichFaces </li></ul></ul><ul><ul><li>Filters, Listeners, Servlets, ViewHandler </li></ul></ul><ul><ul><li>Partial Rendering / reRendering </li></ul></ul><ul><ul><li>Manage beans </li></ul></ul><ul><ul><li>Ajax Validators </li></ul></ul><ul><ul><li>Skinnability </li></ul></ul><ul><ul><li>Handling Resources </li></ul></ul><ul><ul><li>Caso: Registro de usuario </li></ul></ul>
  3. 3. Arquitectura RichFaces
  4. 4. Arquitectura RichFaces <ul><li>Ajax Filter </li></ul><ul><ul><li>Registrar el Filter en el web.xml </li></ul></ul><ul><ul><li>Reconoce multiples tipos de request </li></ul></ul><ul><ul><li>Diagrama de secuencia muestra el procesamiento de un request JSF y un Request Ajax </li></ul></ul><ul><ul><li>Los recursos estáticos o dinámicos son registrados por el Resource builder en el ResourceCache </li></ul></ul>
  5. 5. Arquitectura RichFaces
  6. 6. Arquitectura RichFaces
  7. 7. Arquitectura RichFaces <ul><li>Ajax Action Components.- Los componentes de solicitud de acción son : <a4j:commandButton> ,<a4j:commandLink> , <a4j:poll> y <a4j:support>. </li></ul><ul><li>Ajax Containers.- AjaxContainer es una interface que define un area en el JSF. <a4j:region> es una implementacion de esta interface. </li></ul><ul><li>JavaScript Engine .- corre en el lado del cliente, actualiza las areas del JSF basada en la informacion del Ajax response. </li></ul>
  8. 8. Arquitectura RichFaces
  9. 9. Arquitectura RichFaces <ul><li>Configuracion de Filter. </li></ul><ul><ul><li>Ejemplo de como definir el filtro en el web.xml estandar </li></ul></ul>
  10. 10. Arquitectura RichFaces <ul><li>Configuracion de Filter. </li></ul><ul><ul><li>Ejemplo de como definir el filtro en el web.xml seam </li></ul></ul>
  11. 11. Arquitectura RichFaces <ul><li>Listeners </li></ul><ul><ul><li>Definimos listener en el web.xml </li></ul></ul><ul><ul><li>Ejemplo de definición de listener estandar </li></ul></ul>
  12. 12. Arquitectura RichFaces <ul><li>Listeners </li></ul><ul><ul><li>Ejemplo de definición de listener seam </li></ul></ul>
  13. 13. Arquitectura RichFaces <ul><li>Servlet </li></ul><ul><ul><li>Se define en web.xml </li></ul></ul><ul><ul><li>Ejemplo de definición de servlet estandar </li></ul></ul>
  14. 14. Arquitectura RichFaces <ul><li>Servlet </li></ul><ul><ul><li>Ejemplo de definición de servlet seam </li></ul></ul>
  15. 15. Arquitectura RichFaces <ul><li>View handler </li></ul><ul><ul><li>Se define en faces-config.xml </li></ul></ul>
  16. 16. Partial Rendering <ul><li>RichFaces provee rederizado parcial al framework JSF con capacidades Ajax. </li></ul><ul><li>Minimiza la carga del servidor. </li></ul><ul><li>Ejemplo de renderizado parcial sobre <rich:tabPanel> </li></ul>
  17. 17. Re-Rerendering <ul><li>Componentes que permiten Re-Rendering <a4j:support>, <a4j:commandButton>, <a4j:jsFunction>, <a4j:poll>, <a4j:push> </li></ul><ul><li>reRenderer es un atributo, permite indicar áreas de la pagina que serán actualizadas </li></ul><ul><li>Interacciones Ajax Response </li></ul><ul><li>reRenderer usa algoritmos de busqueda sobre el arbol de componentes http://java.sun.com/javaee/javaserverfaces/1.2_MR1/docs/api/javax/faces/component/UIComponent.html#findComponent(java.lang.String) </li></ul>
  18. 18. Re-Rerendering
  19. 19. Manage Bean <ul><li>Modelo (.java) asociado a los componentes de la interfaz de usuario. </li></ul>
  20. 20. Manage Bean <ul><li>El Managed Bean debe ser declarado en faces-config.xml </li></ul>
  21. 21. Manage Bean <ul><li>Practica 15 minutos </li></ul>
  22. 22. Ajax Validators <ul><li>RichFaces posee 2 componentes para validar la data de ingreso. </li></ul><ul><ul><li><rich:ajaxValidator> </li></ul></ul><ul><ul><li><rich:beanValidator> </li></ul></ul><ul><li>Provee capacidades de validación sobre Inputs JSF </li></ul><ul><li>Permite validación predefinida y validación personalizada </li></ul><ul><li>Validación basada sobre eventos. </li></ul>
  23. 23. < rich:ajaxValidator > <ul><li>Validación en el lado del Cliente </li></ul><ul><li>Validaciones simples en base a etiquetas </li></ul><ul><ul><li><f:validateDoubleRange/> </li></ul></ul><ul><ul><li><f:validateLength/> </li></ul></ul>
  24. 24. < rich:ajaxValidator > <ul><li>Practica 10 minutos </li></ul>
  25. 25. < rich:ajaxValidator > <ul><li>Validaciones personalizadas usando Hibernate </li></ul><ul><li>Referencia en http://www.hibernate.org/hib_docs/validator/reference/en/html_single/ </li></ul>
  26. 26. < rich:ajaxValidator > <ul><li>Librerías requeridas, hibernate-annotations.jar, hibernate-commons-annotations.jar, hibernate-core.jar, hibernate-validator.jarlog4j.jar, slf4j-api.jar, slf4j-log4j12-1.5.8.jar </li></ul>
  27. 27. < rich:ajaxValidator > <ul><li>Practica 20 minutos </li></ul>
  28. 28. < rich:beanValidator > <ul><li>Validaciones personalizadas usando Hibernate </li></ul><ul><li>Validación en el lado del servidor </li></ul>
  29. 29. Skinnability <ul><li>Configura el Skin dentro de web.xml </li></ul><ul><li>Alto nivel de extencion para CSS </li></ul><ul><li>No reemplaza el uso de CSS </li></ul><ul><li>Skins out-of-the-box classic, plain, default, blueSky, ruby, darkX* </li></ul><ul><ul><li>Dentro de richfaces-impl-xxx.jar dentro de /META-INF/skins folder </li></ul></ul>
  30. 30. Skinnability
  31. 31. Skinnability <ul><li>Cambiando Skins en tiempo de ejecución </li></ul>
  32. 32. Skinnability <ul><li>Creando Skin personalizado </li></ul><ul><ul><li>Crear el archivo <name>.skin.properties </li></ul></ul><ul><ul><li>Colocar en META-INF/skins y WEB-INF/classes </li></ul></ul><ul><ul><li>Regsitrar skin en web.xml </li></ul></ul>
  33. 33. Skinnability <ul><li>Creando Skin personalizado en base A </li></ul><ul><ul><li>Crear el archivo ruby16.skin.properties en base a ruby </li></ul></ul><ul><ul><li>Colocar en META-INF/skins y WEB-INF/classes </li></ul></ul><ul><ul><li>Regsitrar skin en web.xml </li></ul></ul>
  34. 34. Skinnability <ul><li>Practica 20 minutos </li></ul>
  35. 35. Handling Resources <ul><li>Carga recursos (.properties), hojas de estilos (.css), javaScript (.js), imagenes etc. </li></ul><ul><li>Componente <a4j:loadBundle> </li></ul><ul><li>Se registra en faces-config.xml </li></ul>
  36. 36. Handling Resources <ul><li>Manage Bean que define la localidad del contexto </li></ul><ul><li>Registrar el Manage Bean en faces-config.xml </li></ul>
  37. 37. Handling Resources <ul><li>Practica 15 minutos </li></ul>
  38. 38. Caso: Registro de usuario <ul><li>Practica 30 minutos </li></ul>
  39. 39. ¡ Gracias !

×