Previous |
Next |
Java uses a different philosophy to layout compared with tools such as Visual Basic or Delphi (if philosophy is not too grand an expression for laying out a program). Most design tools use an XY pixel based approach to placing a component. A component will effectively be placed X number of pixels from the left of the screen and Y number of pixels from the bottom of the screen. Thus in Visual Basic you can pick up a text box from the component palette and drop it at a location on a form, its location is set.
If you then run the same program with a different screen resolution the components will retain their location rather than being adjusted to account for the screen size. If you run the program on a smaller screen it could be that the component will actually be “off the screen” and invisible. By contrast Java uses Layout classes to control where a component is placed according to the current screen.
Part of the reason for this is the cross platform nature of Java. A Java applet may display on anything from a palm top computer, a mobile phone to a 19 inch Monitor. I have tried writing Visual Basic applications that take account of more than one screen resolution and it is not a trivial activity. Be warned, if you have a background in other RAD tools you may find the Layout Manager approach a little weird at first. If you know your guaranteed target platform is going to be a standard desktop monitor, the layout approach can be frustrating. If at some point in the future this guarantee turns out to be hollow and you have to target a different platform, you may be grateful to the designers of the Java layout system.
Layout managers are generally used in combinations to almost "suggest" how an application should appear. Thus components have a default "preferred" size. Under one layout manager configuration they will be allowed to display at their "preferred" size, but under another they may be confined to a particular size, which may be influenced by the size of other components in the application.
The FlowLayout manager is a good place to start as it is the default for Applets and Panels The FlowLayout manager simply places components on a background one after the other from left to right. If it runs out of space to the right it simply wraps around the components to the next line.
The following code creates a very simple application and adds a series of buttons
import javax.swing.*;
import java.awt.*;
public class FlowAp extends JFrame{
public static void main(String argv[]){
FlowAp fa=new FlowAp();
//Change from BorderLayout default
fa.getContentPane().setLayout(new FlowLayout());
fa.setSize(200,200);
fa.setVisible(true);
}
FlowAp(){
JButton one = new JButton("One");
getContentPane().add(one);
JButton two = new JButton("Two");
getContentPane().add(two);
JButton three = new JButton("Three");
getContentPane().add(three);
JButton four = new JButton("four");
getContentPane().add(four);
JButton five = new JButton("five");
getContentPane().add(five);
JButton six = new JButton("Six");
getContentPane().add(six);
}//End of constructor
}//End of ApplicationThe following image is the default appearance when you fire it up from the command line.

If you change the width of the application by dragging the right hand side of the Frame however, the program re-configures the layout of the buttons thus.

Bear in mind that both images are the display for exactly the same java code. The only thing that has changed is the width. The FlowLayout manager automatically changes the layout of the components when the Frame is re-sized. If you were to make the Frame very small the FlowLayout manager would change the layout so that the buttons were wrapped around in several rows.
When you first come across this approach to the management of components it may seem a little arbitrary. Some of the GUI building tools such as NetBeans and JBuilder offer ways of specifically placing components. For instance Borland JBuilder offers the XYLayout that gives you this functionality.
For the purposes of this course I will concentrate on three of the Layout managers shipped by Sun, these are
FlowLayout
BorderLayout
GridLayout
These give you enough control over component layout for most demonstration programs. The FlowLayout and BorderLayout are the default Layout Managers for the Frame and Applet class respectively. Thus if you create a Frame and do not specifically assign a Layout Manager it will automatically use the BorderLayout.
|
|
The default layout for a frame is the BorderLayout |
This is slightly awkward as the BorderLayout is not the most useful of Managers. It divides the Frame area up into five regions, North, South, East, West and Centre. Also if you do not specify a region each new component defaults to the centre of the Frame and if you add more than one component without a region, each new component gets added on top of the old one. So for the purposes of these demonstration programs you may find it useful change the Layout Manager to FlowLayout. This can be done using the setLayout Method of Frame. Thus you can change from the default BorderLayout to a FlowLayout with the following code in a Frame constructor
f.setLayout(new FlowLayout);
Here is a small demonstration showing how the BorderLayout places components added with the region constraints.
import javax.swing.*;
public class BorDemo extends JFrame{
JButton n = new JButton("North");
JButton e = new JButton("East");
JButton s = new JButton("South");
JButton w = new JButton("West");
JButton c = new JButton("Centre");
public static void main(String argv[]){
BorDemo b = new BorDemo();
}
BorDemo(){
getContentPane().add(n,"North");
getContentPane().add(e,"East");
getContentPane().add(s,"South");
getContentPane().add(w,"West");
getContentPane().add(c,"Center");
setVisible(true);
setSize(300,300);
}
}Note how the add method is overloaded to take a region constraint.
This is how the program displays itself.

The GridLayout manager does approximately what you might expect. It divides the surface area up into a grid and when you add components it places them one after the other from left to right, top to bottom. Unlike the BorderLayout and FlowLayout it ignores any preferred size of the component. For example the preferred size of a button will be wide enough to show its text. The FlowLayout manager attempts to ensure that a button is this preferred size. The GridLayout has a more bondage and discipline approach. The only thing it cares about is making sure the component fits into the grid.
The following code lays out a set of buttons within a Frame using a GridLayout that has been set up to have 2 rows and 5 columns.
import javax.swing.*;
import java.awt.*;
public class GridAp extends JFrame{
public static void main(String argv[]){
GridAp ga=new GridAp();
//Setup GridLayout with 2 rows and 5 columns
ga.getContentPane().setLayout(new GridLayout(2,5));
ga.setSize(400,300);
ga.setVisible(true);
}
GridAp(){
getContentPane().add(new JButton("One"));
getContentPane().add(new JButton("Two"));
getContentPane().add(new JButton("Three"));
getContentPane().add(new JButton("Four"));
getContentPane().add(new JButton("Five"));
getContentPane().add(new JButton("Six"));
getContentPane().add(new JButton("Seven"));
getContentPane().add(new JButton("Eight"));
getContentPane().add(new JButton("Nine"));
getContentPane().add(new JButton("A very long button label indeed"));
}//End of constructor
}//End of Application
As you can probably imagine, no one Layout manager is suitable for all the requirements of an application. They are normally used in cooperation with other Container controls. It is common to use JPanel component as a convenient “container” for other components. Thus a BorderLayout may be used for a Frame but a JPanel will be added to the North. The JPanel can have its own layout manager, and components can be added to the JPanel. Thus the panel is set to use a FlowLayout and buttons are added within the Panel. Another Panel might be added to the center which is set to the GridLayout and a series of Buttons added there.
The following code demonstrates the use of multiple layouts.
import javax.swing.*;
import javax.swing.JPanel;
import java.awt.*;
/**
* Demonstration of using multiple layouts
* Marcus Green 2005
**/
public class MultiLay extends JFrame{
public static void main(String argv[]){
MultiLay ml=new MultiLay();
}
MultiLay(){
/* Setup GridLayout with 2 rows and 1 column */
/**
* This grid layout will set the button one to occupy all of
* the top of the frame. The flow layout used in the second panel
* means its preferred size will be respected and thus it will
* occupy only enough space to show the text "two"
* If you are using earlier than JDK 1.5 you will need
* getContentPane code here
**/
setLayout(new GridLayout(2,1));
add(new JButton("One"));
JPanel jp = new JPanel();
jp.setLayout(new FlowLayout());
add(jp);
jp.add(new Button("two"));
setSize(400,300);
setVisible(true);
}
}

Previous |
Next |