Graphical User Interfaces part 2

Salessawi Ferede (Contains portions from University of Washington's CSE331 course)

GraphicalGCD
In previous exercises we have created a program to display the greatest common denominator (GCD) of two numbers on the command line.
We will create a graphical user interface for that program

Steps for Creating the Program

As we have seen last time, we begin by layingout components on the frame
You can find a thoroughly commented for doing this on the course page in GraphicalGCD1.java

But, how can we make the button respond when we click it?
i.e. how do we connect it with our button with the function that calculates GCD? The answer: events

Demo: Creating the Layout

GraphicalGCD1.java

Event Listeners

GUIs are Event Driven.

The user interacts with components:
Clicking Buttons, Checkboxes, Pressing Enter button

When the user interacts with a GUI component an event occurs

The event drives the program to perform a task.

Graphical events
event: An object that represents a user's interaction with a GUI component; can be "handled" to create interactive components.

listener: An object that waits for events and responds to them.

To handle an event, attach a listener to a component. The listener will be notified when the event occurs (e.g. button click).

Event-driven programming

event-driven programming: A style of coding where a program's overall flow of execution is dictated by events.
Rather than a central "main" method that drives execution, the program loads and waits for user input events. As each event occurs, the program runs particular code to respond. The overall flow of what code is executed is determined by the series of events that occur, not a pre-determined order.

Event hierarchy
Events are represented by Objects

import java.awt.event.*;

An event listener object must implement on the events shown below EventListener
AWTEventListener ActionListener TextListener ComponentListener FocusListener WindowListener

EventObject
AWTEvent (AWT) ActionEvent TextEvent ComponentEvent FocusEvent WindowEvent InputEvent KeyEvent MouseEvent

KeyListener MouseListener

Action events
action event: An action that has occurred on a GUI component.
The most common, general event type in Swing. Caused by:

button or menu clicks, check box checking / unchecking, pressing Enter in a text field, ... The listener is spared the details of processing individual mouse movements and mouse clicks, and can instead process a "meaningful" event like "button pressed". Represented by a class named ActionEvent Handled by objects that implement interface ActionListener

Implementing a listener
We create our own action listener by implementing the ActionListner interface (defined in java.awt.events)

public class name implements ActionListener { public void actionPerformed(ActionEvent event) { code to handle the event; } }

Attaching a Listener to a Component

We must connect a component and its action listener using the addActionListener method
JButton and other graphical components have this method public void addActionListener(ActionListener al) Attaches the given listener to be notified of clicks and events that occur on this component.

Demo: Handling the Event

GraphicalGCD1.java