Interface Design Using Java (Exercise 4)

Human Computer Interface Design Using Java

Exercises 5: Starting on Your Own

A. Introduction

Up to this point, you have been editing applets that I have already implemented. This exercise introduces an applet that you should try to implement yourself before you look at the code that I developed.

B. The Traffic Light Scenario

The following applet is intended to mimic a traffic light with red, amber and green lamps. Unlike a traffic light, there are specific buttons to change the colour of each bulb.

The design begins with a control panel. Three buttons are declared and are added to that panel, in exactly the same way that exercise 3 used left, right, up and down buttons. Then there is a canvas that is added to the applet; the three lights will be drawn onto this canvas in the same way that the maze was drawn onto a canvas in exercise 3.

B. Your Tasks

Task 1: Build your own version of the Traffic_Light applet

Have a go at trying to implement the traffic light applet, without looking at my version. A good approach would be to borrow parts of exercise3. For example, MazeExample.java declares the control panel and a canvas for drawing into. MazeCanvas.java will have to be radically pruned and simplified so that it just draws lights rather than all of the walls in the maze.

Hint: the following draws a filled circle into the graphic component g:

	g.fillOval(X, Y, width, height); // set width and height both to 50?

Similarly, the following draws an empty circle (ie a line) into g:

	g.drawOval(X, Y, width, height);

Task 2: Compare it with my Traffic_Light applet

My version of the program is based around three classes:

A_Light.java
This class draws a single light onto an existing canvas.
Traffic_Lights.java
This class implements the canvas that the three lights are drawn onto.
Lights.java
This class implements the buttons and their associated event handler. It also declares an instance of type Traffic_Lights.

C. Summary

This exercise has formed a bridge between the previous examples, in which you simply edited an existing applet, to the more open design tasks that characterise the real-world practice of interface development. It can be extremely hard to get an applet working in the early stages - please do not be dispirited if it does not work first, second or even tenth time. Read the notes on debugging and good luck!

Back to the main index...