A layout manager arranges the components on a panel
according to the guidelines of the particular type of manager (examples
given below) and according to the parameters passed to it. The manager
attempts to fit all the components into the panel while following
its guidelines and fulfilling the size requirements of the components.
If the manager cannot satisfy the programmer's instruction
and/or the preferred sizes of the components, if there is too little
room, then it will do the best it can according to its own rules.
The Component
class offers a getPreferredSize()
method, which can be overridden, that the layout managers invokes
to find out how much space the component needs. For example, a label
or button needs at least enough room to display its text or icon.
Although it can be done, portablity argues strongly
against absolute positioning. The layout manager approach
provides a portable and flexible approach to the arrangement of
the components. Combined with the lightweight
features of Swing components, layout managers offer consistent appearance
across different platforms.
The following layout managers can accomplish most
any arrangements you could want. Remember that you can build complex
interfaces with multiple panels, each with their own layout manager.
The FlowLayout
is the default for JPanel
but you can always specify one of the other layout managers.
We don't have space here to discuss all of the details
of these layout managers. The resources below give links to the
the J2SE5.0
Specifications for the classes and to the layout tutorials at
the Sun
Java Tutorial.
The following applets demonstrate five of the layout
managers:
FlowLayout
FlowLayout
is the default layout manager for most components. It
lays out omponents horizontally, left to right until no
room is left and then it moves down one row and continues
placing the components sequentially left to right.
|
FlowApplet.java
|
import
javax.swing.*;
import java.awt.*;
import java.awt.event.*;
import java.util.*;
/** Demo of the FlowLayout manager. **/
public class FlowApplet extends JApplet
{
// Add an instance of FlowPanel to the applet.
public void init () {
Container content_pane = getContentPane
();
// Create an instance of a JPanel
sub-class
FlowPanel flow_panel = new FlowPanel
();
// And add one or more panels to
the JApplet panel.
content_pane.add (flow_panel);
} // init
} // class FlowApplet
/** A simple example of a Panel with five buttons. **/
class FlowPanel extends JPanel
{
FlowPanel () {
// Default for JPanel is FlowLayout
add (new JButton ("One") );
add (new JButton ("Two") );
add (new JButton ("Three") );
add (new JButton ("Four") );
add (new JButton ("Five") );
} // ctor
} // class FlowPanel
|
BorderLayout
Arranges
up to five components in five positions: Center, East,
West, North, and South as shown below. Components placed
in the East and West positions will use all of the vertical
space available while components in the North and South
positions will use up all of the horisonal positions.
The component in the Center will use up the remaining
space in both horizontal and vertical directions.
|
BorderApplet.java
|
import
javax.swing.*;
import java.awt.*;
/** Demo of the BorderLayout manager. **/
public class BorderApplet extends JApplet {
public void init () {
Container content_pane = getContentPane
();
// Create an instance BorderPanle
BorderPanel border_panel = new BorderPanel
();
// And add it to the applet panel.
content_pane.add (border_panel);
} // init
} // class BorderApplet
/** Arrange five buttons using a BorderLayout. **/
class BorderPanel extends JPanel{
BorderPanel () {
setLayout ( new BorderLayout ()
);
add (BorderLayout.EAST, new JButton
("East") );
add (BorderLayout.WEST, new JButton
("West") );
add (BorderLayout.NORTH, new JButton
("North") );
add (BorderLayout.SOUTH, new JButton
("South") );
add (BorderLayout.CENTER, new JButton
("Center") );
} //ctor
} //class BorderPanel
|
GridLayout
Place
components in a Row vs Column matrix. Components fill
slots starting on top row, left to right, then move to
next row down.
|
GridApplet.java
|
import
javax.swing.*;
import java.awt.*;
import java.awt.event.*;
import java.util.*;
/** Demo of GridLayout. **/
public class GridApplet extends JApplet
{
public void init () {
Container content_pane = getContentPane
();
// Create an instance of a JPanel
sub-class
GridPanel grid_panel = new GridPanel
();
// And add one or more panels to
the JApplet panel.
content_pane.add (grid_panel);
} // init
} // class GridApplet
/** A sample JPanel class for holding components. **/
class GridPanel extends JPanel
{
GridPanel () {
setLayout ( new GridLayout (3, 2));
add (new JButton ("One") );
add (new JButton ("Two") );
add (new JButton ("Three") );
add (new JButton ("Four") );
add (new JButton ("Five") );
} // ctor
} // class GridPanel
|
The most powerful layout manager is the GridBagLayout
shown below. It is very useful
when you have an elaborate interface with lots of components.
The GridBagLayout
is tricky for complicated layouts and will require lots of
tuning to get the layout just the way you want.
We recommend that you use it a few times to learn
how it works but then switch to a graphical
interface builder to build elaborate interfaces with lots
of components. This will be much faster and less aggravating.
GridBagLayout
Although GridBagLayout
follows a grid placement approach like GridLayout,
it works more like the hypertext table. That is,
rather than a fixed number of rows and cells and fixed
cell widths, it will let components span more than one
cell vertically and/or horizontally.
GridBagLayout
places a component according to the settings in an instance
of the helper class GridBagConstraints.
As shown below, you create a GridBagConstraints
object and set one or more of its data fields to one of
optional values. When you add the component to the panel,
the GridBagConstraints
object is also passed as an argument.
Note that you don't give a fixed initial
number of rows and columns. Instead, the layout determines
the table parameters according to what will satisfy all
of the the GridBagConstraints
settings for the gridx,
gridy
values for all of the components.
|
GridBagApplet.java
|
import
javax.swing.*;
import java.awt.*;
import java.awt.event.*;
import java.util.*;
/** Demo of GridBagLayout. **/
public class GridBagApplet extends JApplet{
public void init () {
Container content_pane = getContentPane
();
// Create an instance of the GridBagPanel
GridBagPanel grid_bag_panel = new
GridBagPanel ();
// And add it to the applet's panel.
content_pane.add (grid_bag_panel);
} // init
} // GridBagApplet
/** Create
a JPanel with 5 buttons and use GridBagLayout manager.**/
class GridBagPanel extends JPanel {
GridBagConstraints constraints = new GridBagConstraints
();
GridBagPanel () {
setLayout (new GridBagLayout ());
// Create a 3 row grid
// Fill the grid squares with the
component
// in both x and y directions
constraints.fill = GridBagConstraints.BOTH;
// Keep same weight in vertical
dimension
constraints.weighty = 1.0;
// Top row will include three components,
each
// weighted differently in x
// 0,0
constraints.weightx = 1.0;
constraints.gridx = 0; constraints.gridy
= 0;
add (new JButton ("0,0"), constraints
);
// 0,1
constraints.weightx = 0.5;
constraints.gridx = 1; constraints.gridy
= 0;
add (new JButton ("1,0"), constraints
);
// 0,2
constraints.weightx = 0.1;
constraints.gridx = 2; constraints.gridy
= 0;
add (new JButton ("2,0"),
constraints );
// Middle row has two components.
First takes up two
// rows, second takes up two columns
// The first component on second
row will span
// vertically to third row
// 0,1 to 0,2
constraints.weightx = 1.0;
constraints.gridx = 0; constraints.gridy
= 1;
constraints.gridheight = 2;
add (new JButton ("0,1 to 0,2"),
constraints );
// The second component on second
row will span
// horizontally to third column
// 1,1 to 2,1
constraints.weightx = 1.0;
constraints.gridx = 1; constraints.gridy
= 1;
constraints.gridheight = 1;
constraints.gridwidth =
2;
add (new Button ("1,1 to 2,1"),
constraints );
// Bottom row has 2 components with
fill set to NONE
// Use anchor.
constraints.fill = GridBagConstraints.NONE;
// 1,2
constraints.anchor = GridBagConstraints.SOUTHEAST;
constraints.weightx = 0.5;
constraints.gridx = 1; constraints.gridy
= 2;
constraints.gridheight = 1;
constraints.gridwidth =
1;
add (new JButton ("1,2"), constraints
);
// 2,2
constraints.anchor = GridBagConstraints.WEST;
constraints.weightx = 0.1;
constraints.gridx = 2; constraints.gridy
= 2;
constraints.gridheight = 1;
constraints.gridwidth =
1;
add (new JButton ("2,2"), constraints
);
} // ctor
} // class GridBagPanel
|
SpringLayout
Use spring constraints to set a component
relative to the edges of other components. For example,
the following invocation of putConstraint
layout.putConstraint
(SpringLayout.WEST, component1, 5,
SpringLayout.WEST, panel);
places the west (i.e. left) edge of component1
at 5 pixels from the west edge of the panel that holds
component1.
The refs below give links to the tutorial
and specifications for details SpringLayout.
SpringLayout
was added in 1.4 as an alternative to GridBagLayout
but, as we see in the code below, it requires a lot of
boilerplate code that gets repeated over and over
and this becomes cumbersome for a situation involveint
a large number of components. So it is really more suitable
for use by a GUI builder.
|
SpringApplet.java
|
import
javax.swing.*;
import java.awt.*;
import java.awt.event.*;
import java.util.*;
/** Demo of SpringLayout manager. **/
public class SpringApplet extends JApplet {
public void init () {
Container content_pane = getContentPane
();
// Create an instance of SpringPanel.
SpringPanel spring_panel = new SpringPanel
();
// And add it to our applet's panel.
content_pane.add (spring_panel);
} // init
} // class SpringApplet
/** Arrange
five buttons using a SpringLayout. **/
class SpringPanel extends JPanel {
/**
* Constructor creates 5 button interface
with SpringLayout
* and constrains each to a particular
position relative
* to the panel frame and to its
neighbors.
**/
SpringPanel () {
SpringLayout layout = new SpringLayout
();
setLayout ( layout );
JButton one = new JButton
("One");
JButton two = new JButton
("Two");
JButton three = new JButton ("Three");
JButton four = new JButton
("Four");
JButton five = new JButton
("Five");
add (one);
add (two);
add (three);
add (four);
add (five);
// Now set the distances between
the edges.
// Put the first button at pixel
coords (5,5)
// relative to the panel's frame.
layout.putConstraint (SpringLayout.WEST,
one,
5, SpringLayout.WEST, this);
layout.putConstraint (SpringLayout.NORTH,
one,
5, SpringLayout.NORTH, this);
// Put the second button 5 pixels
to the right of the
// first button and 40 pixels below
the top panel edge.
layout.putConstraint (SpringLayout.WEST,
two,
5, SpringLayout.EAST, one);
layout.putConstraint (SpringLayout.NORTH,
two,
40,SpringLayout.NORTH, this);
// Put the third button 100 pixels
to the left of the
// panel edge and 5 pixels above
the second button.
layout.putConstraint (SpringLayout.WEST,
three,
100, SpringLayout.WEST, this);
layout.putConstraint (SpringLayout.NORTH,
three,
5, SpringLayout.SOUTH, two);
// Put the fourth button 15 pixels
to the right of the
// first button and 5
pixels below the top panel edge
layout.putConstraint (SpringLayout.WEST,
four,
15, SpringLayout.EAST, one);
layout.putConstraint (SpringLayout.NORTH,
four,
5, SpringLayout.NORTH, this);
// Put the fifth button 25 pixels
to the right of the
// third button and 5 pixels below
it
layout.putConstraint (SpringLayout.WEST,
five,
25, SpringLayout.EAST, three);
layout.putConstraint (SpringLayout.NORTH,
five,
5, SpringLayout.SOUTH, three);
} // ctor
} // class SpringPanel
|
In the next section
we discuss the BoxLayout,
which is another alternative to GridBagLayout.
References
& Web Resources
Most recent update: Sept. 24.05
|