Hi,
I'm switching from using jsp to faclets and am currently working on a
prototype using tobago-1.1.0-SNAPSHOT and sun RI 1.2 on JBoss. I started
with a layout which worked for jsps, and began to migrate it to
facelets. As this didn't work as expected I tried to simplify the layout
and finally came to a point where I only have three parts in my layout:
a header, the body (content) and a footer. But I still get weird rows
with 0px height and columns with 0px width in the resulting html.
Here is some code:
app/home.xhtml:
<ui:composition template="/templates/master.xhtml">
<tc:loadBundle basename="bundle" var="mainBundle" />
<ui:define name="title">#{mainBundle.pageTitle}</ui:define>
<ui:define name="body">
<tx:date id="test" label="Label"/>
</ui:define>
</ui:composition>
templates/master.xhtml:
<f:view locale="#{clientConfiguration.locale}">
<tc:loadBundle basename="bundle" var="mainBundle" />
<tc:page label="#{mainBundle.pageTitle}" id="masterpage" width="800"
height="600">
<f:facet name="layout">
<tc:gridLayout border="1" margin="1px" columns="*"
rows="fixed;fixed;*;fixed" />
</f:facet>
<!-- row 0 -->
<tc:link action="app/home" immediate="true"
image="image/logo_tiny.gif" />
<!-- row 1 -->
<ui:insert name="body">
<ui:include src="/templates/body.xhtml"/>
</ui:insert>
<!-- row 2 -->
<tc:cell/>
<!-- row 3 -->
<tc:out value="#{mainBundle.copyrightNote}"/>
</tc:page>
</f:view>
templates/header.xhtml
<f:subview id="header">
<tc:loadBundle basename="bundle" var="mainBundle" />
<tc:link action="app/home" immediate="true"
image="image/logo_tiny.gif" />
</f:subview>
(footer is similar to header so I skip this one).
The result is (excerpt only :))
<table border="1" class="tobago-gridLayout-default" style="height:600px; width:800px; "
cellspacing="0" cellpadding="0" summary=""
<colgroup
<col width="796"
</colgroup><tr
<td class="tobago-gridLayout-cell-td" style="width: 796px; height: 0px;"
<div class="tobago-gridLayout-default tobago-gridLayout-first-row
tobago-gridLayout-first-column" style="width: 796px; height: 0px;"
<!-- row 0 --></div></td></tr><tr
<td class="tobago-gridLayout-cell-td" style="width: 796px; height: 25px;"
<div class="tobago-gridLayout-default tobago-gridLayout-first-column" style="width:
796px; height: 25px;"
<a href="javascript:;" onclick="Tobago.submitAction(this, 'masterpage:j_id4', true);"
class="tobago-link-default" id="masterpage:j_id4" name="masterpage:j_id4"
<img src="/seam-template/tobago-resource/html/standard/standard/image/logo_tiny.gif"
border="0" alt=""
</a></div></td></tr><tr
<td class="tobago-gridLayout-cell-td" style="width: 796px; height: 108px;"
<div class="tobago-gridLayout-default tobago-gridLayout-first-column" style="width:
796px; height: 108px;"
I get the following warnings in the log (as far as I know row is used
for both row and column in the output):
22:21:06,164 WARN [GridLayoutRenderer] Unbalanced layout: rows.size()=8
!=layoutTokens.length=4 rowLayout='fixed;fixed;1*;fixed;'
(clientId='masterpage:j_id2')
22:21:06,213 WARN [GridLayoutRenderer] Unable to calculate Height for
token '1*'! using 'fixed' , component:masterpage:j_id6 is Panel
22:21:06,308 WARN [GridLayoutRenderer] Unable to calculate Height for
token '1*'! using 'fixed' , component:masterpage:j_id6 is Panel
2
Has anyone used tobago and facelets for this kind of composite layout?
How do I avoid these 0px wide columns / high rows? (You can imagine the
more complex the layout the more weird the result ...)
Any hints welcome!
Best regards,
Stefan.
