Layout Component for Tomahawk and Trinidad

[Leonardo Uribe]

Hi

I'm working on a component for do layout like tobago gridLayout component
for myfaces Tomahawk and Trinidad.
I'm doing this inside the Google Summer of Code proyect called MyFaces
Component Set Integration.

The component is based on gridlayout and cell component of tobago (thank's
to tobago developers for this very great work).

the component has the following properties:

tableLayout

   <name>styleclass</name>
   <name>border</name>
   <name>cellspacing</name>
   <name>margin</name>
   <name>marginTop</name>
   <name>marginLeft</name>
   <name>marginRight</name>
   <name>marginBottom</name>
   <name>columns</name> // you can define an absolute number in pixels or
relative: Ex: 1*;1*;2*;500   or  100;100;100;100 or 1*;5*;2*
   <name>rows</name> // you can define an absolute number in pixels or
relative: Ex: 1*;1*;2*;500   or  100;100;100;100 or 1*;5*;2*
   <name>height</name>
   <name>width</name>

cellLayout
   <name>spanX</name> //For span more than 1 row or column
   <name>spanY</name>
   <name>inheritWidth</name> //For the inner component inherit the width
and heigth of the cell (using style property)
   <name>style</name>

An example:

   <mycomp:tableLayout width="700" styleclass="custompanel"
       cellspacing="5" columns="1*;2*;1*;2*">
       <mycomp:cellLayout inheritWidth="true" spanX="4">
           <h:outputText value="Layout Example: Personal Information" />
       </mycomp:cellLayout>

       <h:outputText value="Salutation"/>
       <mycomp:cellLayout inheritWidth="false" spanX="2">
       <h:selectOneMenu>
           <f:selectItem itemLabel="1 Option"
                           itemValue="1 Option"/>
           <f:selectItem itemLabel="2 Option"
                           itemValue="2 Option"/>
       </h:selectOneMenu>
       </mycomp:cellLayout>
       <mycomp:cellLayout />
       <h:outputText value="First Name" />
       <h:inputText></h:inputText>
       <h:outputText value="Last Name" />
       <h:inputText></h:inputText>
       <h:outputText value="c/o" />
       <mycomp:cellLayout inheritWidth="true" spanX="3">
           <h:inputText></h:inputText>
       </mycomp:cellLayout>
       <h:outputText value="Street" />
       <h:inputText></h:inputText>
       <h:outputText value="No" />
       <h:inputText></h:inputText>
       <h:outputText value="ZIP" />
       <h:inputText></h:inputText>
       <h:outputText value="City" />
       <h:inputText></h:inputText>
       <h:outputText value="Note" />
       <mycomp:cellLayout inheritWidth="true" spanX="3">
           <h:inputTextarea></h:inputTextarea>
       </mycomp:cellLayout>
   </mycomp:tableLayout>

The output:

Layout Example: Personal Information
Salutation
1 Option 2 Option

First Name
Last Name
c/o
Street
No
ZIP
City
Note

My question is simple: ¿What other properties or functions will be cool to
add to this component? What do you think?
How the style and style properties should work (It's necessary to do
something like styling columns of components)?

Thanks.

Att: Leonardo Uribe
Ingeniero de Sistemas
Pontificia Universidad Javeriana