
Swing Layouts
A list of the layout managers
* Flow Layout: It is the default layout of the managers for the panels. It lays out the components one after another until it runs out of room, then it starts a new row.
* Grid Layout: It's good for creating a grid of identically sized components.
* Border Layout:
It's the default layout for the
frames. It divides the container into five regions. The top region is called
NORTH,
bottom region is called SOUTH,
center region is called CENTER,
right region is called EAST,
and left region is called WEST.
* Box Layout: It arranges the components into either a single column or a single row.
* GridBag Layout:
Each of the rows or columns can be a
different size, the component can span two or more rows or columns. This layout
is so flexible that we can
tell the layout manager what to do if the component is smaller or larger than
the space allotted for it.
* Group Layout: It describe an arrangement from two points of view, from left to right and from top to bottom.
In addition the above layouts, java provides few additional one, though the above six layouts are used most often.
Since all the GUIs we've done so far are flow layout, which is the basic layout. We will start with the flow layout.
Flow Layout Manager
Flow layouts often used for small panels that consists of a few components, such as few rows of buttons. Lets see a basic example of it.
Note: For all the Layout Manager constructors and Methods look at the link below " Swing Method & Constructor Table."
/*
This program demonstrate the use of flow layout
It consists of a few buttons
*
*/
import javax.swing.*;
import java.awt.event.*;
import java.awt.*; // Needed for the
layout manager
public class FlowLayoutButton extends JFrame
{
private JPanel panel;
private JButton b1;
private JButton b2;
private JButton b3;
private JButton b4;
public FlowLayoutButton()
{
// Sets the title of the window
setTitle("Flow Layout Manager");
// Sets the size of the window
setSize(150, 150);
// Sets the start location of the
window
setLocationRelativeTo(null);
// Sets the action if the window is
close
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
// Create the buttons
b1 = new JButton("1");
b2 = new JButton("2");
b3 = new JButton("3");
b4 = new JButton("4");
// Create a panel and sets the layout
of the panel
panel = new JPanel();
panel.setLayout(new
FlowLayout(FlowLayout.LEFT, 20, 15));
// Add the buttons to the panel
panel.add(b1);
panel.add(b2);
panel.add(b3);
panel.add(b4);
// Create the action listener for the
buttons
b1.addActionListener(new
ButtonListener());
b2.addActionListener(new
ButtonListener());
b3.addActionListener( new
ButtonListener());
b4.addActionListener(new
ButtonListener());
// Adds the panel to the content pane
add(panel);
// Sets the window to be visible
setVisible(true);
}
/*
Handles the events here if a button
is pushed
*
*/
private class ButtonListener implements ActionListener
{
public void
actionPerformed(ActionEvent e)
{
if(e.getSource()==b1)
{
JOptionPane.showMessageDialog(null, "1");
}
if(e.getSource()==b2)
{
JOptionPane.showMessageDialog(null, "2");
}
if(e.getSource()==b3)
{
JOptionPane.showMessageDialog(null, "3");
}
if(e.getSource()==b4)
{
JOptionPane.showMessageDialog(null, "4");
}
}
}
public static void main(String[] args)
{
new FlowLayoutButton();
}
}
ClickHere to download FlowLayoutButton.java
Border Layout Manager
Now, lets look at one of my favorite layout, the Border Layout. If a border layout is not specify with a region when components are added, then the component is placed in the center region by default. The border layout automatically resizes the components in each region to completely fill up the region. Sometimes, we don't want that to happen, hence we can place the components into a separate panels using flow layout and then add the panel into the border layout region.
/*
The program demonstrate the use of border region
*
*/
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class BorderRegion extends JFrame
{
private JPanel panel;
private JLabel north;
private JLabel center;
private JLabel west;
private JLabel east;
private JLabel south;
public BorderRegion()
{
// Sets the title of the window
setTitle("Border Layout Mananger");
// Sets the size of the window
setSize(300, 400);
// Sets the start location of the
window
setLocationRelativeTo(null);
// Sets the action when the window is
close
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
// Create a panel with border layout
panel = new JPanel();
panel.setLayout(new BorderLayout());
// Create Labels
north = new JLabel("North");
center = new JLabel("Center");
south = new JLabel("South");
east = new JLabel("East");
west = new JLabel("West");
// Add the label to the panel with a
specify region
panel.add(north, BorderLayout.NORTH);
panel.add(center, BorderLayout.CENTER);
panel.add(south, BorderLayout.SOUTH);
panel.add(east, BorderLayout.EAST);
panel.add(west, BorderLayout.WEST);
// Add the panel to the content pane
add(panel);
// Sets the window visibility
setVisible(true);
}
public static void main(String[] args)
{
new BorderRegion();
}
}
ClickHere to download BorderRegion.java
Grid Layout Manager
It's designed for panels that need to have a set number of components all equally sized and arranged into a grid. It most often used to create calculator or a phone.
/*
This demonstrate a simple Grid Layout Manager
*
*/
import javax.swing.*;
import java.awt.*;
import java.awt.event.*;
public class GridLayout extends JFrame
{
JPanel panel;
JButton b1;
JButton b2;
JButton b3;
JButton b4;
public GridLayout()
{
// Sets the title of the window
setTitle("Border Layout Mananger");
// Sets the size of the window
setSize(300, 400);
// Sets the start location of the
window
setLocationRelativeTo(null);
// Sets the action when the window is
close
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
// Create a panel with Grid Layout 2
rows and 2 columns
panel = new JPanel();
panel.setLayout(new
java.awt.GridLayout(2, 2));
// Create the buttons
b1 = new JButton("1");
b2 = new JButton("2");
b3 = new JButton("3");
b4 = new JButton("4");
// Add the buttons to the panel
panel.add(b1);
panel.add(b2);
panel.add(b3);
panel.add(b4);
// Add the panel to the content pane
add(panel);
// Set the visibility of the window
setVisible(true);
}
public static void main(String[] args)
{
new GridLayout();
}
}
ClickHere to download GridLayout.java
Box Layout
A box layout is most often use to create panels that contain a single row or column of components. If the components are arranged in a single row, we use the Horizontal method. If the components are stacked in a column, we use the Vertical method.
/*
This is a box layout using horizontal method
*
*/
import javax.swing.*;
import java.awt.event.*;
import java.awt.*; // Needed for box
layout
public class BoxHorizontal extends JFrame
{
JPanel panel;
JButton yellow;
JButton red;
JButton blue;
public BoxHorizontal()
{
// Set the title of the window
setTitle("Box Layout");
// Sets the size of the window
setSize(300, 100);
// Sets the action when the window is
close
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
// Sets the start location of the
window
setLocationRelativeTo(null);
// Creates a horizontal box
Box box = Box.createHorizontalBox();
// Create three buttons
yellow = new JButton("Yellow");
red = new JButton("Red");
blue = new JButton("Blue");
// Add the buttons to the horizontal
box
box.add(yellow);
box.add(red);
box.add(blue);
// Create action listener for the
buttons
yellow.addActionListener(new
ButtonListener());
red.addActionListener(new
ButtonListener());
blue.addActionListener(new
ButtonListener());
// Create a panel
panel = new JPanel();
// Add box layout to the panel
panel.add(box);
// Add the panel to the content pane
add(panel);
// Sets the visibility of the window
setVisible(true);
}
/*
The buttons click event are handle
here
*
*/
public class ButtonListener implements ActionListener
{
public void
actionPerformed(ActionEvent e)
{
if(e.getSource()==yellow)
{
JOptionPane.showMessageDialog(null, "You've clicked a yellow button");
}
if(e.getSource()==red)
{
JOptionPane.showMessageDialog(null, "You've clicked a red button");
}
if(e.getSource()==blue)
{
JOptionPane.showMessageDialog(null, "You've clicked a blue button");
}
}
}
public static void main(String[] args)
{
new BoxHorizontal();
}
}

ClickHere to download BoxHorizontal.java
/*
The program demonstrate the use of vertical box
It also show how to use Glue, rigid area, & strut
*
*/
import javax.swing.*;
import java.awt.event.*;
import java.awt.*; // Needed for Box
Layout
public class BoxVertical extends JFrame
{
private JPanel panel;
private JButton accept;
private JButton exit;
private JButton show;
public BoxVertical()
{
//
Sets the title of the window
setTitle("Box Window Vertical");
// Sets the size of the window
setSize(300, 400);
// Sets the action when the window is
close
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
// Sets the start location of the
window
setLocationRelativeTo(null);
// Create vertical box
Box box = Box.createVerticalBox();
// Create three buttons
accept = new JButton("Accept");
show = new JButton("Show");
exit = new JButton("Exit");
// Add the button to the box using
Strut with a specify pixel
box.add(Box.createVerticalStrut(20));
box.add(accept);
// Add the button to the box using
ridgid area with a specify dimension
box.add(Box.createRigidArea(new
Dimension(30, 50)));
box.add(show);
// Glue the buttons
box.add(Box.createVerticalGlue());
// Add the exit button using a strut
with a specify pixel
box.add(exit);
box.add(Box.createVerticalStrut(20));
// Create a panel
panel = new JPanel();
// Add the box to the panel
panel.add(box);
// Add the panel to the content pane
add(panel);
// Sets the visibility of the window
setVisible(true);
}
public static void main(String[] args)
{
new BoxVertical();
}
}
ClickHere to download BoxVertical.java