Info on GridBagLayouts

Layout Managers control where Java components put objects that are added to them. The default is FlowLayout, which puts thing next to each other and drops down lines at the end of the interface. You can, however, assign a better layout manager to your interface object, for example, you can give a Frame a better layout manager and then add buttons to the frame which the layout manager will position.

GridBag LayoutManagers are the most professional of Java's Layout Managers. They allow a good layout which resizes well, however, some of the terms are hard to understand, and the Docs aren't very helpful. Hopefully the information and examples on this page will help, however you should also read the Docs.

The first thing you need to do is assign your interface object a new GridBagLayout object, thus...

Frame frame = new Frame();
GridBagLayout gridBag = new GridBagLayout();
frame.setLayout(gridBag);


Note that you can set up your interface inside a class that extends Frame or Panel (e.g. an Applet). Remember if you do this you don't have to give the object name, i.e...

GridBagLayout gridBag = new GridBagLayout();
setLayout(gridBag);


In the examples below, we'll use this, so rather than writing frame.add(ourButton) we'll write add(ourButton), however the other principles are the same.

A GridBag Layout is composed of a grid like an HTML Table. Cells can span one or more rows and/or one or more columns. In addition, there is invisible padding inside the cells between the cell edges and the components. Each cell contains one component and is created when the component is added to the interface in question.

Any given GridBagLayout Manager is associated with a GridBagConstraints object. This stores the present constraints used to build cells. You can set the constraints, build one cell, then change the constraints and build another cell with a different geometry. The first cell will keep the geometry it was originally given. For example (setting the constraints variable anchor which controls alignment)...

GridBagLayout gridBag = new GridBagLayout();
setLayout(gridBag);
GridBagConstraints c = new GridBagConstraints();
 
c.anchor = GridBagConstraints.SOUTHWEST;
gridBag.setConstraints(myComponent1, c);
add(myComponent1);
c.anchor = GridBagConstraints.SOUTHEAST;
gridBag.setConstraints(myComponent2, c);
add(myComponent2);


Note that the constraints in the above example are set using constants from the GridBagConstraints class, e.g. GridBagConstraints.SOUTHEAST.

The potential constraints you may want to set are listed below...

GridBagConstraints.gridx, GridBagConstraints.gridy
These are the coordinates of the cell you want to put your component in - cells are counted from the top left, starting with cell 0,0. You don't build the grid first and put the components in afterwards, instead you code each cell in turn. The computer looks at everything you've written when it reads in your code, and works out the number of cells and their row and column spanning before putting togther the interface.

GridBagConstraints.gridwidth, GridBagConstraints.gridheight
Specifies the number of cells in the grid the present cell should span, either horizontally or vertically.

For example, to build the following grid...

A	B
C
D

You'd use the following code...

//Cell A
c.gridx = 0;
c.gridy = 0;
c.gridwidth = 1;
c.gridheight = 1;
gridBag.setConstraints(myComponentA, c);
add(myComponentA);

 
//Cell B
c.gridx = 1;
c.gridy = 0;
c.gridwidth = 1;
c.gridheight = 2;
gridBag.setConstraints(myComponentB, c);
add(myComponentB);

 
//Cell C
c.gridx = 0;
c.gridy = 1;
c.gridwidth = 1;
c.gridheight = 1;
gridBag.setConstraints(myComponentC, c);
add(myComponentC);

 
//Cell D
c.gridx = 0;
c.gridy = 2;
c.gridwidth = 2;
c.gridheight = 1;
gridBag.setConstraints(myComponentD, c);
add(myComponentD);


The above is the basic way of making GridBag layouts, however, to make the layout look ok, you'll need to look at padding, which we'll cover in part two.