The XdevBorderLayout is particularly useful as a basic layout for traditional graphical interfaces. Usually, there is a central application together with one or more separate areas for controlling the application, which can be firmly docked to the edge; e.g., menu, tree navigation, status bar. Therefore, you can enter no more than five UI components in an XdevBorderLayout. Four UI components can be docked to the borders of the parent container—top, bottom, left, and right. A UI component can be placed in the center of the container and automatically occupies all of the remaining space. 

1. Create a new view  without layout. 
2. Drag a XdevBorderLayout from the Palette and drop in the View.
3. Add a button to the XdevBorderLayout and dock it to the right border using you mouse.
4. Add a button to the XdevBorderLayout and dock it to the left border using you mouse.
5. Add a button to the XdevBorderLayout and dock it to the upper border using you mouse.
6. Add a button to the XdevBorderLayout and dock it to the lower border using you mouse.
7. Add a button at the center of the XdevBorderLayout .
   

Combinations

Since an XdevBorderLayout does not necessarily require five UI components, there are numerous possible combinations:

Layout options 

• Align 
  
  
  • • North - Docks the UI component to the top of the parent container.
    • South - Docks the UI component to the bottom of the parent container.
    • West - Docks the UI component to the left of the parent container.
    • East - Docks the UI component to the right of the parent container.
    • Center - The UI component occupies all of the remaining space.
• Width 
  
  
  • ? - The width of the UI component is automatically defined by its content.  
  • px - The width of the UI component is defined in pixels
  • % - The UI component stretches over the entire available cell width
• Height
  
  • ? -  The height of the UI component is automatically defined by its content. 
  • px - The height of the UI component is defined in pixels.
  • % - The UI component stretches over the entire available cell height.

All XdevBorderLayout Methods