ADF 11g - Creando Plantillas para Páginas JSPX

Una de las nuevas características de ADF11g es la creación de plantillas de diseño las cuales son la base para todas o un conjunto de páginas que hacen parte de la aplicación. Este es el primero de dos artículos en los que veremos las características principales de las plantillas en JSF así como algunas los componentes de las mismas. El objetivo principal es el de crear una página jspx de nuestra aplicación que tenga el siguiente look and feel

Una plantilla en JSF básicamente es un página JSPX la cual, a través de metadata define un diseño que van a manejar todas las páginas que se basen en esta plantilla. Las partes de una plantilla son: áreas editables o facets, atributos de página, áreas no editables o estáticas (logo, menu global, etc) y podría llegar a contener lógica de negocio que aplique para todas las páginas por ejemplo un menú para hacer login, logout.

Para crear una plantilla, creamos un Proyecto de Vista/Controlador basado en JSF, luego bajo la tecnología escogemos JSF Template 

El asistente es muy parecido al de una página JSPX sin embargo se puede notar que que ahora contamos con unos elementos nuevos que son los facets definitions así como también los atributos.

Podemos utilizar los facets para definir las áreas en las cuales vamos a permitir adicionar contenido, esto quiere decir, cuando una página se crea con base en esta plantilla va a tener áreas editables  en donde se pude insertar cualquier tipo de componente, a la vez que van a existir partes de la aplicación que son no-editables las cuales hacen parte de la plantilla y no son definidas como facets. Para este ejemplo voy a definir 3 facets para mi plantilla un área para controles de navegación, un área principal y un área para insertar menús.

Los atributos son elementos de nuestra  plantilla los cuales van a ser común para toda página, como un nuestro ejemplo vamos a definir un par de atributos el titulo de la página y el subtitulo de la misma, como se puede apreciar estos atributos pueden o no ser requeridos. En la segunda parte de este articulo voy a concentrarme en como utilizar la funcionalidad de asociar esta plantilla con el ADFm.

Una vez definimos los componentes contamos con el editor visual de páginas y comenzamos por definir la distribución utilizando elementos de layout y así podemos definir una página base, en mi ejemplo la estructura inicial de mi plantilla queda como se ve en la parte izquierda.

La forma en que asociamos los facets y atributos a la plantilla es a través del componente común de la paleta de componentes el facet lo que hacemos es arrojar un facet como cualquier otro tipo de componente dentro del área que queremos hacer editable lo cual va a permitir especificar el facet que queremos en esta area

Para definir los atributos lo que hacemos es utilizar un componente común el cual va a contener el atributo, para mi ejemplo el titulo lo voy a contener dentro de un af:outputText el cual lo arrojo en donde yo quiero que vaya el titulo, luego edito la propiedad Value con la siguiente EL #{attrs.Titulo} lo que hacemos aqui es hacer referencia de los atributos de JSP. La estructura luego de adicionar los facets y atributos queda de la siguiente forma

Ahora cuando vamos a crear una nueva página podemos basarla en la plantilla que creamos

y podemos ver que los atributos requeridos aparecen como errores hasta que no le demos el valor correspondiente

En la segunda parte vamos a ver como definir lógica de negocio que sea incluida en la plantilla y todas las páginas puedan utilizar.