ISU570 Fall 2004 Simple text/draw demo by Professor Futrelle

Created September 2004

This little writeup is not intended to be a model for your writeups. It is being constructed quickly to make this example available to you. Your writeups should focus more on overall system design, the user experience and less on the implementation.

General Goals and Motivation: It is often the case that we want to separate the controlling part of the interface from the part that displays the responses to the control actions. This can be done be creating two windows, one with controls and the other with the controlled material. The example below also serves to demonstrate that both textual and graphical elements can be controlled, in this case by simple button presses. This is a modular design, with two modules of quite distinct functionality.

The implementation also demonstrates modularity by dividing the project into a main program that sets up the two windows, another class file for the control elements, and a third class file for the controlled ("display") window. Here are the three source files (with .text extensions to guarantee that your browser will display them as text). You may then cut and paste them into three corresponding files and rename the extensions to .java.

Operation of the system: As currently configured, clicking the "Text" button causes "boo" to appear in the editable text field in the other window. Clicking the "Draw" button causes a line to be drawn in the white panel. Clicking the "Draw" button also disables the "Text" button, dimming it.

TwoWindowsSystem.java: Two windows has the main() program, making it the executable file. After compiling,
java TwoWindowsSystem
on the command line will run the system.
The main() instantiates the two classes, DisplayWindow and ControlWindow and their constructors create the frames and panels. In addition, the control window is given a reference to the display window so it can alter it as needed, as well as setting up the action for drawing in the panel.
ControlWindow.java: The control window handles the events generated by the two buttons in two different ways. The drawing button has an ActionListener added to it which turns on a flag and does a repaint() of the draw panel within the display window. This prevents the painting from being done the moment the panel is first displayed. The event generated by the Text button is handled by a subclass of AbstractAction. The advantage of this other approach is that this action can be added to more than one event generator, e.g., to both a menu item and a button. In addition, an AbstractAction can be disabled programmatically. When this is done, it propagates an event back to the button (in this case) causing it to be dimmed. Again, if two components were generating this action, both would be dimmed when the action was disabled. The disabling of the action associated with the text button is done whenever the draw button is pressed. So in this example, drawing disables text generation -- the order in which the two buttons are pressed matters.
DisplayWindow.java: The display window is a simpler class, devoted to assembling the text field and drawing panel together in one window. The one interesting part of this is the DrawPanel which, being a JPanel, contains a paintComponent() method which draws the line. It does this by testing a flag before possibly drawing with drawLine().

The figures below show the initial state of the system and the final state after the two buttons are pressed, the text button first. The text button is dimmed in this final state.