CSCI A201/A597

Lecture Notes Nine

Second Summer 2000


More about applets: their life stages. Modal dialogs. More colors.
The applets that you have seen so far are quite nice for drawing, but they aren't interactive. Interactive input in a graphical program turns out to be more complex than in a console program.

A graphical program generally makes available to the program user a large number of controls which users can manipulate in any order they please. Thus, unlike a console program, the graphical program must be prepared to process input from multiple sources in random order.

We will learn about that in the chapter on Event Handling. In this section you will learn about a simple GUI input method: a modal dialog.

GUI stands for graphical user interface. A modal dialog stops a program in its tracks and waits until the user has entered a value.

This almost makes it a console application. To display a modal dialog
String name = JOptionPane.showInputDialog("Please enter your name:");
.. you call the static showInputDialog method... ... of the JOptionPane class, which is inside...

... the javax.swing package. As an argument to it provide a suitable prompt message.

The showInputDialog method displays the dialog, together with the prompt message that you specified, and then waits... ... until then user has entered a string and clicked the "OK" button. Then it returns the string the user has entered.

So far nothing to deal with applets directly. You can use in a standalone application, as shown below.
import javax.swing.*;

public class One {
  public static void main(String[] args) {
    String name = JOptionPane.showInputDialog("What is your name?"); 
    System.out.println("Nice talking to you, " + name + ". Bye!"); 
    System.exit(0); // just to make sure everything we started stops 
  } 
} 

The Applet class supplies several methods in addition to the method paint. They are: init, start, paint, stop, destroy.

Here's a brief description of each:
Method Description
init called once, when the browser or appletviewer loads the applet
start called every time the user enters the web page containing the applet
paint called every time the surface of the applet needs to be repainted
stop called every time the user exits the web page containing the applet
destroy called once, when the browser or appletviewer exits and unloads the applet

Can we see an example before we go to far? Sure, here's an applet that implements all these methods.
import java.applet.*; 
import java.awt.*;

public class Two extends Applet {
    public void init() {
	System.out.println("...    init has been called."); 
    } 
    public void paint(Graphics g) {
	System.out.println("...   paint has been called."); 
    } 
    public void start() {
	System.out.println("...   start has been called."); 
    }
    public void stop() {
	System.out.println("...    stop has been called."); 
    }
    public void destroy() {
	System.out.println("... destroy has been called."); 
    } 
}

Each one does not do more than reporting it's been called. Play with the browser, or the appletviewer, to see under what circumstances each of these methods gets called.

Remember, though, that to see the applet you also need an HTML file with an applet tag inside. Here's a minimal one that you can use:
<html>
<head>
This is an applet 
</head>
<body>
<applet code=Two.class width=400 height=400> 
</applet> 
</body>
</html>

Where do we ask for input in an applet? If we do it only once we can do it in init.

For illustration purposes, and if we want to do it more than once we can place it in start. Obtaining input through a sequence of modal input dialogs is not considered a good user interface design, but it's easy to program.

We can use this until we learn all about event handling. yes. Let's see an example.

Let's write a program that prompts the user for the red, green, and blue values, and then fills a rectangle with the color that the user specified. We remember that Java uses the RGB color model.

That means that you specify a color by the amount of the primary colors - red, green, and blue - that make up the color. The amounts are given as float values and vary from 0.0F (primary color not present) to 1.0F (maximum amount present).

Use this applet to dream up colors: You can re-use the HTML file if you want.
import java.applet.*; 
import java.awt.*;
import javax.swing.*; 

public class Two extends Applet {
    public void init() {

    } 
    public void paint(Graphics g) {

	Graphics2D g2d = (Graphics2D)g; 
	g2d.setColor(fillColor); 
	Rectangle square = new Rectangle(0, 0, 200, 200); 
	g2d.fill(square); 

    } 
    public void start() {

	String input = JOptionPane.showInputDialog("Enter amount of red:"); 
	float    red = Float.parseFloat(input); 

               input = JOptionPane.showInputDialog("Enter amount of green:"); 
	float  green = Float.parseFloat(input); 

               input = JOptionPane.showInputDialog("Enter amount of blue:"); 
	float   blue = Float.parseFloat(input); 

        fillColor = new Color(red, green, blue); 

    }

    Color fillColor; 
}

This is easy, but isn't it againts our principles to use straight numbers in a program (such as the ones used for the location and size of the square)? Yes, but this is only an illustration.

Let's look at another example, that compares visual and numerical information. Let's compute the intersection point(s) between a circle and a vertical line.

Then let's represent the intersection point(s) along with the circle and the line and see if they all match. What's the equation of a circle with center in a point (a ,b) and of radius r?

(x - a)2 + (y - b)2 = r2 Our user will specify a, b, r.

What's the equation of a vertical line? For a vertical line x is constant.

The user will specify the x of the vertical line that intersects the circle. The user promises to do so.

If the user specifies x and the vertical line intersects the circle then the point(s) where the line intersects the circle... ... will satisfy the equation of the circle.

(x - a)2 + (y - b)2 = r2 ... in which we know a, b, r and x.

So we solve for y.

Which can also be written as:

In Java, this becomes:
double root = Math.sqrt(r * r - (x - a) * (x - a)); 
double y1 = b + root;
double y2 = b - root; 

Here's the program.
Feel free to reuse the HTML file.
import java.applet.*; 
import java.awt.*;
import javax.swing.*; 
import java.awt.geom.*; 

public class Two extends Applet {

    public void paint(Graphics g) {

	Graphics2D g2d = (Graphics2D)g; 

	Ellipse2D.Double circle = 
	    new Ellipse2D.Double(a - r, b - r, 2 * r, 2 * r);

	g2d.draw(circle); 

	Line2D.Double line = new Line2D.Double(x, 0,  x, b + 2 * r); 
	g2d.draw(line); 

	double root = Math.sqrt(r * r - (x - a) * (x - a)); 
	double y1 = b + root; 
	double y2 = b - root; 

	Ellipse2D.Double small1 = // diameter is 5 pixels 
	    new Ellipse2D.Double(x - 2.5, y1 - 2.5, 5, 5);

	Ellipse2D.Double small2 = // same, only different location 
	    new Ellipse2D.Double(x - 2.5, y2 - 2.5, 5, 5);

	g2d.fill(small1); 
	g2d.fill(small2); 

    } 

    public void start() {

	String input = JOptionPane.showInputDialog("Please enter a:"); 
                   a = Integer.parseInt(input); 

               input = JOptionPane.showInputDialog("Please enter b:"); 
	           b = Integer.parseInt(input); 

               input = JOptionPane.showInputDialog("Please enter r:"); 
                   r = Integer.parseInt(input); 

               input = JOptionPane.showInputDialog("Please enter x:"); 
                   x = Integer.parseInt(input); 

    }

    int a; // user specified x coordinate of the center of circle 
    int b; // user specified y coordinate of center of circle 
    int r; // user specified radius of circle 
    int x; // user specified x coordinate of vertical line 

}

The part I like is using instance variables to communicate between start (that does user input) and paint (that displays everything). The part I don't like is the analytic geometry and algebra that seems to be everywhere in this class.


Last updated: July 2, 2000 by Adrian German for A201