First page Back Continue Last page Graphics


Arranging Items Horizontally or Vertically, with Scrollbars (continued)

To provide scrollbars when flowing the children components, wrap the children in the af:panelGroupLayout component with its layout attribute set to scroll, and then place the af:panelGroupLayout component inside the af:panelSplitter or af:panelStretchLayout facet. The second example in the slide shows a panel splitter that is stretched. It contains a panel group layout with its layout attribute set to scroll. Although the child table is not stretched, it does display scrollbars to enable users to see all of its content.

When layout is set to scroll on af:panelGroupLayout, ADF Faces automatically provides a scrollbar at run time when the contents contained by the af:panelGroupLayout component are larger than the af:panelGroupLayout itself. You don’t have to write any code to enable the scrollbars, or set any inline styles to control the overflow.

For example, when you use layout components such as af:showDetail that enable users to expand and collapse children contents, you don’t have to write code to show the scrollbars when the contents expand, and to hide the scrollbars when the contents collapse. Simply wrap the af:showDetail component inside an af:panelGroupLayout component, and set the layout attribute to scroll. To get the layout you desire for the af:showDetail children, you can use nested af:panelGroupLayout components.