Clients with Graphical User Interfaces

1
Clients with Graphical User Interfaces
2
Javas Abstract Windows Toolkit

• Java provides classes for graphical components in
  the package java.awt
• abstract windows toolkit
• the sub-package java.awt.event has classes for
  handling Graphical User Interface (GUI) events
• need to import both packages to use them
• import java.awt.
• import java.awt.event.
• java.awt is the original Java GUI API

3
Java Swing

• AWT had some problems
• It supported everything you could do in an HTML
  form, free standing frames, menus, and other
  objects, but more complex GUI features were more
  difficult
• It was heavyweight There were some portability
  problems because it relied heavily on the runtime
  platforms native user interface components and
  it wasnt always possible to hide differences in
  the way these components behaved
• Swing was introduced to address some of these
  problems
• based on awt, but Swing has more components
• (e.g. selectable list)
• contained in package javax.swing
• written entirely in Java (i.e. lightweight)
• awt could only incorporate lowest common
  denominator capabilities present on every
  platform
• Swing's capabilities are platform-independent
• Flexible you can change the look and feel

4
JFrame

• a JFrame is a window with a title bar
• can add the other components to it
• JMenuBar, JButtons, JTextFields.
• make the client application class a subclass of
  JFrame
• inherit JFrame's attributes and methods
• add our own method to set up and add the GUI
  components
• call it from the constructor
• add other methods to interact with rest of the
  system

5
Simple Example of a JFrame
import java.awt. import java.awt.event. import
javax.swing. public class MyClient extends
JFrame public MyClient()
super( "SavingsAccountRemote EJB Client" )
createGUI() setDefaultCloseOperation(
EXIT_ON_CLOSE ) setSize( 600, 300 )
setVisible( true ) private void
createGUI() public
static void main( String args )
MyClient myMyClient new MyClient()
6
Simple Example of a JFrame

• Doesnt do anything yet

7
Layout Managers

• The position of graphical components is
  controlled by a Layout Manager
• The default layout manager for a JFrame object is
  BorderLayout
• Alternative layout managers
• FlowLayout
• GridLayout
• GridBagLayout

8
BorderLayout

• components can be added to one of five regions
• only one component per region
• to add more, define a JPanel object, add the
  components to the JPanel, then add the JPanel to
  the region

9
BorderLayout Example
import java.awt. import java.awt.event. import
javax.swing. public class MyClient extends
JFrame private JButton okButton
private JLabel helloLabel public MyClient()
super( "Border Layout Example" )
createGUI() setDefaultCloseOperation
( EXIT_ON_CLOSE ) setSize( 220, 150 )
setVisible( true ) private void
createGUI() okButton new
JButton("OK") helloLabel new
JLabel("Hello") setLayout(new
BorderLayout()) Container contentPane
getContentPane() contentPane.add(
helloLabel,BorderLayout.CENTER )
contentPane.add( okButton,BorderLayout.SOUTH )
public static void main( String args
) MyClient myMyClient new
MyClient()

• Note you need to get a Container object
  (contentPane) before adding component objects to
  it
• Weve also introduced JLabel and JButton objects

10
Using Components

• Declare components as attributes
• Create components in constructor
• Add listeners to active components
• Add components to the frame
• Write actionPerformed() method (see later) for
  active components
• Write any methods called by these methods

11
JButtons

• JButtons can be added to any subclass of
  JContainer
• Need to declare JButtons as attributes
• private JButton addButton,saveButton,deleteButton
  ,findButton
• In the constructor (or a method called by it)
• create the buttons
• register them with an action listener (see later)
• add them to a JPanel object
• add the panel to the JFrame object content pane

12
BorderLayout Example
import java.awt. import java.awt.event. import
javax.swing. public class MyClient extends
JFrame private JButton okButton
private JLabel helloLabel private JPanel
p1,p2 public MyClient() super(
"Border Layout Example" ) createGUI()
setDefaultCloseOperation( EXIT_ON_CLOSE )
setSize( 220, 150 ) setVisible(
true ) private void createGUI()
okButton new JButton("OK")
helloLabel new JLabel("Hello") p1 new
JPanel() p2 new JPanel()
p1.add(okButton) p2.add(helloLabel)
setLayout(new BorderLayout())
Container contentPane getContentPane()
contentPane.add( p2,BorderLayout.CENTER )
contentPane.add( p1,BorderLayout.SOUTH )
public static void main( String args )
MyClient myMyClient new MyClient()

• Its better to add the components to a JPanel
  object and then add the JPanel object to the
  container
• So far the OK Button doesnt do anything

13
FlowLayout

• Displays the components from left to right in the
  order they are added
• Centres the line of components
• Wraps to next line when first line is full
• The example below shows the effect of resizing
  the window with the JPanel p3 set to FlowLayout

p1 new JPanel() p2 new
JPanel() p3 new JPanel()
p1.add(okButton) p2.add(helloLabel)
p3.setLayout(new FlowLayout())
p3.add(p2) p3.add(p1)
Container contentPane getContentPane()
contentPane.add( p3)
14
GridLayout

• Places components in rows and columns
• Fills up left to right by row
• setLayout(new GridLayout(2,3))

15
GridBagLayout

• Allows precise placement of components on a grid
  of cells
• Components can occupy more than one cell
• Component can occupy entire cell, or be padded
  with white spaces
• Flexible but complicated!!

16
Events in Java

• When a user interacts with a graphical system, an
  event is generated
• mouse click on interface component
• key press
• Events can also be generated externally
• display needs to be repainted
• java.awt.event and javax.swing.event. contain
  classes to deal with events

17
Events in Java

• Every time an event occurs, a new object of the
  appropriate class is generated
• WindowEvent
• window opening and closing, window activation
• ActionEvent
• component actions such as button presses, menu
  and checkbox selection
• AdjustmentEvent
• moving of scrollbars
• KeyEvent
• key presses
• MouseEvent
• mouse clicks, moves, drags

18
EventListener

• We need to register an event listener for each
  active component
• When a component generates an event object, it is
  sent to the registered listener
• Two ways to program
• The class must implement the appropriate listener
  interface
• WindowListener
• ActionListener
• AdjustmentListener
• KeyListener
• MouseListener
• Or we can use anonymous inner classes

19
Example implementing the Action Listener Interface
public class MyClient extends JFrame implements
ActionListener private void
createGUI() okButton new JButton("OK")
p1 new JPanel() p1.add(okButton)
okButton.addActionListener(this) Container
contentPane getContentPane()
contentPane.add( p1) public void
actionPerformed(ActionEvent e)
message() public void message()
JOptionPane.showMessageDialog(this,"OK Button
hit")

• Note you have one actionPerformed() method and
  must distinguish between the different action
  events in the actionPerformed() method body

20
Example using an anonymous inner class
public class MyClient extends JFrame
private void createGUI() okButton
new JButton("OK") p1 new JPanel()
p1.add(okButton) okButton.addActionListener(
new ActionListener() //anonymous inner
class public void actionPerformed(
ActionEvent event ) message()
) Container contentPane
getContentPane() contentPane.add( p1)
public void message() JOptionPane.showMess
ageDialog(this,"OK Button hit")

• Note you have an actionPerformed() method for
  every ActionListener

21
Dialog Boxes

• A simple way to
• get input from the user
• confirm actions
• output messages
• JOptionPane class has several standard dialog
  boxes
• call static methods to show

22
Dialog Boxes- JOptionPane.showInputDialog()
String primaryKeyString JOptionPane.showInpu
tDialog(this, "Please enter a
Record id")

• used for simple input of one data item
• String parameter the prompt
• can also specify title and icon as parameters
• if the user clicks OK button, the input is
  returned as a String
• if the user clicks Cancel button, returns null

23
Dialog Boxes- JOptionPane.showInputDialog()

• To input integers or doubles
• convert the returned String using a parse method
• use Double.parseDouble() for doubles
• Use Integer.parseInt() for Integers
• Integer id Integer.parseInt(JOptionPane.showInpu
  tDialog(this, "Please enter a Record id" )

24
Dialog Boxes- JOptionPane.showMessageDialog()

• Used to output a message or warning
• Parameters
• parent frame (usually this)
• message to output
• JOptionPane.showMessageDialog(this,Add Record
  Button hit")

25
Dialog Boxes- JOptionPane.showMessageDialog()

• Can have additional parameters
• title
• String to display at top of dialog
• message type
• Integer code
• Icon
• image to display
• each message type has a default icon
• JOptionPane.showMessageDialog(this, "Item "
  itemID " not found", "Not found",
  JOptionPane.WARNING_MESSAGE)

26
Message types

• ERROR_MESSAGE
• INFORMATION_MESSAGE
• WARNING_MESSAGE
• QUESTION_MESSAGE
• PLAIN_MESSAGE

27
Dialog Boxes- JOptionPane.showConfirmDialog()

• Confirm whether an action should proceed
• Can choose which buttons to display
• YES_NO_OPTION
• YES_NO_CANCEL_OPTION
• OK_CANCEL_OPTION.
• Returns an integer corresponding to option
  selected
• YES_OPTION, NO_OPTION, CANCEL_OPTION, OK_OPTION,
  CLOSED_OPTION
• int confirm JOptionPane.showConfirmDialog(this,
  "Are you sure you want to delete?", "Confirm
  order delete", JOptionPane.YES_NO_OPTION)

28
Menus

• Menus can be added to any subclass of JFrame
• Need to declare the active components as
  attributes
• private JMenuRecord mitmAddRecord,
  mitmSaveRecord, mitmDeleteRecord,
  mitmFindRecord, mitmExit
• In the constructor (or a method called by it)
• create the menu components
• add an action listener to them
• add them to the JFrame object

29
Menus
public void addMenu() // create a menu bar
and put it at the top of the frame JMenuBar
mBar new JMenuBar() setJMenuBar(mBar)
// create and attach a pull-down menu to deal
with items JMenu mnuItem new
JMenu("Record") mBar.add(mnuItem) //
attach menu items to menu mnuItem.add(mitmAddRe
cord) mnuItem.add(mitmSaveRecord)
mnuItem.add(mitmDeleteRecord)
mnuItem.add(mitmFindRecord)
mnuItem.addSeparator() mnuItem.add(mitmExit)
------- ------- -------
30
Menus
// adding action listeners using anonymous inner
classes mitmAddRecord.addActionListener(ne
w ActionListener() public void
actionPerformed( ActionEvent event )
addSavingsAccount()
) mitmSaveRecord.addActionListener(ne
w ActionListener() public void
actionPerformed( ActionEvent event )
updateSavingsAccount()
) mitmDeleteRecord.addActionList
ener(new ActionListener() public
void actionPerformed( ActionEvent event )
deleteSavingsAccount()
) mitmFindRecord.addAct
ionListener(new ActionListener()
public void actionPerformed( ActionEvent event )

getSavingsAccount() )
mitmExit.addActionListener(new ActionListener()
public void actionPerformed(
ActionEvent event )
System.exit(0) )