What is a graphical tool that shows the steps of program execution?

So far, we have covered the basic programming constructs (such as variables, data types, decision, loop, array and method) and introduced the important concept of Object-Oriented Programming (OOP). As discussed, OOP permits higher level of abstraction than traditional Procedural-Oriented Languages (such as C). You can create high-level abstract data types called classes to mimic real-life things. These classes are self-contained and are reusable.

Nội dung chính Show

Programming GUI with AWT
AWT Event-Handling
Nested (Inner) Classes
Event Listener's Adapter Classes
[SKIP] The Legacy "this" Listener
Layout Managers and Panel
Using Visual GUI Builder - NetBeans/Eclipse
What is a graphical method to show program flow and execution?
What are the 3 types of flowchart?
What is a flowchart used for?
Which of the following types of diagrams graphically represent the steps in a process?

In this article, I shall show you how you can reuse the graphics classes provided in JDK for constructing your own Graphical User Interface (GUI) applications. Writing your own graphics classes (and re-inventing the wheels) is mission impossible! These graphics classes, developed by expert programmers, are highly complex and involve many advanced design patterns. However, re-using them are not so difficult, if you follow the API documentation, samples and templates provided.

I shall assume that you have a good grasp of OOP, including composition, inheritance, polymorphism, abstract class and interface; otherwise, read the earlier articles. I will describe another important OO concept called nested class (or inner class) in this article.

There are current three sets of Java APIs for graphics programming: AWT (Abstract Windowing Toolkit), Swing and JavaFX.

AWT API was introduced in JDK 1.0. Most of the AWT UI components have become obsolete and should be replaced by newer Swing UI components.
Swing API, a much more comprehensive set of graphics libraries that enhances the AWT, was introduced as part of Java Foundation Classes (JFC) after the release of JDK 1.1. JFC consists of Swing, Java2D, Accessibility, Internationalization, and Pluggable Look-and-Feel Support APIs. JFC has been integrated into core Java since JDK 1.2.
The latest JavaFX, which was integrated into JDK 8, was meant to replace Swing. JavaFX was moved out from the JDK in JDK 11, but still available as a separate module.

Other than AWT/Swing/JavaFX graphics APIs provided in JDK, other organizations/vendors have also provided graphics APIs that work with Java, such as Eclipse's Standard Widget Toolkit (SWT) (used in Eclipse), Google Web Toolkit (GWT) (used in Android), 3D Graphics API such as Java bindings for OpenGL (JOGL), Java3D, and etc. Furthermore, developers have moved to use technologies such as HTML5 as the basis of webapps.

You need to refer to the "JDK API documentation" for the AWT/Swing APIs (under module

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

9) while reading this chapter. The best online reference for Graphics programming is the "Swing Tutorial" @ http://docs.oracle.com/javase/tutorial/uiswing/. For advanced 2D graphics programming, read "Java 2D Tutorial" @ http://docs.oracle.com/javase/tutorial/2d/index.html. For 3D graphics, read my 3D articles.

Programming GUI with AWT

I shall start with the AWT before moving into Swing to give you a complete picture of Java Graphics.

AWT Packages

AWT is huge! It consists of 12 packages of 370 classes (Swing is even bigger, with 18 packages of 737 classes as of JDK 8). Fortunately, only 2 packages -

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

0 and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

1 - are commonly-used.

The

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

0 package contains the core AWT graphics classes:

GUI Component classes, such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4, and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

GUI Container classes, such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

Layout managers, such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

9 and

Custom graphics classes, such as

2 and

The

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

1 package supports event handling:

Event classes, such as

7 and

Event Listener Interfaces, such as

2 and

Event Listener Adapter classes, such as

5, and

AWT provides a platform-independent and device-independent interface to develop graphic programs that runs on all platforms, including Windows, macOS, and Unixes.

AWT Containers and Components

What is a graphical tool that shows the steps of program execution?

There are two groups of GUI elements:

Component (Widget, Control): Components are elementary GUI entities, such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5, and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4. They are also called widgets, controls in other graphics systems.

Container: Containers, such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7, are used to hold components in a specific layout (such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

8 or

0). A container can also hold sub-containers.

In the above figure, there are three containers: a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 and two

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7s. A

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 is the top-level container of an AWT program. A

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 has a title bar (containing an icon, a title, and the minimize/maximize/close buttons), an optional menu bar and the content display area. A

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7 is a rectangular area used to group related GUI components in a certain layout. In the above figure, the top-level

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 contains two

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7s. There are five components: a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 (providing description), a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 (for users to enter text), and three

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3s (for user to trigger certain programmed actions).

In a GUI program, a component must be kept (or added) in a container. You need to identify a container to hold the components. Every container has a method called

4. A

5 (say

6) can invoke

7 to add

8 into itself. For example,

GUI components are also called controls (e.g., Microsoft ActiveX Control), widgets (e.g., Eclipse's Standard Widget Toolkit, Google Web Toolkit), which allow users to interact with (or control) the application.

AWT Container Classes

Top-Level Containers: Frame, Dialog and Applet

Each GUI program has a top-level container. The commonly-used top-level containers in AWT are

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

0 and

A
```
BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);
```
6 provides the "main window" for your GUI application. It has a title bar (containing an icon, a title, the minimize, maximize/restore-down and close buttons), an optional menu bar, and the content display area. To write a GUI program, we typically start with a subclass extending from
```
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
```
3 to inherit the main window as follows:

An AWT

0 is a "pop-up window" used for interacting with the users. A

0 has a title-bar (containing an icon, a title and a close button) and a content display area, as illustrated.

An AWT

1 (in package

7) is the top-level container for an applet, which is a Java program running inside a browser. Applet is no longer supported in most of the browsers.

Secondary Containers: Panel and ScrollPane

Secondary containers are placed inside a top-level container or another secondary container. AWT provides these secondary containers:

```
BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);
```
7: a rectangular box used to layout a set of related GUI components in pattern such as grid or flow.

9: provides automatic horizontal and/or vertical scrolling for a single child component.

others.

Hierarchy of the AWT Container Classes

The hierarchy of the AWT

btnCount.addActionListener(new BtnCountListener());

0 classes is as follows:

As illustrated, a

btnCount.addActionListener(new BtnCountListener());

0 has a

btnCount.addActionListener(new BtnCountListener());

2 to layout the components in a certain pattern, e.g., flow, grid.

AWT Component Classes

AWT provides many ready-made and reusable GUI components in package

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

0. The frequently-used are:

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

btnCount.addActionListener(new BtnCountListener());

btnCount.addActionListener(new BtnCountListener());

8 (radio buttons),

btnCount.addActionListener(new BtnCountListener());

9, and

00, as illustrated below.

AWT GUI Component: java.awt.Label

01 provides a descriptive text string. Take note that

02 prints to the system console, NOT to the graphics screen. You could use a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 to label another component (such as text field) to provide a text description.

Check the JDK API specification for

01.

Constructors

The

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 class has three constructors:

The first constructor constructs a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 object with the given text string in the given alignment. Note that three

07 constants

08,

09, and

10 are defined in the class for you to specify the alignment (rather than asking you to memorize arbitrary integer values).

The second constructor constructs a
```
BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);
```
5 object with the given text string in default of left-aligned.

The third constructor constructs a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 object with an initially empty string. You could set the label text via the

13 method later.

Constants (

14 fields)

These three constants are defined for specifying the alignment of the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5's text, as used in the above constructor.

Public Methods

The

16 and

13 methods can be used to read and modify the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5's text. Similarly, the

19 and

20 methods can be used to retrieve and modify the alignment of the text.

Constructing a Component and Adding the Component into a Container

Three steps are necessary to create and place a GUI component:

Declare the component with an identifier (name);

Construct the component by invoking an appropriate constructor via the

21 operator;

Identify the container (such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 or

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7) designed to hold this component. The container can then add this component onto itself via

24 method. Every container has a

25 method. Take note that it is the container that actively and explicitly adds a component onto itself, NOT the other way.

Example

An Anonymous Label Instance

You can create a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 without specifying an identifier, called anonymous instance. In the case, the Java compiler will assign an anonymous identifier for the allocated object. You will not be able to reference an anonymous instance in your program after it is created. This is usually alright for a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 instance as there is often no need to reference a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 after it is constructed.

Example

AWT GUI Component: java.awt.Button

29 is a GUI component that triggers a certain programmed action upon clicking.

Constructors

The

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3 class has two constructors. The first constructor creates a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3 object with the given label painted over the button. The second constructor creates a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3 object with no label.

Public Methods

The

33 and

34 methods can be used to read the current label and modify the label of a button, respectively.

Note: The latest Swing's

35 replaces

36 with

37 to be consistent with all the components. We will describe Swing later.

Event

Clicking a button fires a so-called

5 and triggers a certain programmed action. I will explain event-handling later.

Example

AWT GUI Component: java.awt.TextField

39 is single-line text box for users to enter texts. (There is a multiple-line text box called

40.) Hitting the "ENTER" key on a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 object fires an

Constructors

Public Methods

Event

Hitting the "ENTER" key on a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 fires a

5, and triggers a certain programmed action.

Example

Take note that

45 operates on

46. You can convert a

46 to a primitive, such as

48 or

49 via

07method

51 or

52. To convert a primitive to a

46, simply concatenate the primitive with an empty

46.

Example 1: AWTCounter

Let's assemble a few components together into a simple GUI counter program, as illustrated. It has a top-level container

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6, which contains three components - a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 "Counter", a non-editable

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 to display the current count, and a "Count"

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3. The

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 shall display count of

60 initially.

Each time you click the button, the counter's value increases by 1.

To exit this program, you have to close the CMD-shell (or press "control-c" on the CMD console); or push the "red" close button in Eclipse's Application Console. This is because we have yet to write the handler for the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6's close button. We shall do that in the later example.

Dissecting the AWTCounter.java

The

62 statements (Lines 1-2) are needed, as AWT container and component classes, such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4, and

66 are kept in the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

0 package; while AWT events and event-listener interfaces, such as

5 and

9 are kept in the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

1 package.

A GUI program needs a top-level container, and is often written as a subclass of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 (Line 5). In other words, this class

72 is a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6, and inherits all the attributes and behaviors of a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6, such as the title bar and content pane.

Lines 11 to 47 define a constructor, which is used to setup the GUI components and event handlers.

In Line 13, the

75 (inherited from the superclass

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6) is used to set the layout of the container.

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

8 is used which arranges the components in left-to-right and flows into next row in a top-to-bottom manner.

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 (non-editable), and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3 are constructed. We invoke the

81 method (inherited from the superclass

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6) to add these components into container.

In Line 34-35, we invoke the

83 and the

84 (inherited from the superclass

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6) to set the initial size and the title of the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6. The

87 method (Line 42) is then invoked to show the display.

Line 27-28 is used to setup the callback event-handler, which will be discussed in length later. In brief, whenever the button is clicked, the

88 will be called. In the

88 (Lines 59-64), the counter value increases by 1 and displayed on the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

In the entry

91 method (Lines 50-54), an instance of

72 is constructed. The constructor is executed to initialize the GUI components and setup the event-handlers. The GUI program then waits for the user action.

Inspecting Container/Components via toString()

It is interesting to inspect the GUI objects via the

93, to gain an insight to these classes. (Alternatively, use a graphic debugger in Eclipse/NetBeans or study the JDK source code.) For example, if we insert the following code before and after the

94:

Example 2: AWTAccumulator

In this example, the top-level container is again the typical

3. It contains 4 components: a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 "Enter an Integer", a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 for accepting user input, another

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5 "The Accumulated Sum is", and another non-editable

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 for displaying the sum. The components are arranged in

0 of 2 rows 2 columns.

The program shall accumulate the number entered into the input

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 and display the sum in the output

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

Dissecting the AWTAccumulator.java

An AWT GUI program extends from

3 (Line 6) - the top-level window container.

In the constructor (Line 14), we constructs 4 components - 2 anonymous

01s and 2

39s. The

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 adds the components, in

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

08 (

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4) is the source object, which fires an

5 upon hitting the Enter key.

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

08 adds an anonymous instance of

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

12 as an

5 handler (Line 23). The listener class needs to implement

9 interface and provides implementation to method

88. Whenever an user hits Enter on the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

08 (

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4), the

88 will be called back.

AWT Event-Handling

Java adopts the so-called "Event-Driven" (or "Event-Delegation") programming model for event-handling, similar to most of the visual programming languages like Visual Basic.

In event-driven programming, a piece of event-handling codes is executed (or called back by the graphics subsystem) when an event was fired in response to an user input (such as clicking a mouse button or hitting the ENTER key in a text field).

Callback Methods

In the above examples, the method

88 is known as a callback method. In other words, you never invoke

88 in your codes explicitly. The

88 is called back by the graphics subsystem under certain circumstances in response to certain user actions.

JavaScript can attach a Callback method to an Event Directly

In some languages, you can directly attach a method (or function) to an event (such as mouse-click). For example, the following JavaScript code (called

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

22) implement a counter similar to the

72, with a text label, text field and button:

In Java, we CANNOT attach a method to a source object directly, as method is not a first-class object in Java. For example, a Java method cannot accept methods as its arguments and it cannot return a method; you cannot assign a method to a variable, etc. (JavaScript and C language CAN!).

Source, Event and Listener Objects

The AWT's event-handling classes are kept in package

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

Three kinds of objects are involved in the event-handling: a source, listener(s) and an event object.

The source object (such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3 and

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

26) interacts with the user. Upon triggered, the source object creates an event object to capture the action (e.g., mouse-click x and y, texts entered, etc). This event object will be messaged to all the registered listener object(s), and an appropriate event-handler method of the listener(s) is called-back to provide the response. In other words, triggering a source fires an event to all its listener(s), and invoke an appropriate event handler of the listener(s).

To express interest for a certain source's event, the listener(s) must be registered with the source. In other words, the listener(s) "subscribes" to a source's event, and the source "publishes" the event to all its subscribers upon activation. This is known as subscribe-publish or observable-observer design pattern.

The sequence of steps is illustrated above:

The source object registers its listener(s) for a certain type of event.

A source fires an event when triggered. For example, clicking a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3 fires an

5, clicking a mouse button fires

6, typing a key fires

7, and etc.

How the source and listener understand each other? The answer is via an agreed-upon interface. For example, if a source is capable of firing an event called

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

31 (e.g.,

5). Firstly, we need to declare an interface called

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

33 (e.g.,

9) containing the names of the handler methods (recall that an

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

35 contains only

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36 methods without implementation). For example, the

9 interface is declared as follows:

Secondly, all

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

31 listeners must implement the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

33 interface. That is, the listeners must provide their own implementations (i.e., programmed responses) to all the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36 methods declared in the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

33 interface. In this way, the listener(s) can response to these events appropriately. For example,

Thirdly, in the source, we need to maintain a list of

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

31 listener object(s), and define two methods:

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

43 and

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

44 to add and remove a

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

31 listener from this list. For the

5, the signature of the methods are:

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

Take note that the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

47 takes a

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

33 object as its sole parameter. In other words, it can only add objects of the type

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

33, and its sub-type. Since

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

33 is an

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

35, you cannot create instance of

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

33, but need to create instance of a subclass implementing the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

35.

In summary, we identify the source, the event-listener interface, and the listener object. The listener must implement the event-listener interface. The source object then registers listener object via the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

55 method.

The source is triggered by a user.

The source create a

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

31 object, which encapsulates the necessary information about the activation. For example, the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

57 position of the mouse pointer, the text entered, etc.

Finally, for each of the
```
public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);
```
31 listeners in the listener list, the source invokes the appropriate handler on the listener(s), which provides the programmed response.

In summary, triggering a source fires an event to all its registered listeners, and invoke an appropriate handler of the listener.

Revisit Example 1 AWTCounter: ActionEvent and ActionListener Interface

Clicking a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3 (or hitting the "Enter" key on a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4) fires an

5 to all its

5 listener(s). An

5 listener must implement the

9 interface, which declares one

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36 method called

88 as follow:

Here are the event-handling steps:

We identify

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

67 (of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3) as the source object.

Clicking

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3 fires an

5 to all its

5 listener(s).

The listener(s) is required to implement

9 interface, and override the

88 method to provide the response. In Line 56-65, we write an inner class called

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74, which override the

88 to increment and display the count. An inner class is a class defined inside an outer class, and it can access the private entities of the outer class. We will elaborate on the inner class in the next section.

The source object registers listener via the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

76. In this example, the source

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

67 (

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3) adds an instance of

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74 as a listener via:

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

Note that

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

76 takes an argument of the type

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74, which implements

9 interface (i.e., a subclass of

9), is upcasted and passed to the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

76 method.

Upon button-click, the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

67 creates an

5 object, and calls back the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

88 method of all its registered listener(s) with the

5 object created:

The sequence diagram is as follows:

Revisit Example 2 AWTAccumulator: ActionEvent and ActionListener Interface

In this example,

We identify the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

08 (of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4) as the source object.

Hitting the "Enter" key on a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 fires an

5 to all its

5 listener(s).

In Line 46-59, we define an inner class called

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

12 as the

5 listener.The

5 listener is required to implement the

9 interface, and override the

88 method to provide the programmed response upon activation.

The source object

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

08 (of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4) registers an anonymous instance of

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

12 as its

5 listener via the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

04 (Line 23).

Example 3: WindowEvent and WindowListener Interface

8 is fired (to all its

8 listeners) when a window (e.g.,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6) has been opened/closed, activated/deactivated, iconified/deiconified via the 3 buttons at the top-right corner or other means. The source of

8 shall be a top-level window-container such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

8 listener must implement

3 interface, which declares 7

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36 event-handling methods, as follows. Among them, the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

13, which is called back upon clicking the window-close button, is the most commonly-used.

The following program added support for "close-window button" to "Example 1: AWTCounter".

In this example, we shall modify the earlier

72 example to handle the

8. Recall that pushing the "close-window" button on the

72 has no effect, as it did not handle the

8 of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

13. We included the

8 handling codes in this example.

We identify the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 as the source object.

The

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 fires the

8 to all its registered

8 listener(s).

In Line 53-69, we define an inner class called

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

25 as the

8 listener. It is required to implement the

3 interface, which declares 7 abstract methods:

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

28,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

29,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

13,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

31,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

32,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

33 and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

34.

We register an anonymous instance of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

25 as the

8 listener to the source

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 via method

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

38.

We override the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

13 handler to terminate the program using

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

40. We ignore the other 6 handlers, but required to provide an empty body for compilation.

The sequence diagram is as follow:

Example 4: MouseEvent and MouseListener Interface

6 is fired when you press, release, or click (press followed by release) a mouse-button (left or right button) at the source object; or position the mouse-pointer at (enter) and away (exit) from the source object.

6 listener must implement the

0 interface, which declares the following five

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36 methods:

In this example, we setup a GUI with 4 components (two anonynous

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

5s and two non-editable

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4s) inside a top-level container

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6, arranged in

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

To demonstrate the

We identity

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 as the source object.

The

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 fires a

6 to all its

6 listener(s) when you click/press/release a mouse-button or enter/exit with the mouse-pointer.

In Line 42-56, we define an inner class called

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

55 as the

6 listener. It is required to implement the

0 interface, which declares 5 abstract methods:

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

58,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

59,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

60,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

61, and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

62. We override the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

58 to display the (x, y) coordinates of the mouse click on the two displayed

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4s. We ignore all the other handlers (for simplicity - but you need to provide an empty body for compilation).

We register an anonymous instance of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

55 as the

6 listener to

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 (source) via the method

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

69.

Try: Include a

3 to handle the close-window button.

Example 5: MouseEvent and MouseMotionListener Interface

6 is also fired when you move and drag the mouse pointer at the source object. But you need to use

1 to handle the mouse-move and mouse-drag. The

1 interface declares the following two abstract methods:

In this example, we shall illustrate both the

0 and

We identify the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 as the source, which fires the

6 to its registered

0 and

In Line 53-80, we define an inner class called

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

55 as both the

0 and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

83.

We register an instance of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

55 as thelistener to

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 via method

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

87 and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

88.

The

1 needs to implement 2 abstract methods:

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

90 and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

91 declared in the

1 interface.

We override the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

90 to display the (x, y) position of the mouse pointer. We ignore the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

94 handler by providing an empty body for compilation.

Try: Include a

3 to handle the close-window button.

Example 6: KeyEvent and KeyListener Interface

7 is fired when you pressed, released, and typed (pressed followed by released) a key on the source object. A

7 listener must implement

2 interface, which declares three abstract methods:

In this example:

We identify the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

08 (of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4) as the source object.

The source fires a

7 when you press/release/type a key to all its

7 listener(s).

In Line 35-46, we define an inner class called

03 as the

7 listener.

We register an anonymous instance of

03 as the

7 listener to the source

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4 via method

08.

The

7 listener needs to implement the

2 interface, which declares 3 abstract methods:

11,

12,

13.

We override the

11 to display key typed on the display

40. We ignore the

12 and

13.

Nested (Inner) Classes

Without Inner classes

In our

72 example, suppose we would like to write an external ordinary class (say

19) as our

5 listener. This class shall implement

9 interface and override the

88 method. An example is as follows:

Can you see the problem? This external class cannot access the variables such as

23 and

24 in the

25 class. We can fix this problem, but the solution is messy. An easy solution is to use an inner class instead of an ordinary external class (to be explained in the following sections).

What are Inner classes?

A nested class (or commonly called inner class) is a class defined inside another class - introduced in JDK 1.1. As an illustration, two nested classes

26 and

27 are defined inside the definition of an outer class called

28.

A nested class has these properties:

A nested class is a proper class. That is, it could contain constructors, member variables and member methods. You can create an instance of a nested class via the
```
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
```
21 operator and constructor.
A nested class is a member of the outer class, just like any member variables and methods defined inside a class.

Most importantly, a nested class can access the

30 members (variables/methods) of the enclosing outer class, as it is at the same level as these

30 members. This is the property that makes inner class useful.

A nested class can have

30,

33,

34, or the default access, just like any member variables and methods defined inside a class. A

30 inner class is only accessible by the enclosing outer class, and is not accessible by any other classes. [An top-level outer class cannot be declared

30, as no one can use a

30 outer class.]

A nested class can also be declared

07,

39 or

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36, just like any ordinary class.

A nested class is NOT a subclass of the outer class. That is, the nested class does not inherit the variables and methods of the outer class. It is an ordinary self-contained class. [Nonetheless, you could declare it as a subclass of the outer class, via keyword "
```
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
```
41", in the nested class's definition.]

The usages of nested class are:

To control visibilities (of the member variables and methods) between inner/outer class. The nested class, being defined inside an outer class, can access

30 members of the outer class.

To place a piece of class definition codes closer to where it is going to be used, to make the program clearer and easier to understand.
For namespace management.

Example 7: A Named Inner Class as Event Listener (Revisit Example 1 AWTCounter)

A nested class is useful if you need a small class which relies on the enclosing outer class for its private variables and methods. It is ideal in an event-driven environment for implementing event handlers. This is because the event handling methods (in a listener) often require access to the private variables (e.g., a private

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

4) of the outer class.

In this example (revisit Example 1

72), we define an inner class called

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74, and create an instance of

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74 as the

5 listener for the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

67. The

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74 needs to implement the

9 interface, and override the

88 handler.

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74 needs to be defined as an inner class, as it needs to access private variables (

23 and

24) of the outer class.

Dissecting the Program

An inner class named

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74 is used as the

56.

An anonymous instance of the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74 inner class is constructed. The

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

67 source object adds this instance as a listener, as follows:

btnCount.addActionListener(new BtnCountListener());

The inner class can access the

30 variable

24 and

23 of the outer class.

The inner class is compiled into

62, in the format of

63.

(Advanced) Using an Ordinary (Outer) Class as Listener

Try moving the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74 class outside, and define it as an ordinary class. You would need to pass a reference of the

65 into the constructor of

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

74, and use this reference to access variables

24 and

23, through

33 getters or granting them to

33 access.

This code is messy! Inner class provides a much cleaner solution!

Example 8: An Anonymous Inner Class as Event Listener

Instead of using a named inner class (called

71 in the previous example), we shall use an inner class without a name, known as anonymous inner class as the

9 in this example.

Dissecting the Program

The anonymous inner class is given a name generated by the compiler, and compiled into

73, where

74 is a running number of the inner classes of this outer class.

An anonymous instance of an anonymous inner class is constructed, and passed as the argument of the

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

76 method as follows:

The above codes is equivalent to and compiled as:

From JDK 8, you can write the event handler using "Lambda Expression" in a one-liner as follows:

Properties of Anonymous Inner Class

The anonymous inner class is define inside a method, instead of a member of the outer class (class member). It is local to the method and cannot be marked with access modifier (such as

33,

30) or

07, just like any local variable of a method.

An anonymous inner class must always extend a superclass or implement an interface. The keyword "

79" or "

80" is NOT required in its declaration. An anonymous inner class must implement all the abstract methods in the superclass or in the interface.

An anonymous inner class always uses the default (no-arg) constructor from its superclass to create an instance. If an anonymous inner class implements an interface, it uses the

81.

An anonymous inner class is compiled into a class named

82, where

83 is a running number of inner classes within the outer class.

An instance of an anonymous inner class is constructed via this syntax:
The created instance can be assigned to a variable or used as an argument of a method.

Example 9: An Anonymous Inner Class for Each Source

Let's modify our

72 example to include 3 buttons for counting up, counting down, and reset the count, respectively. We shall attach an anonymous inner class as the listener to each of buttons.

Dissecting the Program

Each of the

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

3s uses one anonymous instance of an anonymous inner class as its

5 listener.

Example 10: Using the Same Listener Instance for All the Buttons

If you use the same instance as the listener for all the 3 buttons, you need to determine which button has fired the event. It is because all the 3 buttons trigger the same event-handler method.

Using ActionEvent's getActionCommand()

In the following example, we use the same instance of a "named" inner class as the listener for all the 3 buttons. The listener needs to determine which button has fired the event. This can be accomplished via the

5's

88 method, which returns the button's label.

Using getSource() of EventObject

Besides the

89, which is only available for

5, you can use the

91 method, which is available to all event objects, to retrieve a reference to the source object that has fired the event.

91 returns a

93. You may need to downcast it to the proper type of the source object. For example,

Event Listener's Adapter Classes

Example 11: WindowAdapter for WindowListener

Using WindowListener Interface

Refer to the

94, a

8 listener is required to implement the

3 interface, which declares 7

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36 methods. Although we are only interested in

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

13, we need to provide an empty body to the other 6

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36 methods in order to compile the program. This is tedious, e.g., we can rewrite the

94 using an inner class implementing

9 as follows:

Using WindowAdapter Superclass

An adapter class called

6 is therefore provided, which implements the

3 interface and provides default implementations to all the 7

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36 methods. You can then derive a subclass from

6 and override only methods of interest and leave the rest to their default implementation. For example,

Clearly, the adapter greatly simplifies the codes.

Other Event-Listener Adapter Classes

Similarly, adapter classes such as

07,

09 are available for

2, and

13, respectively.

There is no

14 for

9, because there is only one

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

36 method (i.e.

88) declared in the

9 interface. This method has to be overridden and there is no need for an adapter.

[SKIP] The Legacy "this" Listener

If you read some old books, you may find many examples that use "

19" object as the event listener.

For example,

There is only ONE class in this code. But this code is much harder to understand and seldom used nowadays. Using inner class is a better solution.

Layout Managers and Panel

A container has a so-called layout manager to arrange its components. The layout managers provide a level of abstraction to map your user interface on all windowing systems, so that the layout can be platform-independent.

AWT provides the following layout managers (in package

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

0):

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

24,

25,

26, and others. Swing added more layout manager in package

27, to be described later.

Container's setLayout() method

A container has a

75 method to set its layout manager:

To set up the layout of a

btnCount.addActionListener(new BtnCountListener());

0 (such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

31,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7, or

33), you have to:

Construct an instance of the chosen layout object, via

21 and constructor, e.g.,

35)

Invoke the

75 method of the

btnCount.addActionListener(new BtnCountListener());

0, with the layout object created as the argument;

Place the GUI components into the

btnCount.addActionListener(new BtnCountListener());

0 using the

81 method in the correct order; or into the correct zones.

For example,

Container's getLayout() method

You can get the current layout via

btnCount.addActionListener(new BtnCountListener());

0's

41 method.

Panel's Initial Layout

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7 (and Swing's

33) provides a constructor to set its initial layout manager. It is because a primary function of

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7 is to layout a group of component in a particular layout.

FlowLayout

In the

45, components are arranged from left-to-right inside the container in the order that they are added (via method

7). When one row is filled, a new row will be started. The actual appearance depends on the width of the display window.

Constructors

Example

GridLayout

47, components are arranged in a grid (matrix) of rows and columns inside the

btnCount.addActionListener(new BtnCountListener());

0. Components are added in a left-to-right, top-to-bottom manner in the order they are added (via method

24).

Constructors

Example

BorderLayout

50, the container is divided into 5 zones:

51,

52,

53,

54, and

55. Components are added using method

56, where

57 is either

58 (or

59),

60 (or

61),

62 (or

63),

64 (or

65), or

66.

You need not place components to all the 5 zones. The

54 and

53 components may be stretched horizontally; the

51 and

52 components may be stretched vertically; the

55 component may stretch both horizontally and vertically to fill any space left over.

Constructors

Example

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

Using Panels as Sub-Container to Organize Components

An AWT

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7 is a rectangular pane, which can be used as sub-container to organized a group of related components in a specific layout (e.g.,

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

9).

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

7s are secondary containers, which shall be added into a top-level container (such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6), or another

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

For example, the following figure shows a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

6 in

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

9 containing two

80 -

81 in

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

8 and

83 in

81 is added to the

54, and

83 is added to the

55.

GridBagLayout

Reference: Read "How to Use GridBagLayout" @ https://docs.oracle.com/javase/tutorial/uiswing/layout/gridbag.html.

Example 1

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

Run the program, the output is in (a), where all components have their natural width and height, placed in center (

89) with extra x and y spaces at the 4 margins. The

90 increases the internal y-padding for button-4 (spans 3 columns). Button 5 (spans second and third columns) has top margin specified by

91, and anchor at the bottom-right corner (

92).

Uncomment the

93 (line 14). The output is in (b), where ALL components fill horizontally with equal column width.

Uncomment all

94 (lines 20, 26, 32). The output is in (c). The extra x spaces are distributed according to the

94 of (0.5, 1.0, 0.5).

Uncomment the

96 (line 49). The output is in (d). The extra y spaces are given to row 3, as row 1 and 2 have

96 of 0 and non-participating in the distribution of extra y-spaces.

BoxLayout

BoxLayout arrange components in a single row or column. It respects components' requests on the minimum sizes.

[TODO] Example and diagram

Swing

Introduction

Swing is part of the so-called "Java Foundation Classes (JFC)" (have you heard of MFC?), which was introduced in 1997 after the release of JDK 1.1. JFC was subsequently included as an integral part of JDK since JDK 1.2. JFC consists of:

Swing API: for advanced graphical programming.
Accessibility API: provides assistive technology for the disabled.
Java 2D API: for high quality 2D graphics and images.
Pluggable look and feel supports.
Drag-and-drop support between Java and native applications.

The goal of Java GUI programming is to allow the programmer to build GUI that looks good on ALL platforms. JDK 1.0's AWT was awkward and non-object-oriented (using many

98). JDK 1.1's AWT introduced event-delegation (event-driven) model, much clearer and object-oriented. JDK 1.1 also introduced inner class and JavaBeans – a component programming model for visual programming environment (similar to Visual Basic).

Swing appeared after JDK 1.1. It was introduced into JDK 1.1 as part of an add-on JFC (Java Foundation Classes). Swing is a rich set of easy-to-use, easy-to-understand JavaBean GUI components that can be dragged and dropped as "GUI builders" in visual programming environment. Swing is now an integral part of Java since JDK 1.2.

Swing's Features

Swing is huge (consists of 18 packages of 737 classes as in JDK 1.8) and has great depth. Compared with AWT, Swing provides a huge and comprehensive collection of reusable GUI components, as shown in the Figure below (extracted form Swing Tutorial).

The main features of Swing are (extracted from the Swing website):

Swing is written in pure Java (except a few classes) and therefore is 100% portable.
Swing components are lightweight. The AWT components are heavyweight (in terms of system resource utilization). Each AWT component has its own opaque native display, and always displays on top of the lightweight components. AWT components rely heavily on the underlying windowing subsystem of the native operating system. For example, an AWT button ties to an actual button in the underlying native windowing subsystem, and relies on the native windowing subsystem for their rendering and processing. Swing components (
```
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
```
99s) are written in Java. They are generally not "weight-down" by complex GUI considerations imposed by the underlying windowing subsystem.
Swing components support pluggable look-and-feel. You can choose between Java look-and-feel and the look-and-feel of the underlying OS (e.g., Windows, UNIX or macOS). If the later is chosen, a Swing button runs on the Windows looks like a Windows' button and feels like a Window's button. Similarly, a Swing button runs on the UNIX looks like a UNIX's button and feels like a UNIX's button.
Swing supports mouse-less operation, i.e., it can operate entirely using keyboard.
Swing components support "tool-tips".
Swing components are JavaBeans – a Component-based Model used in Visual Programming (like Visual Basic). You can drag-and-drop a Swing component into a "design form" using a "GUI builder" and double-click to attach an event handler.

Swing application uses AWT event-handling classes (in package

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

1). Swing added some new classes in package

01, but they are not frequently used.

Swing application uses AWT's layout manager (such as

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

8 and

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

9 in package

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

0). It added new layout managers, such as

05,

06, and

25 (in package

27).

Swing implements double-buffering and automatic repaint batching for smoother screen repaint.

Swing introduces

09 and

10 for creating Multiple Document Interface (MDI) applications.

Swing supports floating toolbars (in

11), splitter control, "undo".

Others - check the Swing website.

Using Swing API

If you understood the AWT programming (in particular, container/component and event-handling), switching over to Swing (or any other Graphics packages) is straight-forward.

Swing's Components

Compared with the AWT component classes (in package

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

0), Swing component classes (in package

27) begin with a prefix

14, e.g.,

35,

16,

17,

33,

31, or

20.

The above figure shows the class hierarchy of the swing GUI classes. Similar to AWT, there are two groups of classes: containers and components. A container is used to hold components. A container can also hold containers because it is a (subclass of) component.

As a rule, do not mix heavyweight AWT components and lightweight Swing components in the same program, as the heavyweight components will always be painted on top of the lightweight components.

Swing's Top-Level and Secondary Containers

Just like AWT application, a Swing application requires a top-level container. There are three top-level containers in Swing:

31: used for the application's main window (with an icon, a title, minimize/maximize/close buttons, an optional menu-bar, and a content-pane), as illustrated.

22: used for secondary pop-up window (with a title, a close button, and a content-pane).

20: used for the applet's display-area (content-pane) inside a browser’s window.

Similarly to AWT, there are secondary containers (such as

33) which can be used to group and layout relevant components.

The Content-Pane of Swing's Top-Level Container

However, unlike AWT, the

25 shall not be added onto the top-level container (e.g.,

31,

20) directly because they are lightweight components. The

25 must be added onto the so-called content-pane of the top-level container. Content-pane is in fact a

29 that can be used to group and layout components.

You could:

get the content-pane via

30 from a top-level container, and add components onto it. For example,

set the content-pane to a

33 (the main panel created in your application which holds all your GUI components) via

31's

33.

Notes: If a component is added directly into a

31, it is added into the content-pane of

31 instead, i.e.,

Event-Handling in Swing

Swing uses the AWT event-handling classes (in package

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

1). Swing introduces a few new event-handling classes (in package

01) but they are not frequently used.

Writing Swing Applications

In summary, to write a Swing application, you have:

Use the Swing components with prefix

14 in package

27, e.g.,

31,

35,

16,

17, etc.

A top-level container (typically

31) is needed. The

25 should not be added directly onto the top-level container. They shall be added onto the content-pane of the top-level container. You can retrieve a reference to the content-pane by invoking method

30 from the top-level container.

Swing applications uses AWT event-handling classes, e.g.,

47,

48, etc.

Run the constructor in the Event Dispatcher Thread (instead of Main thread) for thread safety, as shown in the following program template.

Swing Program Template

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

I will explain this template in the following Swing example.

Swing Example 1: SwingCounter

Let's convert the earlier AWT application example into Swing. Compare the two source files and note the changes (which are highlighted). The display is shown below. Note the differences in look and feel between the AWT GUI components and Swing's.

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

JFrame's Content-Pane

The

49's method

30 returns the content-pane (which is a

51) of the

31. You can then set its layout (the default layout is

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

9), and add components into it. For example,

You can also use the

31's

33 method to directly set the content-pane to a

33 (or a

99). For example,

JFrame's setDefaultCloseOperation()

Instead of writing a

8 listener with a

BtnCountListener listener = new BtnCountListener();
btnCount.addActionListener(listener);

13 handler to process the "close-window" button,

31 provides a method called

61 to sets the default operation when the user initiates a "close" on this frame. Typically, we choose the option

62, which terminates the application via a

63.

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

Running the GUI Construction Codes on the Event-Dispatching Thread

In the previous examples, we invoke the constructor directly in the entry

91 method to setup the GUI components. For example,

The constructor will be executed in the so-called "Main-Program" thread. This may cause multi-threading issues (such as unresponsive user-interface and deadlock).

It is recommended to execute the GUI setup codes in the so-called "Event-Dispatching" thread, instead of "Main-Program" thread, for thread-safe operations. Event-dispatching thread, which processes events, should be used when the codes updates the GUI.

To run the constructor on the event-dispatching thread, invoke

07 method

66 to asynchronously queue the constructor on the event-dispatching thread. The codes will be run after all pending events have been processed. For example,

Note:

67 is a cover for

68 (which is used in the NetBeans' Visual GUI Builder).

At times, for example in game programming, the constructor or the

91 may contains non-GUI codes. Hence, it is a common practice to create a dedicated method called

70 (used in NetBeans visual GUI builder) or

71 (used in Swing tutorial) to handle all the GUI codes (and another method called

72 to handle initialization of the game's objects). This GUI init method shall be run in the event-dispatching thread.

Warning Message "The serialization class does not declare a static final serialVersionUID field of type long"

This warning message is triggered because

3 (via its superclass

74) implements the

75 interface. This interface enables the object to be written out to an output stream serially (via method

76); and read back into the program (via method

77). The serialization runtime uses a number (called

78) to ensure that the object read into the program is compatible with the class definition, and not belonging to another version.

You have these options:

Simply ignore this warning message. If a

79 class does not explicitly declare a

78, then the serialization runtime will calculate a default

78 value for that class based on various aspects of the class.

Add a

78 (Recommended), e.g.

Suppress this particular warning via annotation

83 (in package

84) (JDK 1.5):

public void addActionListener(ActionListener lis);
public void removeActionListener(ActionListener lis);

Swing Example 2: SwingAccumulator

Using Visual GUI Builder - NetBeans/Eclipse

If you have a complicated layout for your GUI application, you should use a GUI Builder, such as NetBeans or Eclipse to layout your GUI components in a drag-and-drop manner, similar to the popular visual languages such as Visual Basic.

NetBeans

For using NetBeans GUI Builder, read my ""; or Swing Tutorial's "Learning Swing with the NetBeans IDE".

What is a graphical method to show program flow and execution?

Flowcharts for computer programming/algorithms As a visual representation of data flow, flowcharts are useful in writing a program or algorithm and explaining it to others or collaborating with them on it.

What are the 3 types of flowchart?

In 1987, Andrew Veronis published a book called Microprocessors: Design and Application that described the following three types of flowcharts:.

System flowchart..

General flowchart..

Detailed flowchart..

What is a flowchart used for?

A flowchart is a diagram depicting a process, a system or a computer algorithm. It is a diagrammatic representation of the solution to a given problem but, more importantly, it provides a breakdown of the essential steps to solving the problem.

Which of the following types of diagrams graphically represent the steps in a process?

A flowchart is a diagram that shows each step or progression of a process in sequential order. It uses lines to indicate directional flow and a standard set of symbols to describe the step-by-step procedures, inputs, and decisions in the process.

What is flowchart Free flowchart Flowchart rules Vẽ flowchart Online Draw flowchart Process flow diagram Flowchart symbols Flowchart example