Readings

• On the course Web page look at:
  • additional TA lab hours
  • Remaining Topics
• In the text read
  • Chapter 13
  • Pick up the Project

Graphical User Interface - GUI

• components define GUIs
• models of GUI-based programs
• events and event-driven programming
• Canvas class defines custom GUI
  components
• layout managers specify the positioning of
  components inside containers

GUI Elements

• Object: java.lang
  
  
• Component: setSize(Dimension), setVisible(boolean), show
   
  
• Container: paint(Graphics), add(Component)
   
  
• Panel
   
  
• Applet: java.applet, init, start

GUI Elements defined in java.awt

• classes derived from the Component class
  are called GUI Components
• grouped together by using GUI components
  called containers
• arrangement of components is managed by
  the layout manager
• Component
   
  
• Button, Canvas, Checkbox, Choice,
  Container, Label, List, Scrollbar
  TextComponent TextField, TextArea

Class Hierarchy

GUI Event-Driven programs

• GUI components generate events
  indicating that some action occurred:
  • mouse moves
  • mouse keys pressed.
  • the enter key or other key pressed.
• Event-driven programs specify what
  happens when a user's actions generate software events.

Thread one, sets up communication & links &
instantiates applet 1-3,4-6 call init A-C

Mimic

Mimic_GUI

Mimic_Action_Listener

java.applet.Applet        Label
   ^                      ,String------.
   | extends     A------->`--------.---'
 Mimic          /        Mimic_Gui ^        TextField
,-------------./        ,----------2--.  ,-----------------.
| gui --------|----1--->|          |  |  |                 |
|             |         |   label--'  |  |BlackBox contains|
|             |----B----|-> quote --3-|->|String, listener |
|             |         |             |  | receives        |
|             |         |             |  | ActionEvents    |
|             |<---4----|-- applet    |  | events          |
|             |      ,--|-- listener  |  |                 |
|-------------|      |  |-------------|  |-----------------|
| init()      |      |  | init()      |  |method that calls|
| update_label|      5  | update_label|  |                 |
|             |      |  | (String)    |  |addActionListener|
|             |      |  | get_quote() |  |(listener)       |
`----.--------'      |  `-------------'  `---.-------------'
     ^               V                       |
     |        ,------------------.           |
     `---6----|-listening_applet |<----C-----'
              |------------------|
              | actionPerformed  |
              `------------------'
             Mimic_Action_Listener
                  | implements
                  V interface
    java.awt.event.Action_Listener

Applet: Thread 1 sets up communications

A&B) applet.add(Component) places
components in the applet container

C) Registering quote.addActionListener (listener)
associates the listening object with the quote TextField (a component) and a new thread is started. i.e. connect an ActionEvent with a listener

TextField: Thread 2 waits for and
responds to an ActionEvent

When the quote object detects the ActionEvent, a newline in the text field, all listeners registered using
addActionListener are called. i.e.
specific methods are called.

Listener classes must provide specific methods i.e. in this case actionPerformed(ActionEvent) from ActionListener is implemented.

Event-Driven Programming

java.applet.Applet        Label
   ^                      ,-String-----.
   | extends     .------->`--------.---'
 Mimic          /        Mimic_Gui ^        TextField
,-------------./        ,-------------.  ,-----------------.
| gui --------|-------->|          |  |  |                 |
|             |         |   label--'  |  |BlackBox contains|
|             |---------|-> quote ----|->|String, listener |
|             |         |             |  | receives        |
|             |         |             |  | ActionEvents    |
|             |<--------|-- applet    |  | events          |
|             |      ,--|-- listener  |  |                 |
|-------------|      |  |-------------|  |-----------------|
| init()      |      |  | init()      |  |method that calls|
| update_label|      |  | update_label|  |                 |
|             |      |  | (String)    |  |addActionListener|
|             |      |  | get_quote() |  |(listener)       |
`----.--------'      |  `-------------'  `---.-------------'
     ^               V                       |
     |        ,------------------.           |
     `--------|-listening_applet |<----------'
              |------------------|
              | actionPerformed  |
              `------------------'
             Mimic_Action_Listener
                  | implements
                  V interface
    java.awt.event.ActionListener

TextField: Thread 2

When a newline character is entered in TextField quote.actionPerformed(ActionEvent) is called beginning the sequence that updates the label component

Class                 Object calls Method
-----                 ------ ------------
TextField            [quote] actionPerformed(ActionEvent)
Mimic_Action_Listener applet update_label()
Mimic                 gui    get_quote()
Mimic_GUI             quote  getText()
Mimic                 gui    update_label(String)
Mimic_GUI             label  setText(String)

Event Interfaces Appendix O page 663



EventObject <-- AWTEvent <-- Event classes

Event Class	Listener Interface Methods implemented	Association	Generated by Component Class
ActionEvent	interface ActionListener actionPerformed(ActionEvent)	addActionListener	Button List TextField
AdjustmentEvent	interface AdjustmentListener adjustmentValueChanged(AdjustedEvent)	addAdjustmentListener	Scrollbar

Thread two in Event-Driven Programming

              output  ,-----.
                ,---->| GUI |
no             /      `-----'
input,--------/    _____.<-----------.
 o---| applet |<--|queue|<----.      |
     `--------'   `-----'     |      |
      |  |  ,---------.   ,--------. |
      |  `->|component|-->|listener| |
input |     `---------'   `--------' |
      |     ,---------.   ,--------. |
      `---->|component|-->|listener|-'
            `---------'   `--------'

input Actions include keystrokes,
mouse movements, mouse keystrokes

Components and Containers

Components provide

• drawing support
• event handling
• image handling
• control of color and fonts
• GUI components are defined in java.awt.

Containers

• Containers are special components that group other containers together.
• an applet and a panel are containers
• Panel and Applet must be attached to another graphical surface
  • applets are attached to Web browser or applet viewers
  • panels must be added to another container to be displayed
• component add method puts a GUI component into one container
• Window, Frame and Dialog objects create their own ``floating'' surface and can be moved with the mouse pointer

Components Hierachies

• containers can be added to containers
• using the ``add'' method, Hierachies
  of Components are formed.
• See Rings_Display program
• using the Rings class which extends
  Canvas forces the user to define methods
  minimumSize and preferredSize
• the arrangement of components added to the applet is decided by the layout
  manager

GUI Components

Labels

• Constructors
  • Label(), Label(String), Label(String,int)
• Methods
  • void setText (String)
  • void setAlignment (int)
  • String getText()
  • int getAlignment()

TextFields and TextAreas extend
TextComponent

• Constructors
  • TextFields(), TextFields(int), TextFields(String), TextFields(String,int)
  TextArea constructors are similar but also specify number of lines as well as width of lines
• Methods inherited from TextComponent
  • void setText (String)
  • String getText()
  • String getSelectedText()
  • void setEditable (boolean)
  TextArea also has method
• void append (String)

Lists Selectable list labeled with Strings

Buttons

• Four different Button types:
  • Push, single button
  • Choice, choose from list
  • Checkbox, toggle button
  • Radio, single button, displays a list when pressed
• Constructors
  • Button()
  • Button(String)
• Methods
  • void addItem(String)
  • int getItemCount()
  • String getItem(int)
  • int getItem()
  • String getSelectedItem()
  • void select(int)
  • void select(String)

Scrollbars - See Zoom class

• to position objects and set values from a range
• Constructors
  • Scrollbar()
  • Scrollbar(int orientation)
  • Scrollbar(int orientation, value, visible, minimum, maximum)
• Methods
  • void setUnitIncrement(int)
  • void setBlockIncrement(int)
  • void setValue(int value)
  • void setValues(int value, visible, minimum, maximum)
  • int getUnitIncrement()
  • int getBlockIncrement()
  • int getValue()
  • int getMinimum()
  • int getMaximum()
  • int getOrientation()
  • int getVisibleAmount()

Zoom Source

Layout Managers

• Flow Layout - default for Panel and Applet
• Border Layout - north, south, east, west
• Card Layout - deck one displayed at a time
• Grid Layout - matrix of rows and columns of equal size
• Grid Bag Layout - like Grid but allows spanning of multiple rows and columns

setLayout(new FlowLayout());

The Flow Applet:

WIDTH=300 HEIGHT=150	WIDTH=150 HEIGHT=150

Flow Source

The Grid Applet:

300 x 150	200 x 150

Grid Source

The Border Applet:

doesn't work

Border Source

The Card Applet:

doesn't work

Card Source

The Grid_Bag Applet:

Grid_Bag Source

• Lecture 10 ...