Graphical User Interfaces in Java

Graphical User Interfaces in Java

In Java Graphical User Interface (GUI) programming, we do not build GUI components from scratch. Instead we use GUI components provided to us by the JDK. Java has two types of GUI applications: stand-alone GUI applications and applets. We first study how to build stand-alone GUI applications (GUI app for short).

Every GUI app uses what is called a JFrame that comes with the JDK. A JFrame is a window with borders, a title bar, and buttons for closing and maximizing or minimizing itself. It also knows how to resize itself. Every GUI app subclasses JFrame in some way to add more functionality to the window frame. One common task is to tell the system to terminate all "threads" of the GUI app when the user clicks on the exit (close) button of the main GUI window. We encapsulate this task in an abstract frame class called AFrame described below.

0. Abstract Frame (AFrame.java)

NOTE: 

The source code for AFrame is available in the glossary.

Event

When the user interacts with a GUI component such as clicking on it or holding the mouse down on it and drag the mouse around, the Java Virtual Machine (JVM) fires appropriate "events" and delivers them to the GUI component. It is up to the GUI component to respond to an event. The abstract notion of events is encapsulated in an abstract class calledAWTEvent provided by Java. Specific concrete events are represented by appropriate concrete subclasses of AWTEvent.

For example, when the user clicks on the close button of a JFrame, the JVM fires a window event represented by the class WindowEvent and delivers it to the JFrame. By default, the JFrame simply hides itself from the screen while everything else that was created and running before the JFrame disappears from the screen is still alive and running! There is no way the user can redisplay the frame again. In the case when the JFrame is the main window of a GUI app, we should terminate everything when this main frame is closed. The best way to ensure this action is to "register" a special window event "listener" with the JFrame that will call the System class to terminate all threads related to the current program and exit the program. The code looks something like this:

        addWindowListener(new WindowAdapter() {
            public void windowClosing(WindowEvent e) {
                System.exit(0);
            }
        });
    

Every time we write the constructor for a main frame of a GUI app, we invariably find ourselves writing the above lines of code to exit the program plus some additional application specific code to initialize the frame. So, instead of "copy-and-paste" the above code ("opportunistic" re-use), we capture this invariant task in the constructor of an abstract class calledAFrame and reuse the code by subclassing from it. The application specific code to initialize the main frame is relegated to the specific concrete subclass of AFrame and is represented by an abstract method called initialize(). The constructor for AFrame calls initialize(), which, at run-time, is the concrete initialization code of the concrete subclass ofAFrame that is being instantiated, as shown below.

    public AFrame(String title) {
        // Always call the superclass's constructor:
        super(title);

        addWindowListener(new java.awt.event.WindowAdapter() {
            public void windowClosing(java.awt.event.WindowEvent e) {
                System.exit(0);
            }
        });

        initialize();
    }
    

NOTE: 

See the full code listing for more information

Template Method Pattern: Expressing Invariant Behavior in terms of Variant Behaviors

NOTE: 

The code for the classes AFrame, FrameA, FrameAB, and FrameAC are available in the glossary.

The code for AFrame is an example of what is called the Template Method Pattern. This design pattern is used to expresses an invariant and concrete behavior that consists of calls to one or more abstract methods. An abstract method represents a variant behavior. In other words, the template design pattern is a means to express an invariant behavior in terms of variant behaviors. We shall see this pattern used again in expressing sorting algorithms.

Caveat

As stated earlier, the call to initialize() in the constructor of AFrame will only invoke the concrete initialize() method of the concrete descendant class of AFramethat is being instantiated. Because initialize() is polymorphic, care must taken to ensure proper initialization of descendant classes that are more than one level deep in the inheritance hierarchy of AFrame. Consider the following inheritance tree as illustrated by the following UML class diagram. Click here to see the code.

Figure 1

In overriding the initialize() method of FrameA, a direct subclass of AFrame, we should not invoke the initialize() method of the superclass AFrame via the callsuper.initialize() because super.initialize() is abstract. However, the initialize() method of any subclass of FrameA and below should make a call to the initialize() method of its direct superclass in order to ensure proper initialization. For example, in the above diagram, new FrameAB("ab") calls the constructor FrameAB, which calls the constructor FrameA, which calls the constructor AFrame, which calls

• the constructor JFrame and then calls
• initialize(), which is the initialize() method of FrameAB which calls
  • super.initialize(), which should properly initialize FrameA, and then calls
  • the additional initialization code for FrameAB.

EXERCISE 1

What is the chain of calls when we instantiate a FrameAC

1. Simple JFrame (Frame0.java)

NOTE: 

Frame0App.java is available in the source code archive file.

Frame0App.java represents one of the simplest GUI application in Java: it simply pops open an Frame0 object. Frame0 is subclass of AFrame that does nothing in its concreteinitialize() method.

2. JFrame with JButtons but no event handlers (Frame1.java)

NOTE: 

Frame1.java is available in the source code archive file.

To display other GUI components on a JFrame, we first need to get the content pane of the JFrame and then add the desired GUI components to this content pane.

If we want to arrange the added GUI components in certain ways, we need to add an appropriate "layout manager" to the JFrame. The task of laying out the GUI component inside of a container GUI component is specified by an interface called LayoutManager. In Frame1, we add the FlowLayout that arranges all GUI components in a linear fashion. If we do not add any layout manager to the JFrame, it has no layout manager and does a very bad job of arranging GUI components inside of it. As an exercise, comment out the code to add theFlowLayout to Frame1 and see what happens!

Strategy Pattern

JFrame is not responsible for arranging the GUI components that it contains. Instead it delegates such a task to its layout manager, LayoutManager. There are many concrete layout managers: FlowLayout, BorderLayout, GridLayout, etc. that arrange the internal components differently. There are said to be different strategies for layout. The interaction between JFrame and its layout manager is said to follow the Strategy Pattern.

The strategy pattern is powerful and important design pattern. It is based on that principle of delegation that we have been applying to model many of the problems so far. It is a mean to delineate the invariant behavior of the context (e.g. JFrame) and the variant behaviors of a union of algorithms to perform certain common abstract task (e.g. LayoutManager). We shall see more applications of the strategy design pattern in future lessons.

At this point the only the buttons in the Frame1 example do not perform any task besides "blinking" when they are clicked upon. The example in the next lecture will show how to associate an action to the click event.

Click here to download code samples.

GLOSSARY

AFrame.java:

package view;

import javax.swing.*;  // to use JFrame.

/**
 * Minimal reusable code to create a JFrame with a title and a window event
 * listener to call on System.exit() and force termination of the main
 * application that creates this JFrame.
 * @author D.X. Nguyen
 */
public abstract class AFrame extends JFrame {

    public AFrame(String title) {
        // Always call the superclass's constuctor:
        super(title);

        /**
        * Add an anonymous WindowAdapter event handler to call System.exit to
        * force termination of the main application when the Frame closes.
        * Without it, the main application will still be running even after
        * the frame is closed.
        * For illustration purpose, we use the full package name for
        * WindowAdpater and WindowEvent.
        * We could have imported java.awt.event.* and avoid using the full
        * package names.
        */
        addWindowListener(new java.awt.event.WindowAdapter() {
            public void windowClosing(java.awt.event.WindowEvent e) {
                System.out.println(e);  // For illustration purpose only.
                System.exit(0);
            }
        });

        /**
        * Subclasses are to do whatever is necessary to initialize the frame.
        * CAVEAT: At run-time, when a concrete descendant class of AFrame is
        * created, only the (concrete) initialize() method of this descendant
        * class is called.
        */
        initialize();
    }

    /**
     * Relegates to subclasses the responsibility to initialize the system to
     * a well-defined state.
     */
    protected abstract void initialize();
}
        

FrameA.java:

package view;

/**
 * A direct concrete subclass of AFrame with its own initializaion code.
 */
public class FrameA extends AFrame {

    /**
     * Calls AFrame constructor, which calls the cocnrete inititialize() method
     * of this FrameA.  This is done dynamically at run-time when a FrameA
     * object is instantiated.
     */
    public FrameA(String title) {
        super(title);
    }

    /**
     * The superclass initialize() method is abstract: don't call it here!
     * Just write application specific initialization code for this FrameA here.
     */
    protected void initialize() {
        // Application specific intialization code for FrameA goes here...
    }
}
        

SEE ALSO: AFrame

FrameAB.java:

package view;

/**
 * A second level descendant class of AFrame
 * that initializes itself by calling the
 * initialize() method of its direct superclass
 * in addition to its own initialization code.
 */
public class FrameAB extends FrameA {

  /**
  * Calls the superclass constructor, FrameA,
  * which in turns calls its superclass constructor,
  * AFrame, which first calls its superclass
  * constructor, JFrame, and then executes the
  * initialize() method of this FrameAB.
  */
  public FrameAB(String title) {
    super(title);
  }

  /**
  * At run-time, when the constructor AFrame is
  * executed, it calls this FrameAB initialize()
  * method and NOT the initialize() method of the
  * superclass FrameA.  In order to reuse the
  * initialization code for FrameA, we must make
  * the super call to initialize().
  */
  protected void initialize() {
    // Call initialize() of FrameA:
    super.initialize();

    /**
    * Additional application specific intialization
    * code for FrameAB goes here...
    */
  }
}
        

SEE ALSO: FrameA

FrameAC.java:

package view;

/**
 * A second level descendant class of AFrame
 * that bypasses the initialize() method of
 * its direct superclass in its own
 * initialization code.  Since proper
 * initialization of a subclass depends on
 * proper initialization of the super class,
 * bypassing the initialization code of the
 * superclass is a BAD idea!
 */

public class FrameAC extends FrameA {

  /**
  * Calls the superclass constructor, FrameA,
  * which in turns calls its superclass constructor,
  * AFrame, which first calls its superclass
  * constructor, JFrame, and then executes the
  * initialize() method of this FrameAC.
  */
  public FrameAC(String title) {
    super(title);
  }

  /**
  * At run-time, when the constructor AFrame is
  * executed, it calls this initialize() method and
  * NOT the initialize() method of the superclass
  * FrameA.  This method does not call the super
  * class's initialize() method. As a result, the
  * initialization done in the superclass is
  * bypassed completely.  This is a BAD idea!
  */
  protected void initialize() {
    /**
    * Application specific intialization code for
    * FrameAC goes here...
     */
  }
}