The following code defines a view class that supports the schematic display given above:
class ClickCounterView { // ** fields ** private JButton incButton; private JButton resetButton; private JButton decButton; private JLabel valueDisplay; // ** constructors ** public ClickCounterView(ClickCounterControl itsApplet) { JPanel controlPanel = new JPanel(); itsApplet.getContentPane().setLayout(new BorderLayout()); valueDisplay = new JLabel("000", JLabel.CENTER); itsApplet.getContentPane().add(valueDisplay, "Center"); incButton = new JButton("+"); resetButton = new JButton("0"); decButton = new JButton("-"); controlPanel.add(incButton); controlPanel.add(resetButton); controlPanel.add(decButton); itsApplet.getContentPane().add(controlPanel, "South"); } // ** methods ** public void setValueDisplay(String setTo) { valueDisplay.setText(setTo); } public void addIncListener(ActionListener a) { incButton.addActionListener(a); } public void addDecListener(ActionListener a) { decButton.addActionListener(a); } public void addResetListener(ActionListener a) { resetButton.addActionListener(a); } public void setMinimumState() { incButton.setEnabled(true); resetButton.setEnabled(false); decButton.setEnabled(false); } public void setCountingState() { incButton.setEnabled(true); resetButton.setEnabled(true); decButton.setEnabled(true); } public void setMaximumState() { incButton.setEnabled(false); resetButton.setEnabled(true); decButton.setEnabled(true); } }
The structure of this program is extremely simple. Most of the length is due to Java's wordy syntax and long variable names. What does it do?
The Java AWT/Swing library includes the a large number of classes defining graphical components than can be displayed on the screen. These component classes are all descendants of the AWT abstract class Component (surprise!). The ClickCounterView mentions three of these component classes, namely JPanel, JButton, and JLabel which are all subclasses of the Swing abstract class JComponent. A JPanel object is simply a rectangular region that can be incorporated in a graphical container (such as the JFrame class in the Swing library) which is subsequently displayed on the screen. A panel typically contains other graphical elements (e.g. drawing canvases, text, pictures) which are displayed as part of the panel. (A blank panel is not very interesting!) A JButton is a graphical button and a JLabel is a single line of text that can be used as a graphical component.
In AWT/Swing Library, graphical components that can contain other graphical components are called containers and belong to type Container. Within a container, the layout of the graphical components inside it is determined by a layout manager, a Java object of type LayoutManager. One of the important tasks in programming a user interface is determining which layout manager and combination of parameter values to use. A good layout policy will produce an attractive logical layout for a variety of different frame shapes and sizes.
The layout manager BorderLayout used in ClickCounterView uses compass points to constrain the relative position of graphical components. The four compass points, "North", "East","South", and "West" plus the "Center" are supported by the layout manager as directives when graphical components are installed within the panel that it manages.
In the program text above, the ClickCounterView object constructor creates panels within the frame provided by JApplet object that is passed to it. An applet is a ``top level'' container; the browser that is executing the applet provides it with a blank area of the screen in which it can paint its various graphical elements. The constructor for ClickCounterView creates a JLabel displayValue text line to hold the current click count and a JPanel controlPanel containing three buttons, incButton, resetButton, and decButton with adorning String labels +, 0, and -, respectively. The displayValue is placed in the center of the Applet and the three buttons are placed in the controlPanel using the default layout manager FlowLayout. This layout manager places graphical components in rows from left-to-right just like a text editor places characters when you type text into a buffer.
The ClickCounterView class defines seven public methods to access and update its components: