Fundamentals of Software
Development
CT010-3-1
Event Handling
Prepared by: GTK First Prepared on:27 th July 2005 Last Modified on:19th December 2005
Quality checked by: GTK
Copyright 2005 Asia Pacific University College of Technology and Innovation
Topic & Structure of the lesson
Using Frames, Panels, Dialogs
Implementing GUI components on Frames
and Panels
Introduction to Event Handling
ActionListener and the classes used
Sample programs
CT010-3-1 Fundamentals of Software Design
Event Handling
Learning Outcomes
At the end of this module, YOU should be able to:
Understand the differences between a frame
and an applet.
Explain the structure of an event-handling
programme.
Create, edit, compile, run and debug simple
event-driven Java programs implementing GUI
components and layout managers
incorporating event-handling techniques.
CT010-3-1 Fundamentals of Software Design
Event Handling
Key Terms
If you have mastered this topic, you should be able to use
the following terms correctly in your assignments and
exams:
Frames
Dialog
Panel
ActionListener
CT010-3-1 Fundamentals of Software Design
Event Handling
AWT Basics - Frames
A Frame is a top-level window with a title and a border. In
the Java API, it's object hierarchy looks something like this;
java.lang.Object
|
+--java.awt.Component
|
+--java.awt.Container
|
+--java.awt.Window
|
+--java.awt.Frame
As you can see, the Frame inherits from a long line of
superclasses, the immediate one being the Window class
CT010-3-1 Fundamentals of Software Design
Event Handling
AWT Basics - Frames
Creating your first frame
import java.awt.*;
public class MyFrame extends Frame {
public static void main(String[] args) {
MyFrame me = new MyFrame();
}
public MyFrame() {
setSize(150,150);
setLocation(100,100);
setTitle("My First java.awt.Frame!");
setLayout(new FlowLayout());
setVisible(true);
}
}
CT010-3-1 Fundamentals of Software Design
Event Handling
AWT Basics - Frames
setSize()
- sets the size of the frame.
setLocation()
- sets the location of the frame
within the desktop.
setTitle()
- sets the title of the frame.
setVisible() - makes the frame visible to the
user.
The output of the
program might look
something like this :
CT010-3-1 Fundamentals of Software Design
Event Handling
AWT Basics - Dialog
A Dialog is a top-level window with a title and a
border that is typically used to take some form of
input from the user.
In the API hierarchy, the Dialog inherits from the
following line of objects
java.lang.Object
|
+--java.awt.Component
|
+--java.awt.Container
|
+--java.awt.Window
|
+--java.awt.Dialog
CT010-3-1 Fundamentals of Software Design
Event Handling
AWT Basics - Dialog
Dialogs are typically used on-top of an existing
Window to capture data or display messages to
the user.
An example of a typical dialog would be the fileopen dialog;
CT010-3-1 Fundamentals of Software Design
Event Handling
AWT Basics - Dialog
A dialog must have either a frame or another
dialog defined as its owner when it's
constructed.
A dialog can be either modeless (the default) or
modal.
A modal dialog is one which blocks input to all
other top level windows in the app context,
except for any windows created with the dialog
as their owner.
CT010-3-1 Fundamentals of Software Design
Event Handling
AWT Basics - Dialog
Creating a Dialog
Dialog d = new Dialog(this, "java.awt.Dialog", true);
d.setSize(100,100);
d.setLocation(120,120);
d.show();
CT010-3-1 Fundamentals of Software Design
Event Handling
AWT Basics - Dialog
By adding the codes
above to the
previous program,
the output of the
program might
look something like
this :
CT010-3-1 Fundamentals of Software Design
Event Handling
Panels
The Panel object is located in the following API
hierarchy;
java.lang.Object
|
+--java.awt.Component
|
+--java.awt.Container
|
+--java.awt.Panel
A Panel is similar to a Window in that a Panel is a
surface that you can place Components.
But a Panel is not a Window; it is a sibling of a
Window.
CT010-3-1 Fundamentals of Software Design
Event Handling
Panels
For example, you can create an application using BorderLayout . Then,
within the North Panel, you can place a TextArea using FlowLayout, and
within South Panel, you can place five Buttons using FlowLayout.
North Panel
(textPanel)
South Panel
(buttonPanel)
By using Panels within Panels, you can create an infinite variety of
screen layouts.
CT010-3-1 Fundamentals of Software Design
Event Handling
Panels
The code that
generate the
previous GUI :
setLayout(new BorderLayout());
Panel buttonPanel = new Panel();
buttonPanel.setBackground(Color.blue);
buttonPanel.setLayout(new FlowLayout());
Button memo1Button = new Button("Save Memo 1");
buttonPanel.add(memo1Button);
Button memo2Button = new Button("Save Memo 2");
buttonPanel.add(memo2Button);
Button clearButton = new Button("Clear");
buttonPanel.add(clearButton);
Button getMemo1Button = new Button("Get Memo 1");
buttonPanel.add(getMemo1Button);
Button getMemo2Button = new Button("Get Memo 2");
buttonPanel.add(getMemo2Button);
add(buttonPanel,"South");
Panel textPanel = new Panel();
theText = new TextArea(10,40);
textPanel.add(theText);
add(textPanel, "North");
CT010-3-1 Fundamentals of Software Design
Event Handling
Event-Handling Application
GUIs are event-driven (generate events when user
interacts with the GUI components (event source))
Common interactions include moving the mouse,
clicking the mouse, clicking a button, typing in a
textfield, selecting an item from a menu etc.
event-driven program is a program that runs the event
loop that waits for input and then responds accordingly
event-driven programming is a technique used in
software that operates a program in response to events
as they occur
CT010-3-1 Fundamentals of Software Design
Event Handling
Event-Handling Application
The basic model for a GUI program requires the following:
1. Declaring application as event listener (action listener)
(e.g. implements ActionListener)
2. Register the reactive components
(e.g. tFahr.addActionListener (this))
3. Define the action to be performed (methods)
(e.g. action Performed(ActionEvent e))
2 key tasks to process a GUI event:
Register an event listener for the GUI component that is
expected to generate the event
Implement an event-handling method (event handlers)
CT010-3-1 Fundamentals of Software Design
Event Handling
Event-Handling Application
Event Class
ActionEvent
WindowEvent
AdjustmentEvent
ItemEvent
e.g. import java.awt.ActionEvent
Common types of event listener
ActionListener (clicking, selecting items)
WindowListener (closing, opening windows)
AdjustmentListener (scrollbars)
ItemListener (selecting checkboxes)
e.g. implements ActionListener
CT010-3-1 Fundamentals of Software Design
Event Handling
Event-Handling Application
1. Import the java.awt.event package
eg. import java.awt.event.*;
2. Declare the application to be a Listener
eg. public class ConvertTemp extends Frame implements
ActionListener {
3. Register the reactive components
Reactive components : Components that cause an action to
be performed when its activated such as by clicking or
changing its value.
eg.
TextField tFahr = new TextField(10);
tFahr.addActionListener(this);
add(tFahr);
CT010-3-1 Fundamentals of Software Design
Event Handling
Event-Handling Application
4. Define the action to be performed when a reactive
component is activated
eg.
public void actionPerformed (ActionEvent e) {
if (e.getSource() == tFahr) {
} else {
}
}
CT010-3-1 Fundamentals of Software Design
Event Handling
Example: Memo Saver
Lets look at an example of a simple memo saver which
produced the output and GUI which looks like this :
textPanel
buttonPanel
CT010-3-1 Fundamentals of Software Design
Event Handling
Example: Memo Saver
import java.awt.*;
import java.awt.event.*;
public class TextAreaDemo extends Frame implements ActionListener {
public TextAreaDemo() {
setTitle("Memo Saver");
setLayout(new BorderLayout());
setSize(450,250);
addWindowListener(new WindowDestroyer());
Panel buttonPanel = new Panel();
buttonPanel.setBackground(Color.blue);
buttonPanel.setLayout(new FlowLayout());
Button memo1Button = new Button("Save Memo 1");
memo1Button.addActionListener(this);
buttonPanel.add(memo1Button);
Button memo2Button = new Button("Save Memo 2");
memo2Button.addActionListener(this);
buttonPanel.add(memo2Button);
CT010-3-1 Fundamentals of Software Design
Event Handling
Example: Memo Saver
Button clearButton = new Button("Clear");
clearButton.addActionListener(this);
buttonPanel.add(clearButton);
Button getMemo1Button = new Button("Get Memo 1");
getMemo1Button.addActionListener(this);
buttonPanel.add(getMemo1Button);
Button getMemo2Button = new Button("Get Memo 2");
getMemo2Button.addActionListener(this);
buttonPanel.add(getMemo2Button);
add(buttonPanel,"South");
textPanel = new Panel();
textPanel.setBackground(Color.white);
theText = new TextArea(10,40);
theText.setBackground(Color.white);
textPanel.add(theText);
add(textPanel, "North");
}
CT010-3-1 Fundamentals of Software Design
Event Handling
Example: Memo Saver
public void actionPerformed (ActionEvent e) {
String actionCommand = e.getActionCommand();
if (actionCommand.equals("Save Memo 1"))
memo1=theText.getText();
else if (actionCommand.equals("Save Memo 2"))
memo2=theText.getText();
else if (actionCommand.equals("Clear"))
theText.setText("");
else if (actionCommand.equals("Get Memo 1"))
theText.setText(memo1);
else if (actionCommand.equals("Get Memo 2"))
theText.setText(memo2);
}
CT010-3-1 Fundamentals of Software Design
Event Handling
Example: Memo Saver
public static void main (String[] args) {
TextAreaDemo guiDemo = new TextAreaDemo();
guiDemo.setVisible(true);
}
private Panel textPanel;
private TextArea theText;
private String memo1 = "No Memo 1";
private String memo2 = "No Memo 2";
}
CT010-3-1 Fundamentals of Software Design
Event Handling
Example: Temperature
Application
import java.applet.*;
import java.awt.*;
import java.awt.event.*;
public class ConvertTemp extends Frame implements ActionListener {
// Declare and allocate Components
TextField
tFahr = new TextField(9),
tCent = new TextField(9);
private Panel textPanel;
private TextArea theText;
private String memo1 = "No Memo 1";
rivate String memo2 = "No Memo 2";
public static void main(String[] args){
ConvertTemp me = new ConvertTemp();
}
CT010-3-1 Fundamentals of Software Design
Event Handling
Example: Temperature
Application
public ConvertTemp() {
setSize(250,300);
setLocation(100,100);
setTitle("Converting Temperature");
setLayout(new FlowLayout());
addWindowListener(new WindowDestroyer());
// Arrange Component layout
add(new Label("Fahrenheit"));
add(tFahr);
add(new Label("Centigrade"));
add(tCent);
// Register Component Listeners
tFahr.addActionListener(this);
tCent.addActionListener(this);
setVisible(true);
}
CT010-3-1 Fundamentals of Software Design
Event Handling
Example: Temperature
Application
public void actionPerformed (ActionEvent e) {
// Respond to Action Events:
// 1. tFahr TextField
// 2. tCent TextField
double fahr, cent;
if (e.getSource()==tFahr) {
fahr = new Double(tFahr.getText()).doubleValue();
cent = 5.0 * (fahr - 32.0) / 9.0;
tCent.setText(cent + "");
}
else {
cent = new Double(tCent.getText()).doubleValue();
fahr = 9.0 * cent / 5.0 + 32.0;
tFahr.setText(fahr + "");
}
}
}
CT010-3-1 Fundamentals of Software Design
Event Handling
Quick Review Question
How are frames different from applets?
List the four (4) steps to include event
handling into an application.
CT010-3-1 Fundamentals of Software Design
Event Handling
Summary of Main Teaching
Points
Using Frames, Panels, Dialogs
Implementing GUI components on Frames
and Panels
Introduction to Event Handling
ActionListener and the classes used
Sample programs
CT010-3-1 Fundamentals of Software Design
Event Handling
Next Lesson
Object-Oriented Programming
Introduction to classes and objects
Defining a class
Adding variables and methods to a class
Defining an object
Visibility control
public, private, protected, default
Static/Instance members
CT010-3-1 Fundamentals of Software Design
Event Handling
