A method provided in GridBagLayout will bind the constraints to a particular Component. When the Component is added to the Container (using the add method), GridBagLayout will use the information in the Components corresponding GridBagConstraints object to determine the Component's position and size.

In short, the process is:
1. Create Component
2. Set GridBagConstraints for Component
3. Bind Component and GridBagConstraints object
4. Add Component

Most of the work involved in using GridBagLayout is setting the constraints correctly.

As the name implies, GridBagLayout has something to do with a grid (and a bag). GridBagLayout is similar to GridLayout in the following regards:

The differences between GridLayout and GridBagLayout are more striking:

Also, GridBagLayout offers no methods to explicitly define the number of rows or columns in the grid, nor does it have methods to define the size of each cell in the grid. Instead, GridBagLayout calculates the number of rows and columns in a grid by the number of Components placed on the screen. If a container has five Components lined up horizontally, then the grid consists of five columns and one row. If the Container has five Components lined up vertically, then the grid consists of one column and five rows. So how do you know how many columns and rows your GUI will have? Well, the best way is to hand draw your gui and create the grid for yourself. Figure 1 shows a standard source/destination kind of gui. Note the dashed lines and numbers. We have gone along the X axis and made a mark when we came into contact with the upper-left hand corner of a Component. We have done the same thing along the Y axis. Keep in mind when you do this on your own that you should mark only the upper left hand corner of the Component. After the exercise is complete, you are left with the grid your GridBagLayout will use to place Components.

Once the grid is complete, we have some very important pieces of information; the upper left hand coordinate of each Cell, and the width and height of each Cell. GridBagConstraints has data members that maintain this information and need to be set for the gui to work. The data members are: gridx, gridy, gridwidth and gridheight. Look at Figure 2 to see the cells of the grid and Table 1 to see the GridBagConstraints attributes for each Component.

In our program, we have created a helper method, addComponent, to assist in setting the constraints. Notice that we do not have to create a new GridBagConstraints object every time we add a Component. Also notice the sequence of events: First we set constraints, then we bind the constraints to the Component using the setConstraints method and finally we add the Component. Be sure to do things in this order to avoid confusion! Look at Listing 1 for the complete code listing. And congratulations! If you can get this far, you have done the hard part.

Once the program has been compiled and executed we find that the results are not quite the same as our intention. The code needs some refinement. Look at Figure 3 for the output of the program. Notice that the four buttons in the center are not aligned, and everything is squished together in the center of the screen. The remaining tasks involve setting more constraints attributes on each Component.

GridBagConstraints.fill
The default value for the fill is NONE, meaning that a Component will not grow to fill its entire cell if there is extra space available in the cell. Look at the > button and the >> button. The width of the column is the width of the >> button (column width is always the width of the widest cell in the column). Using the fill attribute, we can specify that a Component will fill in one of four ways:

GridBagConstraints.anchor
The anchor attribute specifies where in the cell the component will be placed. The default value is CENTER. Other values are: NORTH, NORTHEAST, EAST, SOUTHEAST, SOUTH, SOUTHWEST, WEST and NORTHWEST. Look at Figure 4 and the code snippet in Listing 2 to see what happens to the labels and OK and Cancel buttons when the anchors are adjusted. Note that if the fill is set to BOTH, setting the anchor is pretty meaningless.

GridBagConstraints.weightx and GridBagConstraints.weighty
If you have taken the time to type in the code provided in Listing 2 and played around with the resulting Frame, you will have noticed that regardless of the size of the frame, the Components cluster in the middle of the Container and don't resize when the Frame resizes. Ascribing a weight to a Component will allow the Components cell to grow or shrink with the Container. Keep in mind that it is only the cell size that changes, not the Component in the cell. The default value for weightx and weighty is zero, meaning that extra space in the Container will not be absorbed by a cell. A non-zero weightx indicates the ratio describing how extra space will be distributed among horizontally neighboring cells. For example, if the OK button has a weightx of 2, and the Cancel button has a weightx of 1, when the Frame is made wider, the OK Button's cell will receive 2 pixels for every one received by the Cancel Button. The same is true for weighty neighbors. In general, the greater the weight, the more space the cell will receive.

Note also that weights affect the cell size, not the Component size. Here is where some of the other attributes of GridBagConstraints will play an important role. If the fill is set to something other than NONE, and a cell has a non-zero weight, the Component itself will grow to fill any newly acquired space in the cell. Alternatively, if an anchor is set to something other than CENTER, and a cell has a weight other than zero, the positioning of a Component within a cell will be more apparent. Play around with it!

GridBagConstraints.insets
Insets add a border of a fixed pixel size to the inner perimeter of the cell. Adding insets may make the size of the Component shrink.
GridBagConstraints.ipadx and GridBagConstraints.ipady
ipadx and ipady (internal padding x and internal padding y ) will add a fixed number of pixels to the width and height of a component. They will make the size of the Component larger. See Figure 5 to see the differences between insets and internal padding.

GridBagLayout Tips
Once you successfully develop a screen using GridBagLayout, you may want to change it later. This will be difficult if you have used consecutive numbers for your gridx and gridy values. For example, if you wanted to squeeze another Component in between the add Button and the addAll Button, you would have to enter new gridy values for all of the Components appearing below the new Component. Instead, it is a good practice to make your gridx and gridy values multiples of 10. Instead of column numbers being 1,2,3 they should be 10,20,30. The same is true for rows. A co-worker has noticed that this is also a good practice in defining line numbers for BASIC programming.

I have not discussed GridBagConstraints.RELATIVE and GridBagConstraints.REMAINDER. Don't use them until you read my next column! As with any other topic in programming, the best way to learn it is to play around with the code, so please do so.