1.3.2 The Echo Applet with a GUI


We implement and describe the Echo applet in which the text to echo is passed to the program as a parameter via an input field. This is our first example of a graphical user interface (GUI) for an applet and of working with event driven programming. This example should give you the taste of GUI-programming, a topic that we shall later discuss in detail.
  1. How the Echo Applet Looks Like
  2. Creating and Running the Echo Applet
  3. The Java Code
  4. Understanding the Java Code

How the Echo Applet Looks Like
The following applet consists of an input field in which you can enter text and of two echoes of the text string in the input field. As soon as you press the <Return> or <Enter> key, the echoes are updated.

Play a bit with the above applet: change the text in the input field, scroll the text, iconify and de-iconify the Web page, reload the Web page, ..., and see what happens;

Creating and Running the Echo Applet
The cycle of creating and running the applet is similar to the one described in the previous example:
  1. Create a .java file with the java code;
  2. Compile the .java file until a correct .class file has been created;
  3. Create an .html file that includes the applet;
  4. View the .html file with a Java-enabled browser or the appletviewer of the development environment.

The Java Code
The file EchoAppletWithGUI.java with the Java code of the above applet is as follows: 
import java.applet.*;
import java.awt.*;

public class EchoAppletWithGUI extends Applet {
  String s;
  TextField fillin;

  public void init () {
    s = "enter some text";
    fillin = new TextField(s);
    add(fillin);
  }

  public void paint(Graphics g) {
    g.drawString(s, 40, 50);
    g.drawString(s, 40, 70);
  }

  public boolean action(Event e, Object arg) {
    s = fillin.getText();
    repaint();
    return true;
  }
}

Understanding the Java Code
Many of the Java language elements of the above code have been dealt with in the previous example. Here, we concentrate on the language elements that have to do with the graphical user interface. Line-by-line we get:

Importing packages
We begin with importing two packages: the java.applet package and the java.awt package. The advantage of loading a complete package such as the AWT (Abstract Window Toolkit) package instead of an individual class is that in this way you have at once access to all classes related to building up and working with a graphical user interface.

The TextField class
One of the classes defined in the AWT package is TextField. A text field is a component in which you can enter a single editable line of text. One way to create a text field is via TextField(String text). In this way you get a new text field with the specified text and wide enough to hold the text.

The init method
In the initialization phase, we
  1. create and initialize the string object s that holds the value of the text to be echoed;
  2. create and initialize the text field fillin;
  3. add the text field component of the user interface to the applet.

The action method
In reaction to the action of hitting <Return> or <Enter>, the string s gets its new value, the screen is repainted, and the Java runtime system is told that event handling has been taken care of.