• The layout of components within a container remains a mystery.
• Why are the buttons placed side by side?
• Why are the buttons centered within the frame?

Layout Managers

• Layout manager classes are founded in the java.awt package same as the classes used for displaying graphical components.
• Every container has a default layout manager that determines the sizes and positions of components within the container.
• One reason that Java uses layout managers is so that containers can be resized gracefully.

Layout Manager Classes

• The java.awt package provides five layout manager classes



Name	Description
BorderLayout	Arranges components along the sides of the container and in the middle.
CardLayout	Arrange components in "cards" Only one card is visible at a time.
FlowLayout	Arranges components in variable-length rows.
GridBagLayout	Aligns components horizontally and vertically; components can be of different sizes.
GridLayout	Arranges components in fixed-length rows and columns.

Package : Java.awt

Class: java.awt.BorderLayout

Note :The BorderLayout layout manager can handle up to five components.

Constructors of BorderLayout Class

Name	Description
BorderLayout()	This constructor creates new BorderLayout without any space between Components.
BorderLayout(int hgap, int vgap)	This constructor creates new BorderLayout with horizontal and Vertical space between Components.

Methods of BorderLayout Class

Method	Description
addLayoutComponent(Component comp, Object constraints)	This method adds the specific component.
getHgap()	This method gets the Horizontal gap between components.
getVgap()	This method gets the Vertical gap between components.
setHgap(int hgap)	This method sets the Horizontal gap between components.
setVgap()	This method sets the Vertical gap between components.

• Four of the components can be positioned against the sides of the container, with the fifth occupying the center of the container.
• The positions in a BorderLayout are named North, South, East, West, and Center:

• The North and South components are stretched to the width of the container.
• The West and East components are stretched vertically to fill the gap between North and South.
• The Center component expands in both directions to fill any remaining space.
• The no-arg version of the BorderLayout constructor leaves no space between components:

setLayout(new BorderLayout());

• A different constructor is used if space is needed between components:

setLayout(new BorderLayout(20, 10));

Example :

package com.techknow.layout;
import java.awt.BorderLayout;
import java.awt.Button;
import java.awt.Dimension;
import java.awt.Frame;
import java.awt.Rectangle;
import java.awt.SystemColor;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;
import javax.swing.JOptionPane;

public class BorderLayoutDemo extends Frame
{
	private Button button1 = new Button();
	private Button button2 = new Button();
	private Button button3 = new Button();
	private Button button4 = new Button();
	private Button button5 = new Button();
	public BorderLayoutDemo()
	{
		try
		{
	    	jbInit();
	    }
	    catch (Exception e)
	    {
	    	e.printStackTrace();
	    }
	}
	private void jbInit() throws Exception
	{
		this.setLayout( null );
		this.setSize( new Dimension( 400, 300 ) );
		this.setBackground( SystemColor.control );
		this.setLayout(new BorderLayout());
		this.setVisible(true);
		this.setTitle("Border Layout Demo");
		this.addWindowListener(new WindowAdapter()
		{
			public void windowClosing(WindowEvent e)
			{
				this_windowClosing(e);
			}
		});
		this.setLocation(250,150);
		button1.setLabel("SOUTH");
		button1.setBounds(new Rectangle
			(30, 55, 70, 22));
		button1.addActionListener(new ActionListener()
		{
			public void actionPerformed(ActionEvent e)
			{
				button1_actionPerformed(e);
			}
		});
		button2.setLabel("NORTH");
		button2.setBounds(new Rectangle
			(240, 45, 70, 22));
		button2.addActionListener(new ActionListener()
		{
			public void actionPerformed(ActionEvent e)
			{
				button2_actionPerformed(e);
			}
		});
		button3.setLabel("WEST");
		button3.setBounds(new Rectangle
			(185, 100, 70, 22));
		button3.addActionListener(new ActionListener()
		{
			public void actionPerformed(ActionEvent e)
			{
				button3_actionPerformed(e);
			}
		});
		button4.setLabel("EAST");
		button4.setBounds(new Rectangle
			(215, 170, 70, 22));
		button4.addActionListener(new ActionListener()
		{
			public void actionPerformed(ActionEvent e)
			{
				button4_actionPerformed(e);
			}
		});
		button5.setLabel("CENTER");
		button5.setBounds(new Rectangle
			(130, 200, 70, 22));
		button5.addActionListener(new ActionListener()
		{
			public void actionPerformed(ActionEvent e)
			{
				button5_actionPerformed(e);
			}
		});
		this.add(button5, BorderLayout.CENTER);
		this.add(button4, BorderLayout.EAST);
		this.add(button3, BorderLayout.WEST);
		this.add(button2, BorderLayout.NORTH);
		this.add(button1, BorderLayout.SOUTH);
	}
	public static void main(String args[])
	{
		new BorderLayoutDemo();
	}
	private void button5_actionPerformed(ActionEvent e)
	{
		JOptionPane.showMessageDialog
			(this,"This is Center side of Frame");
	}
	private void button4_actionPerformed(ActionEvent e)
	{
		JOptionPane.showMessageDialog
			(this,"This is East side of Frame");
	}
	private void button3_actionPerformed(ActionEvent e)
	{
		JOptionPane.showMessageDialog
			(this,"This is West side of Frame");
	}
	private void button2_actionPerformed(ActionEvent e)
	{
		JOptionPane.showMessageDialog
			(this,"This is North side of Frame");
	}
	private void button1_actionPerformed(ActionEvent e)
	{
		JOptionPane.showMessageDialog
			(this,"This is South side of Frame");
	}
	private void this_windowClosing(WindowEvent e)
	{
		System.exit(0);
	}
}

Output :

Package : Java.awt

Class: java.awt.CardLayout

Note :The CardLayout class lets you implement an area that contains different components at different times.

Constructors of CardLayout Class

Name	Description
CardLayout()	This constructor creates new CardLayout without any space between Components.
CardLayout(int hgap, int vgap)	This constructor creates new CardLayout with horizontal and Vertical space between Components.

Methods of CardLayout Class

Method	Description
addLayoutComponent(Component comp, Object constraints)	This method adds the specific component.
getHgap()	This method gets the Horizontal gap between components.
getVgap()	This method gets the Vertical gap between components.
setHgap(int hgap)	This method sets the Horizontal gap between components.
setVgap()	This method sets the Vertical gap between components.
first(Container parent)	This method switch to first card of the Container.
last(Container parent)	This method switch to last card of the Container.
next(Container parent)	This method switch to next card of the Container.

• A CardLayout is often controlled by a combo box, with the state of the combo box determining which panel (group of components) the CardLayout displays.
• The CardLayout class manages two or more components (usually JPanel instances) that share the same display space.

Example :

package com.techknow.layout;

import java.awt.Button;
import java.awt.CardLayout;
import java.awt.Dimension;
import java.awt.Font;
import java.awt.Frame;
import java.awt.Rectangle;
import java.awt.SystemColor;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;
import javax.swing.JButton;

public class CardLayoutDemo extends Frame
{
	private Button button1 = new Button();
	private Button button2 = new Button();
	private Button button3 = new Button();
	CardLayout card=new CardLayout(40,30);
	public CardLayoutDemo()
	{
		try
		{
	    	jbInit();
	    }
	    catch (Exception e)
	    {
	    	e.printStackTrace();
	    }
	}
	private void jbInit() throws Exception
	{
	   this.setLayout( null );
	   this.setSize( new Dimension( 400, 300 ) );
	   this.setBackground( SystemColor.control );
	   this.setLayout(card);
	   this.setVisible(true);
	   this.setTitle("Card Layout Demo");
	   this.addWindowListener(new WindowAdapter()
	   {
		   	public void windowClosing(WindowEvent e)
		   	{
		   		this_windowClosing(e);
		   	}
		});
		this.setLocation(250,200);
		button1.setLabel("Card 1");
		button1.setFont(new Font("Tahoma", 1, 14));
		button1.setForeground(java.awt.Color.red);
		button1.setBackground
			(new java.awt.Color(214, 255, 239));
		button2.setBackground
			(new java.awt.Color(214, 214, 255));
		button3.setBackground
			(new java.awt.Color(255, 255, 165));
		button2.setFont(new Font
			("Tahoma", 1, 14));
		button2.setForeground(java.awt.Color.green);
		button3.setFont(new Font
			("Tahoma", 1, 14));
		button3.setForeground(java.awt.Color.blue);
		button1.addActionListener
			(new ActionListener()
		{
			public void actionPerformed(ActionEvent e)
			{
				button1_actionPerformed(e);
			}
		});
	    button2.addActionListener(new ActionListener()
	    {
	    	public void actionPerformed(ActionEvent e)
	    	{
	        	button2_actionPerformed(e);
	        }
		});
		button3.addActionListener(new ActionListener()
		{
	    	public void actionPerformed(ActionEvent e)
	    	{
	        	button3_actionPerformed(e);
			}
		});
		button2.setLabel("Card 2");
		button3.setLabel("Card 3");
		this.add(button1, "a");
		this.add(button2, "b");
		this.add(button3, "c");
	}
	public static void main(String args[])
	{
		new CardLayoutDemo();
	}
	private void this_windowClosing(WindowEvent e)
	{
		System.exit(0);
	}
	private void button1_actionPerformed
		(ActionEvent e)
	{
		card.next(this);
	}
	private void button2_actionPerformed
		(ActionEvent e)
	{
		card.next(this);
	}
	private void button3_actionPerformed
		(ActionEvent e)
	{
		card.next(this);
	}
}

Output :

Package : Java.awt

Class: java.awt.FlowLayout

Note :The FlowLayout class lets you implement an area that contains different components at different times.

Constructors of FlowLayout Class

Name	Description
FlowLayout()	This constructor creates new FlowLayout with centered alignment and 5-unit Horizontal and Vertical gap.
FlowLayout(int align)	This constructor creates new FlowLayout with specific alignment and 5-unit Horizontal and Vertical gap.
FlowLayout(int align, int hgap, int vgap)	This constructor creates new FlowLayout with specific alignment and specific Horizontal and Vertical gap.

Methods of FlowLayout Class

Method	Description
addLayoutComponent(Component comp, Object constraints)	This method adds the specific component.
getHgap()	This method gets the Horizontal gap between components.
getVgap()	This method gets the Vertical gap between components.
setHgap(int hgap)	This method sets the Horizontal gap between components.
setVgap()	This method sets the Vertical gap between components.
getAlignment()	This method get alignment of the Container.
setAlignment(int align)	This method sets the alignment of the Container.

Example :

package com.techknow.layout;

import java.awt.Button;
import java.awt.Dimension;
import java.awt.FlowLayout;
import java.awt.Font;
import java.awt.Frame;
import java.awt.Rectangle;
import java.awt.SystemColor;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

public class FlowLayoutDemo extends Frame
{
	private Button button1 = new Button();
	private Button button2 = new Button();
	private Button button3 = new Button();
	private Button button4 = new Button();
	private Button button5 = new Button();
	FlowLayout flow=new FlowLayout(FlowLayout.CENTER);
	private Button button6 = new Button();
	public FlowLayoutDemo()
	{
		try
		{
			jbInit();
		}
		catch (Exception e)
		{
			e.printStackTrace();
		}
	}
	private void jbInit() throws Exception
	{
		this.setLayout( flow );
		this.setSize( new Dimension( 400, 300 ) );
		this.setBackground( SystemColor.control );
		this.setVisible(true);
		this.setTitle("Flow Layout Demo");
		this.addWindowListener(new WindowAdapter()
		{
			public void windowClosing(WindowEvent e)
			{
				this_windowClosing(e);
			}
		});
		this.setLocation(250,200);
		button1.setLabel("First");
		button1.setBounds(new Rectangle
			(290, 45, 70, 22));
		button1.setFont(new Font("Tahoma", 1, 12));
		button2.setLabel("Second");
		button2.setBounds(new Rectangle
			(205, 75, 70, 22));
		button2.setFont(new Font("Tahoma", 1, 12));
		button3.setLabel("Third");
		button3.setBounds(new Rectangle
			(195, 115, 70, 22));
		button3.setFont(new Font("Tahoma", 1, 12));
		button4.setLabel("Fourth");
		button4.setBounds(new Rectangle
			(180, 145, 70, 22));
		button4.setFont(new Font("Tahoma", 1, 12));
		button5.setLabel("Fifth");
		button5.setBounds(new Rectangle
			(130, 160, 70, 22));
		button5.setFont(new Font("Tahoma", 1, 12));
		button6.setLabel("button6");
		this.add(button1);
		this.add(button2);
		this.add(button3);
		this.add(button4);
		this.add(button5);
	}
	public static void main(String args[])
	{
		new FlowLayoutDemo();
	}
	private void this_windowClosing(WindowEvent e)
	{
		System.exit(0);
	}
}

Output :

Package : Java.awt

Class: java.awt.GridBagLayout

Note :GridBagLayout is one of the most flexible - and complex - layout managers the Java platform provides.

Constructors of GridBagLayout Class

Name	Description
GridBagLayout()	This constructor creates new GridBag Layout.

Methods of GridBagLayout Class

Method	Description
addLayoutComponent(Component comp, Object constraints)	This method adds the specific component.
arrangeGrid(Container parent)	lays out the Grid.
getLayoutDimensions()	Find out the width and height of the cell.
location(int x, int y)	This method returns the location of cell in grid specified by specific x, y co-ordinates .

Example :

package com.techknow.layout;

import java.awt.Button;
import java.awt.Dimension;
import java.awt.Frame;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.Insets;
import java.awt.SystemColor;
import java.awt.event.WindowAdapter;
import java.awt.event.WindowEvent;

public class GridBagLayoutDemo extends Frame
{
	GridBagLayout gridBag=new GridBagLayout();
	private Button button1 = new Button();
	private Button button2 = new Button();
	private Button button3 = new Button();
	public GridBagLayoutDemo()
	{
		try
		{
			jbInit();
		}
		catch (Exception e)
		{
			e.printStackTrace();
		}
	}
	private void jbInit() throws Exception
	{
		this.setLayout( gridBag );
		this.setVisible(true);
		this.setLocation(250,200);
		this.setSize( new Dimension( 400, 300 ) );
		this.setBackground( SystemColor.control );
		this.setTitle("Grid Bag Layout Demo");
		this.addWindowListener(new WindowAdapter()
		{
			public void windowClosing(WindowEvent e)
			{
				this_windowClosing(e);
			}
		});
		button1.setLabel("First");
		button2.setLabel("Second");
		button3.setLabel("Third");
		this.add(button1, new 
			GridBagConstraints(0, 1, 1, 1, 0.0, 0.0, 
		GridBagConstraints.CENTER, 
			GridBagConstraints.NONE,
			new Insets(0, 0, 0, 0), 0, 0));
		this.add(button2, new 
			GridBagConstraints(1, 0, 1, 1, 0.0, 0.0, 
		GridBagConstraints.CENTER, 
			GridBagConstraints.NONE, 
			new Insets(0, 0, 0, 0), 0, 0));
		this.add(button3, new 
			GridBagConstraints(1, 2, 1, 1, 0.0, 0.0, 
		GridBagConstraints.CENTER, 
			GridBagConstraints.NONE,
			new Insets(0, 0, 0, 0), 0, 0));
	}
	private void this_windowClosing(WindowEvent e)
	{
		System.exit(0);
	}
	public static void main(String args[])
	{
		new GridBagLayoutDemo();
	}
}

Output :

Package : Java.awt

Class: java.awt.GridLayout

Note :The GridLayout class is a layout manager that lays out a container's components in a rectangular grid.

Constructors of GridBagLayout Class

Name	Description
GridLayout()	This constructor creates new Grid Layout.
GridLayout(int rows, int cols)	This constructor creates new Grid Layout with specific number of row and columns.
GridLayout(int rows, int cols, int hgap, int vgap)	This constructor creates new Grid Layout with specific number of row and columns with horizontal and vertical gap between components.

Methods of GridLayout Class

Method	Description
addLayoutComponent(Component comp, Object constraints)	This method adds the specific component.
getColumns()	This method returns the columns.
getHgap()	This method returns the Horizontal gap between Components.
getRows()	This method returns the rows.
getVgap()	This method returns the Vertical gap between Components.
setColumns(int cols)	This method sets the specific columns.
setHgap(int hgap)	This method sets the specific Horizontal gap between Components.
setRows(int rows)	This method sets the specific rows.
setVgap(int vgap)	This method sets the specific Vertical gap between Components.

Example :

package com.techknow.layout;

import java.awt.*;
import java.awt.event.*;

class GridLayoutDemo extends Frame
{
	List l1,l2;
	public GridLayoutDemo()
	{
		// Set the frame properties
		setTitle("GridLayout Demo");
		setSize(400,400);
		setLayout(new GridLayout());
		setLocationRelativeTo(null);
		setVisible(true);
		// Create lists
		l1=new List();
		l2=new List();
		// Add items to lists
		l1.add("Apple");
		l1.add("Mango");
		l1.add("Orange");
		l1.add("Pineapple");
		l1.add("Guava");
		l1.add("Banana");
		l2.add("Potato");
		l2.add("Carrot");
		l2.add("Onion");
		l2.add("Spinach");
		l2.add("Radish");
		// Add lists
		add(l1);
		add(l2);
		// Add item listeners
		l1.addItemListener(new ItemListener()
		{
			public void itemStateChanged(ItemEvent ie)
			{
				setTitle("Fruit = 
					"+l1.getSelectedItem()+";
				Vegetable = "+l2.getSelectedItem());
			}
		});
		l2.addItemListener(new ItemListener()
		{
			public void itemStateChanged(ItemEvent ie)
			{
				setTitle("Fruit = 
					"+l1.getSelectedItem()+";
				Vegetable = "+l2.getSelectedItem());
			}
		});
	}
	public static void main(String args[])
	{
		new GridLayoutDemo();
	}
}

Output :