Lesson 8.6 GridLayout
Using GridLayout
You've learned about layout managers in previous lessons. In this lesson, you'll meet the GridLayout layout manager which allows you to create applets that use equal-sized rows and columns, such as a spreadsheet or a numeric keypad.
When you use a GridLayout, each component "swells" up to fill the cell that it is located in. You've already seen this kind of behavior with the BorderLayout layout manager. When BorderLayout places a component in the "North" or "South" positions, it "asks" the component how high it wants to be, but ignores the component's preferred width. Instead, the component swells until it is as wide as its container.
Likewise, when BorderLayout places a component in the "East" or "West" position, it honors the component's preferred width, but ignores its suggestions regarding height. Finally, when BorderLayout places a component in the "Center" position, it ignores all of its preferences and just inflates it until it fits the space not occupied by other components.
GridLayout works a little like putting a component in the "Center" position with BorderLayout. The GridLayout layout manager ignores the component's size entirely, and divides its space on a purely egalitarian basis. Here's how it works.
Creating a GridLayout
When you create a GridLayout, you can control four different attributes of the layout:
- The number of columns
- The number of rows
- The vertical space between rows [vgap]
- The horizontal space between columns [hgap]
When you add elements to your GridLayout, you don't get to choose where they go. Instead, they are added in the same order that components are added to a FlowLayout layout manager.
The first component is placed in the upper left corner, the next in the cell to its right. When all the cells have been filled on the first row, then the first cell in the second row is filled.
There are three GridLayout constructors. Here's an example of each:
| GridLayout gl1, gl2, gl3;
gl1 = new GridLayout();
gl2 = new GridLayout(3, 4);
gl3 = new GridLayout(4, 3, 10, 2); |
The Default Constructor
The first constructor, used for gl1, creates a layout that contains 1 row and 0 columns. When used to specify rows and columns, GridLayout uses 0 to mean "any-number-of." The first constructor thus creates a layout that can accept any number of components, but all of them will appear on the same row.
Here's an example that adds 5 Buttons to the GridLayout gl1.
|
GL1.java
|
import java.awt.*;
import java.applet.*;
public class GL1 extends Applet
{
public void init()
{
GridLayout gl1 = new GridLayout();
setLayout(gl1);
for (int i = 0; i < 5; i++)
add(new Button(" # " + i + " "));
}
}
|
Row-Column Constructor
The second GridLayout constructor allows you to specify the number of rows and columns. In the example, gl2 specifies 3 rows and 4 columns. Remember that the first argument is the number of rows.
Here's an applet that shows what this looks like when you add 12 Buttons to the gl2 GridLayout manager. Notice that the Buttons are added from left to right, starting at the top, and working down.
|
GL2.java
|
// Row/Column GridLayout constructor
import java.awt.*;
import java.applet.*;
public class GL2 extends Applet
{
public void init()
{
GridLayout gl2 = new GridLayout(3, 4);
setLayout(gl2);
for (int i = 0; i < 12; i++)
add(new Button(" # " + i + " "));
}
}
|
When you specify rows and columns, you can use 0 to mean "any number". You can use 0 for either rows or columns, but not both. If you do that, you'll throw an exception.
For instance, if you change gl2 so that it is constructed like this:
gl2 = new GridLayout(3, 0);
it will still have three rows, but columns will expand to fill as many components as you supply. If you add 6 Buttons to an applet using this new layout manager, the columns will still fill row-by-row, left-to-right, as you can see here in the applet GL2b.java.
The hgap/vgap Constructor
The final constructor, which takes four arguments, allows you to specify the vertical space that appears between adjacent rows and the horizontal space that appears between adjacent columns. The constructor used to initialize gl3:
gl3 = new GridLayout(4, 3, 10, 2);
leaves a 10-pixel space between columns, and a 2-pixel space separating the rows. You can see how that looks in the applet GL3.java, which is just like GL2.java except for the constructor used.
GridLayout Methods
Once you've created your GridLayout, you normally won't need to change it, but you can, at any time by using the following methods:
- setRows(), setColumns(). These two methods allow you to change the number of columns and rows used by the layout at runtime.
- setHgap(), setVgap(). These methods allow you to change the horizontal and vertical spacing between components at runtime.
In addition to these four methods, the GridLayout class has four methods that allow you to query each of these attributes: getRows(), getColumns(), getHgap(), and getVgap().
Something to Talk About
Usually, you won't use GridLayout by itself. Instead, you'll use GridLayout along with Panel objects and the BorderLayout or FlowLayout managers. Here's an exercise that tests your ability to do that:
Write the init() method of an applet that sets the layout manager to BorderLayout and then adds a Panel containing 4 Buttons to the bottom of the applet. The Panel should use GridLayout, with a 5-pixel spacing between Buttons. The Panel should have a single row of Buttons, but you should be able to add any number of Buttons to the Panel.
This is the last section of this lesson.
|
