I have been working with richfaces 3.X.X and recently did a migration to richfaces 4.X.X. Many changes had to be done. Many tags got renamed, many properties suffered similar fate and some tags were retired.
<rich:spacer> was one among the many tags not supported in RF4. So, I though I would make a composite component to rectify the gap.
Well it’s a simple component which takes in two properties.
- Height
- Width
The component uses an image, a white plain image with the user defined height and width to build the spacer.
Well, basics in 5 seconds. A composite component has two parts.
- Interface – This denotes the component properties.
- Implementation – This denotes what the component does with the properties
So, our custom spacer component takes in the width and height as properties.
Without much adieu, here’s the code..
spacer.xhtml
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:composite="http://java.sun.com/jsf/composite"> <pre><composite:interface> <composite:attribute name="width" default="0" type="java.lang.Integer"/> <composite:attribute name="height" default="0" type="java.lang.Integer"/> </composite:interface> <composite:implementation> <h:panelGroup rendered="#{cc.attrs.height > 0}"> <br/> </h:panelGroup> <h:graphicImage library="images" name="spacer.png" width="#{cc.attrs.width}px" height="#{cc.attrs.height}px" /> </composite:implementation> </html>
As we discussed, the height and width parameters are used as properties. Also, an image is used.
This is placed in a folder images withing the resources folder. We use the resources concept of JSF 2.0
The composite component is under the folder custom. So we have to add a namespace to access it.
xmlns:arbcustom="http://java.sun.com/jsf/composite/custom"
Once the namespace is registered, the component can be used.
<custom:spacer height="5" width="100" ></arbcustom:spacer>
The component name will be same as that of the xhtml file.
One thought on “Composite Spacer Component for RichFaces 4”
Comments are closed.