J23. Creating User Interfaces cont.

Panels and Layouts

The actual appearance of the AWT components on the screen is usually determined by two factors; how those components are added to the panel and the layout manager that panel is currently using to layout the screen. Each Panel on the screen can have it's own layout manager. The AWT provides 5 basic layout managers :

After the layout has been set, componets can start to be added to the panel. The order of loading components into a panel is important. but anyway, on to the layout managers.

FlowLayout Class

The flowlayout class is the most basic of the layouts, using this method componets are added to the panel one at a time, row by row. If a component doesn't fit then it is wrapped to the next row. The alignment of the componets can be altered. It's default value is centered and it can be either left or right justified. This is done using the lines :

setLayout(new FlowLayout.LEFT));

setLayout(new FlowLayout.RIGHT));

If the .RIGHT or .LEFT isn't added, then it is centered. It is also possible to have spaces between each component. This is done by adding an x and y arguement after the alignment, x is the horiziontal length and y is the vertical. It would look like this :

setLayout(new FlowLayout.LEFT,30,10));

setLayout(new FlowLayout.RIGHT,50,20));

Example time :

import java.awt.*;

public class FlowLayoutTest extends java.applet.Applet 
{
 public void init()
 {
  setLayout (new FlowLayout(FlowLayout.LEFT,50,20));

  add(new Button("One"));
  add(new Button("Two"));
  add(new Button("Three"));
  add(new Button("Four"));
  add(new Button("Five"));
 }
}
Grid Layouts

Grid Layouts offer more control over the placement of components. Using grid layouts, the applet is separated in to columns and rows, with the components being loaded left to right then down one row, then left to right. Gridlayouts also off er ability to put spaces in between the buttons (Note, I'm using buttons as my component, because they are easy to work with). The signature of teh grid layout with gaps is Gridlayout(3,3,10,30), where it creates a 10 pixel horizontal gap with a 30 pixel vertical gap. Here's some code :

 
import java.awt.*;

public class GridLayoutTest extends java.applet.Applet 
{
 public void init()
 {
  setLayout (new GridLayout(3,3,20,10));

  add(new Button("One"));
  add(new Button("Two"));
  add(new Button("Three"));
  add(new Button("Four"));
  add(new Button("Five"));
 }
}
Border Layouts

Border Layouts behave differently than the previous layouts you have seen. This is bcause added componets require a geographic location to be placed, such as east,west, north or south. Border layouts can have vertical and horizontal gaps and that particualar layout looks like this :

setLayout(new BorderLayout(10,10));

Anyway, Example time :

 
import java.awt.*;

public class BorderLayoutTest extends java.applet.Applet 
{
 public void init()
 {
  setLayout (new BorderLayout());

  add("North", new Button("One"));
  add("East", new Button("Two"));
  add("South", new Button("Three"));
  add("West", new Button("Four"));
  add("Center", new Button("Five"));
 }
}