Aug 22, 10 by Juan Lebrijo about JDeveloper, blog, Java, Web
Usually, in all our web projects, we want all the pages have a coherent style in ehole site, to improve the usuability. The usual strategy is fix the header (with the login for example), a menu in the top or both sides, and a footer.
And all this parts are included in all our pages with no repeat the code.
Every change in the template will show in whole site.
And, if is possible, our WYSIWYG editor shows me the design (it is not possible with Eclipse for the moment).
Based on last JDeveloper articles, in the project ViewController > New > Web Tier > JSF Page Template, create the template /WEB-INF/templates/template.jspx:
create_template.png108 KB
Choose a fixed header and footer template.
Select "Create ADFm Page Definition" to define an object which manage the template.
Add a facet called "content" where we will draw the pages developed.
Add "pageTitle" attribute to show the title of the developed page in the header.
It generates a file called trinidad-config.xml where we can change the skin configurations, from fusion to blafplus-rich for example.
With ADF we can create our own skins, it is not easy and we recommend take the web designer skills before. Nevertheless it keeps some default skins that can be sufficient:
simple: minimal and light formatting
blafplus-medium: very modest design.
blafplus-rich: extends blafplus-medium, it gives cooler like with things like rounded corners.
fusion: is the default one, rich and modern.
fusion-projector: to show in old projectors.
Placing logos and titles in the header, and copyright at the bottom is very intuitive thanks to component palette. To place the menu too: first add a Panel Menu Bar, then a menu, and at last the menu items.
design_template.png214 KB
We will create the Help > About menu action, with the component Popup which can be associated to a menu item. Inside we will include a Dialog component, which creates a little ok/cancel window, which will be filled with an Output Text and a Rich Text Editor.
Now in the About menuItem, from the Operations palette we will add a "Show Popup Behaviour" where bind with the popup identifier to open the popup.
To test the template we will create a New > Web Tier >JSF Page (templateTest.jspx) choosing the created template.
design_page.png208 KB
And we will test with right button > Run, Weblogic starts and call to the browser showing the result:
testing_template.png120 KB
Los Data Controls son objetos que actúan como una capa intermedia entre la capa de vista y la de negocio en la arquitectura de JDeveloper. Estos dan una forma consistente de manejar las colecciones de datos para mostrarse en la vista. Manejan el modelo, y los servicios de negocio, capturando los datos, manejando la transaccionalidad a través de la vista.
Esta parte, que le da más potencialidad sobre todo a la hora de desarrollar la vista, me gusta menos en cuanto a que se sale del estandar JSF/EJB .... y te genera una serie de ficheros automaticamente, que no se encuentra en otras arquitecturas.
Nos basaremos en posts anteriores donde hemos construido hasta la capa de negocio de una aplicación. Con el botón derecho sobre cada una de las clases de servicio desarrolladas > Create Data Control.
Te riega el proyecto con los siguientes ficheros:
files_created.png26.3 KB
Todos son ficheros XML que lo que hacen es mapear los métodos y beans involucrados en los servicios que quieras consumir desde la vista. Sirve para que el IDE fije los elementos que tiene en la lógica de negocio, y el desarrollador simplemente arrastrando desde la ventana "Data Controls" cree los componentes de la vista sobre el lienzo:
data_control_window.png30.1 KB
Esto es una acción automática y se repetirátantas veces como cambiemos modelo, o añadamos métodos de negocio.
Data Controls are objects which acts as an intermediate layer between the view layer and business layer on JDeveloper Architecture. These takes a consistent way to manipulate data collection to show at the view in programming time. They maps the model, and business services, binding, and managing the data transactionality, keeping the view coherent.
This part which empower the view programming time, I do not like because goes out from the estandards JSF/EJB ... and generate some automatic files which we cannot find in other architectures.
We will base in other posts where we have construct until an example application business layer. Right button over every service classes > Create Data Control.
It creates the following files in your Model project:
files_created.png26.3 KB
All are XML files which maps the methods and beans evolved on the services that you want to construct in the view. It makes that the IDE fix the elements in the business logic, and the developer dragging and dropping from "Data Controls" window creates the view components over the layout:
data_control_window.png30.1 KBThis is an automatic action that must be repeated every times we change the model, or we add business methods.