Layouts de extjs con forzaframework

Uno de los elementos de forzaframework es un taglib de jsp que genera codigo javascript/html. Principalmente es un wrapper para extjs. La idea de esto es que cualquier programador con experiencia en jsp pueda hacer mejores interfaces web aprovechando las excelentes librerias de javascript que existen ahora, en este caso extjs.

Aqui muestro un ejemplo de lo que se puede hacer.

[java]
<%@ taglib uri="http://forzaframework.org/tags/misc-tags" prefix="n" %>
<%@ taglib uri="http://forzaframework.org/tags/form-tags" prefix="f" %>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" />

<n:panel layout="border" title="Titulo principal del modulo" replacePanel="System.getCenter()">
<n:toolbar type="top">
<n:button text="Abrir ventana" handler="function(){ Ext.getCmp(‘window’).show(); }"/>
</n:toolbar>
<n:panel region="west" title="West" width="200">
</n:panel>
<n:panel region="center" layout="row-fit">
<n:grid id="users-grid" titleKey="user.list.title" url="${ctx}/config/users/xml">
<n:toolbar type="top">
<n:button textKey="user.new" handler="function(){
alert(‘Hola mundo’)
}" />
<n:button text="Permisos" handler="alert(‘Hola mundo’);" />
</n:toolbar>

<n:column field="id" hidden="true"/>
<n:column field="username" titleKey="user.username"/>
<n:column field="firstName" titleKey="user.firstName"/>
<n:column field="lastName" titleKey="user.lastName"/>
<n:column field="email" titleKey="user.email"/>
<n:column field="preferredLocale" titleKey="user.preferredLocale"/>
</n:grid>
<n:panel title="Aqui puede ir un otro grid">

</n:panel>
</n:panel>
</n:panel>

<n:window id="window" title="Ventana" width="400" height="300" show="false">
<n:panel>
<n:htmlContent>
Este es contenido html
<div style="background-color:red">
Este es un texto en rojo
</div>
</n:htmlContent>
</n:panel>
</n:window>
[/java]

Aquí vemos que es lo que genera.

lo que se muestra

En resumen se muestra un ejemplo de un panel con layout “border”, este panel puede tener otros paneles como hijos cada uno especificando la región a la que pertenecen. Podemos poner también grids, forms, tabs, como paneles.

Se muestra también una ventana. El parámetro “show” es para mostrarse o no de inicio, por default es “true”.

Bueno, este fin de semana trabajaremos en la documentación y de presentar y explicar casos mas comunes de uso tanto para forza en general como para el taglib.

Bienvenidos sus dudas y comentarios.