Chapter 1: Computer Systems

aniseedsplashSoftware and s/w Development

Aug 15, 2012 (5 years and 27 days ago)

604 views

1

GUI I & II
-

Java Swing Components

How to use Java Development IDE Tolls
-

Forte


Demo & Lab Exercises

We

can

now

explore

the

creation

of

graphical

user

interfaces

in

more

detail

that

focuses

on
:



GUI infrastructure



Containers



Using graphics in applications



Swing components and event handling



Layout managers

Hands

on

Java

Development

IDE

Tolls
:

netBeans

How to create components & handle events

Demo & Lab Exercises: Windchill.java,
TemperatureConverter.java

2

GUI Overview

To create a Java GUI, we need to understand:


components


layout managers


events


listeners


containers


special features

In previous chapters we introduced events and listeners, as well as GUI
components from the
java.awt

package

In this chapter we will focus on Swing components:

Jlabel
An area where uneditable text or icons can be displayed.

JTextField

An area in which user inputs data and it can also display information.

Jbutton

An area that triggers an event when clicked.

JCheckBox

A GUI component that is either selected or not selected.

JComboBox

A drop
-
down list of items from which the user can make a selection by clicking an

item in the list or possibly by typing into the box.

Jlist

An area where a list of items is displayed from which the user can make a selection by

clicking once on any element in the list. Double
-
clicking an element in the list generates

an action event. Multiple elements can be selected.

Jpanel

A container in which components can be placed.

Common superclasses of the Swing components
.



3

AWT vs. Swing


Java Graphics API

Component

Java.awt package


heavyweight components


Container

LayoutManager

Window

Applet

Panel

Frame

Dialog

JApplet

JFrame

JDialog

JComponent

Lightweight omponents


Javax.swing package


Early Java development used graphic classes defined in the Abstract
Windowing Toolkit (AWT), a
lightweight control
.


With Java 2, Swing classes were introduced,
a heavyweight control.
Many
AWT components have improved Swing counterparts


Swing does not generally replace the AWT; we still use AWT events and the
underlying AWT event processing model

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


4

Containers


A container is a special component that can hold other components

The awt
Applet

class, as well as the Swing
JApplet

class, are containers

Other containers include:


panels


frames


dialog boxes


multiple
panels

with each panel's components arranged in a specific layout.
Panels are created with class
Jpanel
-


a subclass of
JComponent
.

// import java.awt.*, java.awt.event.* and javax.swing.*;


public class PanelDemo extends JFrame {



private JPanel buttonPanel;



private JButton buttons[];



public PanelDemo()




// set up GUI



{

super( "Panel Demo" );



Container container = getContentPane();

// get content pane




container.add( buttonPanel, BorderLayout.SOUTH );



setSize( 425, 150 ), setVisible( true );


// …..

5

Event Handling Model


Chapter 8

Event
-
listener

Interfaces of package
java.awt.event

The AWT Event Hierarchy


Event classes of package in j
ava.awt.event


Event Handling Summary

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


6

How Event Handling Works

Event registration for
JTextField

textField1

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


7

Mouse Event Handling

MouseListener and MouseMotionListener interface methods

Methods of interface
MouseListener

public void

mousePressed(

MouseEvent

event

)




Called when a mouse button is pressed with the mouse cursor on a component.

public void

mouseClicked(

MouseEvent

event

)



Called when a mouse button is pressed and released on a component without moving
the mouse cursor.

public void

mouseReleased(

MouseEvent

event

)



Called when a mouse button is released after being pressed. This event is always
preceded by a mousePressed event.

public void

mouseEntered(

MouseEvent

event

)



Called when the mouse cursor enters the bounds of a component.

public void

mouseExited(

MouseEvent

event

)



Called when the mouse cursor leaves the bounds of a component.

Methods of interface
MouseMotionListener

public void

mouseDragged(

MouseEvent

event

)



Called when the mouse button is pressed with the mouse cursor on a component and
the mouse is moved. This event is always preceded by a call to mousePressed.

public void

mouseMoved(

MouseEvent

event

)



Called when the mouse is moved with the mouse cursor on a component.

8

Mouse Event Handling

// Demonstrating mouse events.

class MousePanel extends JPanel

{ public MousePanel()


{ squares = new ArrayList();


addMouseListener(new MouseHandler());


addMouseMotionListener(new MouseMotionHandler()); }

private class MouseHandler


extends MouseAdapter

{ public void mousePressed(MouseEvent event)


{// add a new square }

public void mouseClicked(MouseEvent event)


{// remove the current square }

}

}

private class MouseMotionHandler


implements MouseMotionListener

{ public void mouseMoved(MouseEvent event)


{ // set the mouse cursor to cross hairs}


public void mouseDragged(MouseEvent vent)


{ // drag the current rectangle


//to center it at (x, y) }

}

___________________________________________________________________

9

KeyBoard Event Handling

//Demonstrating keystroke events.


public class KeyDemo extends JFrame implements KeyListener {



public KeyDemo()


{


getContentPane().add( textArea );






// allow frame to process Key events



addKeyListener( this );


}

public void keyPressed( KeyEvent event )


// handle press of any key


{

line1 = "Key pressed: " + event.getKeyText( event.getKeyCode() );


setLines2and3( event ); }

public void keyReleased( KeyEvent event ) // handle release of any key


{line1 = "Key released: " + event.getKeyText( event.getKeyCode() );


setLines2and3( event ); }

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


10

Button Event Handling

//ButtonTest

{ public ButtonPanel()


{ JButton yellowButton = new JButton("Yellow");

// create buttons


add(yellowButton);





// add buttons to panel








// create button actions


ColorAction yellowAction = new ColorAction(Color.YELLOW);


yellowButton.addActionListener(yellowAction);}

// associate actions with buttons









// An action listener that sets the panel's background color.


private class ColorAction implements ActionListener


{ public ColorAction(Color c)


{ backgroundColor = c; }


public void actionPerformed(ActionEvent event)


{

setBackground(backgroundColor); }



private Color backgroundColor;


}

}

11

Window Events


java.awt.event.WindowListener /WindowEvent

Because a frame is a free standing window, we must now
address
window events


Specifically, we must be able to handle a
window closing

event


Frames have an icon in the corner of the window to close it


Clicking it will cause the
windowClosing

method of a
window listener object to be invoked


Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


12

Window Events and Class Demo

//
GenericWindowListener.java


import java.awt.event.*;

public class GenericWindowListener extends WindowAdapter

{


// Terminates the program when the window is closed.



public void windowClosing (WindowEvent event)



{



System.exit(0);



}

}


Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


13

Swing Components

There are various Swing GUI components that we can
incorporate into our software:


labels (including images)


text fields and text areas


buttons


check boxes


radio buttons


menus


combo boxes


and many more…


Using the proper components for the situation is an
important part of GUI design

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


14

Swing Jcomponents

Component

Jcomponent and its subclass


JLable

JOptionPane

JPanel

JFileChoser

JList

JMenuBar

JCombox

JScrollBar

JPopupMenu

AbstractButton

JTextComponent

JScrollPane

JProgressBar

JinternalFrame

JTableHeader

JSplitPane

JTable

JLayerPane

JToolBar

JSeparator

JRootPane

JPane

JColorChooser

JTree

JTabbledPane

JToolTip

JSlider

JMenuItem

JButton

JToggleButton

JCheckBoxMenuItem

JMenu

JRadioiButtonMenuItem

JCheckBox

JRadiobutton

JEditPane

JTextField

JTextArea

JPasswordField

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


15

Buttons

An area that triggers an event when clicked.


GUI buttons fall into various categories:


push button


a generic button that initiates some action


check box


a button that can be toggled on or off


radio buttons


a set of buttons that provide a set of mutually exclusive
options










The button hierarchy.

Radio buttons must work as a group; only one can be toggled on at a time


Radio buttons are grouped using the
ButtonGroup

class

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


16

JButtons

Push buttons and radio buttons generate action events when
pushed or toggled

Check boxes generate
item state changed

events when toggled





// Listing G1.1 Windchill.java




JButton runButton = new JButton( “Run" );

// create buttons


c.add(runButton );



// c is a container



Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


17

JList

An area where a list of items is displayed from which
the user can make a selection by clicking once on any
element in the list. Double
-
clicking an element in the
list generates an action event. Multiple elements can be
selected.


// Selecting colors from a JList.


Container container;



JList colorList



String colorNames[] = { "Black", "Blue", ……. , "White", "Yellow" };



Color colors[] = { Color.black, Color.blue, ……. , Color.white, Color.yellow };



colorList = new JList( colorNames ); // the list with items in colorNames array

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


18

Layout Managers



A layout manager is an object that determines the manner
in which components are displayed in a container


There are several predefined layout managers defined in
the Java standard class library:

Defined in the AWT

Defined in Swing

FlowLayout

BorderLayout

CardLayout

GridLayout

GridBagLayout

BoxLayout

OverlayLayout

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


19

Layout Managers

Every container has a default layout manager, but we can
also explicitly set the layout manager for a container


Each layout manager has its own particular rules
governing how the components will be arranged


Some layout managers pay attention to a component's
preferred size or alignment, and others do not


The layout managers attempt to adjust the layout as
components are added and as containers are resized



Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


20

Flow Layout

A flow layout puts as many components on a row as possible,
then moves to the next row


Rows are created as needed to accommodate all of the
components


Components are displayed in the order they are added to the
container


The horizontal and vertical gaps between the components can
be explicitly set



Static final FlowLayout LAUOUT_STYLE = new FlowLayout();



myContainer.setLayout(
LAUOUT_STYLE
);

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


21

Border Layout

A border layout defines five areas into which components
can be added


North

South

Center

East

West

BorderLayout layout;

layout = new BorderLayout( 5, 5 );




// get content pane and set its layout

Container container = getContentPane();





container.setLayout( layout );

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


22

Grid Layout


Container container;


GridLayout grid1, grid2;




grid1 = new GridLayout( 2, 3, 5, 5 );

// set up layouts


grid2 = new GridLayout( 3, 2 );



container = getContentPane();






// get content pane and set its layout


container.setLayout( grid1 );


container.setLayout( grid2 );



Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


23

Box Layout

A box layout organizes components either horizontally (in
one row) or vertically (in one column)


Special rigid areas can be added to force a certain amount
of spacing between components


By combining multiple containers using box layout, many
different configurations can be created


Multiple containers with box layouts are often preferred to
one container that uses the more complicated gridbag
layout manager

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


24

Introduction to IDE Tools


How to Use netBean

Using Forte / Jbuilder to Create a Project



Creating a Simple Java Project




GUI Design using JFrame, JPanel, JMenu &

Components



Handling Events




Compiling and Excuting the Java Application


Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


25

Introduction to IDE Tools


How to Use netBeans

Using IDE


Starting Forte

(refer Forte help reference)



To work with IDE, you need to be familiar with these concepts:


Templates

Filesystems

Modules

Projects




Mounting

a

Filesystem



You

must

mount

PACKAGEs

in

the

IDE

that

your

project

depends

on



by
:



Choose

File

=>

Mount

Filesystem


Creating

a

New

Project



Create

a

new

project

that

uses

all

of

default

settings



Open

a

file

within

the

IDE


To

open

a

file

in

the

IDE

(the

file

is

already

part

of

a

mounted

filesystem)

:






Choose

File

=>

Open

File

the

file

opens

immediately
.



To

open

a

file

not

in

the

mounted

filesystem,

you

must

pick

the

file's





package

to

mount

and

open
.


Lab Demo


Windchill.java

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu


26

Introduction to IDE Tools


How to Use netBeans

Using

IDE



netBeans

to

Create

a

Project





(refer

reference

book

or

distributed

pages)



Creating a Simple Java Program in Project



Compiling a Java Program



Excuting a Java Application



Lab Demo

27

Assignment 8


GUI Programming, P.312 & P.535


Reading:

Chapter 6 GUI I, Chapter 9 GUI II and

Chapter 12(Cay Book) (option)



1. I
-
2.

2. I
-
4.

3.


Reading the programming project
-

smiley guessing
game in the page p.535. Compile and run the program
Smiley.java.

Week 9

07/11/2005


Course ISM4234
-
004


Dr. Simon Qiu