This is a multi-pane, application-oriented UI layout style that supports multiple regions, automatic split bars between regions and built-in expanding and collapsing of regions.
The children of the container using a border layout positions it's children absolutely. Because of this, a specific height and width must be set on any container using a border layout. The size can be set directly, or by a parent layout.
Rather then act on the child components directly, expanding, collapsing, hiding, and showing use the methods provided by border layout ( {@link #expand}, {@link #collapse}, {@link #hide}, and {@link #collapse}.
Be default, this layout adds a CSS style to the parent container (defaults to 'x-border-layout-ct') which gives the container a background color.
Code snippet:
public class BorderLayoutExample extends LayoutContainer { public BorderLayoutExample() { setLayout(new BorderLayout()); ContentPanel west = new ContentPanel(); ContentPanel center = new ContentPanel(); BorderLayoutData westData = new BorderLayoutData(LayoutRegion.WEST, 200); westData.setSplit(true); westData.setCollapsible(true); westData.setMargins(new Margins(5)); BorderLayoutData centerData = new BorderLayoutData(LayoutRegion.CENTER); centerData.setMargins(new Margins(5, 0, 5, 0)); add(west, westData); add(center, centerData); } }