3.1.1 Model-View-controller Pattern

A well-organized graphical application has three components:

• a model consisting of the application with no external interface;
• a view consisting of one or more graphical frames that interact with the user and the application; and
• a controller consisting of the ``main'' program that constructs the model and the view and links them together.

A model is a ``raw'' program module with a programming interface consisting a collection of publicly visible methods or procedures. In Java, the application is typically a single object (containing references to many other objects) and the programming interface is the collection of methods supported by that object.

When a program with a graphical interface starts, the controller

1. creates the model (application),
2. creates the view consisting of one or more graphical frames and attaches commands to the graphical input controls (buttons, text boxes, etc.) of the view,
3. activates the graphical components in the view, and
4. terminates.

Of course, program execution continues after the controller terminates because the extra thread of execution that processes program events is still running. After the controller terminates, all program execution is triggered by user input actions.

The commands attached to the graphical input controls are operations on the model implemented using the model's programming interface. Recall the command pattern from Section 1.8. In Java, each of the graphical input controls in the graphics (AWT/Swing) library has an associated command interface that the installed commands implement. In the Java graphics library, these commands are called ``listeners'' because the are dormant until a graphical input event occurs (e.g., a button is ``pressed''). In the programming literature, these commands are often called ``callbacks'' because they call methods ``back'' in the model which is logically disjoint from the code running in the view.

To explain how to write programs using the model-view-controller pattern, we will explore a simple example, namely a click-counter application that maintains and displays a simple integer counter ranging from 0 to 999. The graphical display will show the current value of the counter and include three buttons: an increment button, a decrement button, and reset button.

We will start with the problem of writing the view components of the application.