1. Modern Programming Language Java
Layout Managers
By:
Muhammad Haleem

2. Contents What is Layout Manager? FlowLayout Manager?
BorderLayout Manager?
GridLayout Manager?

3. Introduction to Layout Managers
Layout managers arrange GUI components in a container for presentation purposes.
You can use the layout managers for basic layout capabilities instead of determining every GUI component’s exact position and size.
This functionality enables you to concentrate on the basic look-and-feel and lets the layout managers process most of the layout details.
Using layout managers to position elements can be simpler and faster than creating a GUI with absolute positioning.

4. Introduction to Layout Managers
A layout manager is an object that governs the positions and sizes of components in a container
Swing provides a variety of layouts: FlowLayout, BorderLayout, GridLayout and so on.
Use container’s method the setLayout to change its layout
container.setLayout(new BorderLayout())
Default layout for JFrame is BorderLayout and FlowLayout for JPanel

5. What is FlowLayout?
Components appear horizontally, from left to right, in the order that they were added. When there is no more room in a row, the next components will be dropped to the next row
FlowLayout’s constructors
FlowLayout()
FlowLayout(int align): the align can be FlowLayout.CENTER, FlowLayout.LEFT, or FlowLayout.RIGHT
FlowLayout(int align, int hgap, int vgap)
where hgap and vgap are a gap of pixels among components, horizontally and vertically

6. Designing the View Title: Flow Layout Size: 400x70 Layout: Flow Layout
GUI Components:
Button 1
Button 2
Button 3

7. What is BorderLayout?
BorderLayout manages five regions where components can be placed

8. What is BorderLayout? (cont.)
BorderLayout’s constructors:
BorderLayout
BorderLayout(int hgap, int vgap)
Components are added to a border layout container:
container.add(comp, region)
Where the region is one of the following values:
BorderLayout.NORTH
BorderLayout.SOUTH
BorderLayout.EAST
BorderLayout.WEST
BorderLayout.CENTER

9. Border Window Problem
Develop a program that has interface as below (the frame’s size is 400x300):

10. Designing the View Title: Border Layout Size: 400x300
Layout: Border Layout
GUI Components:
North button
West button
South button
East button
Center button

11. Border Panel Window Problem
Enhance the border window problem in order to reach the following interface:

12. Designing the View Title: Border Layout Layout: Border Layout
GUI Components:
North button panel
North button
West button panel
West button
South button panel
South button
East button panel
East button
Center button panel
Center button

13. What is GridLayout?
GridLayout creates a grid with rows and columns, much like a spreadsheet. A container that is managed by a GridLayout object is divided into equally sized cells
Each cell can hold only one component
A component that is placed in a cell is automatically resized to fill up any extra space
columns
rows

14. What is GridLayout? (cont.)
GridLayout’s constructors:
GridLayout()
GridLayout(int rows, int cols)
GridLayout(int rows, int cols, int hgap, int vgap)
If rows or cols is declared as zero, it means no limit for rows or columns, but not for both

15. Grid Window Example
Develop a program that has six buttons laid in a grid of 2x3 (The frame’s size is 400x200)

16. Designing the View Title: Grid Layout Size: 400x200
Layout: Grid Layout (2x3)
GUI Components:
Six Buttons

17. Grid Panel Window Example
Develop a program that has six labeled buttons laid in a grid as below (the frame’s size is 400x200):

18. Designing the View Title: Grid Layout Size: 400x200
Layout: Grid Layout (2x3)
GUI Components:
Button Panel 1
Label: This is cell 1.
Button 1
. . .
Button Panel 6
Label: This is cell 6.
Button 6

19. Summary Not so difficult but takes a little practice
Do not use absolute positioning – because it does not resize well.
It should be noted that for absolute positioning of components we have to use the setLayout() with argument null as:
setLayout(null)
then we will position the component as:
component.setBounds(20, 20, 200,20);//x, y, width, hight

20. Laying out components
Use layout managers – basically tells form how to align components when they’re added.
Each Container has a layout manager associated with it.
A JPanel is a Container – to have different layout managers associated with different parts of a form, tile with JPanels and set the desired layout manager for each JPanel, then add components directly to panels.

21. Layout Managers
Java comes with LayoutManagers. Most common and easiest to use are
FlowLayout
BorderLayout
GridLayout
Using just these three it is possible to attain fairly precise layout for most simple applications.

22. Setting layout managers
Very easy to associate a layout manager with a component. Simply call the setLayout method on the Container:
JPanel p1 = new JPanel();
p1.setLayout(new FlowLayout(FlowLayout.LEFT));
JPanel p2 = new JPanel();
p2.setLayout(new BorderLayout());
JPanel p3 = new JPanel();
p3.setLayout(new GridLayout(r, c, hgap, vgage));//int
As Components are added to the container, the layout
manager determines their size and positioning.