The preferences screens for the sample application we developed in Chapter 9 are not all that user friendly. For instance, you can see the different setting only by navigating through the screens in a fixed order; you can’t jump simply from one setting to another. This type of data is better presented as tabs on one screen, as shown in Figure 14-1.
Much of what is needed for this design can be done with existing
components. The contents of each tab can be represented by a
panel component, e.g., with the
<h:panelGrid> action elements. Yet another
panel can hold the whole set of tabs together, but it needs a custom
panel renderer that ensures that only the currently selected tab
panel is rendered. The same custom renderer can also create the tab
control bar, and pick up the tab label texts or images from facets
attached to each tab panel.
The part of the design that makes sense to implement as a custom
component is the tab label. Clicking on the label should result in
the rendering of the corresponding tab panel’s
content, so the label component must act as a command component with
built-in event handling behavior, toggling the
rendered attribute for the panels that make up the
Example 14-1 shows parts of the JSP page that creates a view based on this design with panels, a custom ...