|
|
Tour de Icefaces - Part 2 - Layout Primer
Dhrubojyoti Kayal's Blog |
January 4, 2008 8:54 PM
|
Comments (0)
<ice:panelBorder/> represents a layout component.This component
divides the page into 5 regions:
<f:view xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
xmlns:jsp="http://java.sun.com/JSP/Page" xmlns:ice="http://www.icesoft.com/icefaces/component">
<f:loadBundle
basename="net.sf.mystore.resources.MyStoreMessages"
var="msgs" />
<html>
<head>
<ice:outputStyle href="mystore-default.css" rel="stylesheet" type="text/css" />
<title><ice:outputText value="#{msgs.productTitle}" /></title>
</head>
<body>
<h:form>
<ice:panelBorder id="page" styleClass="panelBorderLayoutMain" renderNorth="true" renderSouth="true"
renderCenter="true" renderWest="true" renderEast="true" border="1" bgcolor="grey">
<f:facet name="north">
<ice:outputText value="North" />
</f:facet>
<f:facet name="west">
<ice:outputText value="West" />
</f:facet>
<f:facet name="east">
<ice:outputText value="East" />
</f:facet>
<f:facet name="center">
<ice:outputText value="Center" />
</f:facet>
<f:facet name="south">
<ice:outputText value="South" />
</f:facet>
</ice:panelBorder>
</h:form>
</body>
</html>
</f:view>
So here is the simple layout for myStore application. Check out the usage of the boolean region rendering flags. Also it shows the embedded child elements. Also note that as we gradually build the application i have introduced style-sheet and resource bundle for our application.
The modified project source and ant build script can be downloaded here.
And finally here is how our layout looks now:
Later i intend to take a de-tour to see how facelets and icefaces work together.
Coming Up Next - Tour de Icefaces - Part 3 - Exploring layout child components
Comments
Comments are listed in date ascending order (oldest first) | Post Comment
|
|
