GUI - PowerPoint PPT Presentation

1 / 56
About This Presentation
Title:

GUI

Description:

Checkbox cb = new Checkbox('...'); somePanel.add(cb) ... Each JRadioButton is added to a ButtonGroup so the group behaves as a set of radio buttons. ... – PowerPoint PPT presentation

Number of Views:62
Avg rating:3.0/5.0
Slides: 57
Provided by: Alv84
Category:
Tags: gui | cb | radio

less

Transcript and Presenter's Notes

Title: GUI


1
GUI
  • Graphical User Interface

2
Outline
  • Introduction
  • Packages
  • Components
  • Layout Manager
  • Events and Listeners
  • Examples

3
Introduction
4
Definition
  • Abbreviated GUI (pronounced GOO-ee).
  • Program interface that takes advantage of the
    computer's graphics capabilities to make the
    program easier to use.
  • User interface based on graphics (icons and
    pictures and menus) instead of text uses a mouse
    as well as a keyboard as an input device.
  • Includes standard formats for representing text
    and graphics.

5
History
  • Douglas Engelbart's Augmentation of Human
    Intellect project at SRI in the 1960s developed
    the On-Line System, which incorporated a
    mouse-driven cursor and multiple windows.
  • The first GUI was designed by Xerox Corporation's
    Palo Alto Research Center in 1973.
  • Features 3-button mouse, bit-mapped display,the
    use of graphical windows, ethernet network.
  • Macintosh team at Apple Computer (included
    members of the Xerox PARC group) continued to
    develop such ideas in the first commercially
    successful product to use a GUI, the Apple
    Macintosh, released in January 1984.
  • One reason for their slow acceptance require
    considerable CPU power and a high-quality monitor.

6
Java GUI
  • GUI frameworks
  • Part of Java Foundation Classes (JFC)
  • Two important packages
  • Abstract Window Toolkit (AWT). Provides the basic
    support for building GUIs.
  • Swing. Extension of AWT, provides extensive
    support for building high-quality GUIs.
  • Components, also known as widgets, are the
    building blocks of the visual aspect.
  • Each GUI is characterized by its visual
    appearance and its behavior pattern in response
    to user input.

7
Packages
8
Abstract Window Toolkit
9
What is it?
  • Is a GUI toolkit that is supplied with all Java
    systems.
  • Provides the basic support for building graphical
    user interfaces using components
  • Java.awt provides the classes for the interfaces
  • AWT is designed to be portable and work across
    multiple platforms

10
Component Class
  • Components represents something that has a
    position and size and can be painted on the
    screen and receive input events. 
  • Component subclasses of the Component class.
  • Two types
  • Primitive components components that do not
    contain other components.
  • Containers contain other primitive components
    and containers.

11
Container Class
  • A container is a type of component that provides
    a rectangular area within which other components
    can be organized by a layout manager.
  • Container IS-A Component so a Container can go
    inside another Container
  • Some subclasses of container class are
  • Dialog window that takes input from a user
  • Window borderless and titleless top-level window
  • Frame Top-level window with a title and a border.

12
Swing Package
  • Built on top of Abstract Windows Toolkit (AWT)
  • Subclass of the Component class
  • Subclass of Container class

13
What does it do?
  • Provides components to communicate with user
  • Input from keyboard or mouse
  • Output to console
  • Similar to AWT but enhanced

14
Disadvantages of AWT
  • Poor performance
  • Lack of sophistication
  • Heavyweight
  • Looks determined by Platform

15
Benefits of Swing
  • Pluggable look and feel
  • Constant look and behavior
  • Eliminates overhead
  • Lightweight
  • Improved components
  • More robust

16
Components
17
AWT Components
18
Swing Components
19
Components
  • Buttons
  • Checkboxes
  • Radio buttons
  • Combo boxes (drop down menus)
  • Textfields
  • Labels

20
  • The Button class creates pushbuttons with text
    labels.
  • Button button new Button("...")
    add(button)
  • A JButton can be instantiated and used in a GUI
    just like a java.awt.Button.
  • JButton myButton new JButton("Tiger")
    add(myButton)

21
Checkboxes
  • Checkboxes are toggle buttons that operate
    independently of other checkboxes or can be put
    into a group so that they operate like radio
    buttons.
  • Checkbox cb new Checkbox("...")
    somePanel.add(cb)
  • JCheckBox is similar to an AWT Checkbox that is
    not in a CheckboxGroup.
  • JCheckBox cb1 new JCheckBox("Choose Me", true)


22
Radio Buttons
  • In AWT, radio buttons are checkboxes that belong
    to the same CheckboxGroup which ensures that
    only one checkbox is selected at a time.
  • CheckboxGroup cbGroup new CheckboxGroup()
    Checkbox cb1 new Checkbox("...", cbGroup,
    true)
  • add(cb1)
  • Each JRadioButton is added to a ButtonGroup so
    the group behaves as a set of radio buttons.
  • ButtonGroup rbg new ButtonGroup()
  • radioButton new JRadioButton("45,000")
  • add (radioButton)


23
Combo Boxes
  • Choice produces pull-down menus with a single
    selection showing, the other options get
    displayed when the user clicks with the mouse.
  • Known as "combo boxes," "drop-down list boxes,"
    or "option menus.
  • Choice choice new Choice()
  • choice.addItem("...")
  • choice.addItem("...") ...
  • somePanel.add(choice)
  • JComboBox works like AWT's Choice component
  • JComboBox combo1 new JComboBox()
  • combo1.addItem (Mercury)

24
TextFields
  • Textfields create boxed areas to display and/or
    read a single line of text. (TextArea can display
    multiple lines, but no ActionEvent).
  • Java textfields do not permit mixed fonts or
    colors within a single textfield.
  • TextField lastNameField new TextField(15)
    add(lastNameField)
  • JTextField behaves very similarly to AWT
    TextField.
  • JTextField tf new JTextField()
    tf.setText("TextField")

25
Labels
  • Simple textual displays, without any associated
    actions.
  • Label label new Label("...") add(label)
  • A JLabel is a single line label similar to
    java.awt.Label.
  • Additional functionality that a JLabel has is the
    ability to
  • Add an Icon
  • Set the vertical and horizontal position of text
    relative to the Icon
  • Set the relative position of contents within
    component
  • JLabel plainLabel new JLabel("Plain Small
    Label")

26
Layout Manager
27
What it is
  • It allows to format components on the screen in
    a platform-independent way.
  • LayourtManager interface
  • Programs with a consistent and reasonable
    appearance

28
Flow Layout
  • Default layout for the Panel class.
  • Components adjust to fit screen.
  • Components flow change based upon the new width
    and height.

29
To create a Flow Layout
  • Three constuctors
  • FlowLayout(align, hGap,vGap) Creates a flow
    layout with the alignment set to align and the
    horizontal and vertical gaps.
  • FlowLayout(align)- creates a flow layout with the
    given aligh and the horizontal and vertical gaps
    set to the default value
  • FlowLayout() creates a flow layout with the
    align, horizontal and vertical gap set to the
    default value.

30
Example
31
Grid Layout
  • What is it and what does it do
  • Layout manager that arranges components in a
    rectangular grid
  • All components given same size
  • Components can be stretched vertically and
    horizontally

32
Implementation
  • Constructors
  • GridLayout (r,c,hGap,vGAp)
  • Creates a grid layout manager with r rows and c
    columns and with the horizontal and vertical gaps
    set to hGap and vGAp
  • GridLayout (r,c)
  • Creates a grid layout manager with r rows and c
    columns and with the horizontal and vertical gaps
    set to 0
  • GridLayout ()
  • Creates a grid layout manager with a single row
    and with the horizontal gap set to 0

33
Examples
34
Border Layout
  • What it is and what it does
  • Layout manager that arranges as many as five
    components in five positions identified as
    North,South,East, and Center
  • Can be stretched vertically or horizontally to
    fill the space between components

35
Constructors
  • BorderLayout (hGap, vGap)
  • Creates a border layout manager with the
    horizontal and vertical gaps set to hGap and vGap
  • BorderLayout ()
  • Creates a border layout manager with the
    horizontal and vertical gaps set to 0

36
Examples
37
Events and Listeners
38
Events and Listeners
  • Events occur when the user interacts with the
    GUI.
  • Listeners are used to respond to the event
  • Each kind of Event is related to is own Listener

39
Events
  • The user can interact with the Gui in some
    different ways
  • with the mouse
  • with the keyboard
  • with a button
  • others

40
Listeners
  • Listen the information of the event and respond
    to it
  • Different mechanisms of adding listeners
  • part of the class defining Gui
  • inner class
  • separate class
  • anonymous local class

41
Types of Events and Listeners
  • ActionEvent ? ActionListener
  • KeyEvent ? KeyListener
  • MouseEvent ? MouseListener

42
ActionEvent
  • ActionEvent occurs when the user clicks a button,
    choose a menu item or press Enter in a Text file.
  • Methods
  • String getActionCommand()
  • Int getModifiers()
  • Object getSource()

43
ActionListener
  • ActionListener is used to respond to ActionEvent
  • Methods
  • actionPerformed(ActionEvent)

44
KeyEvent
  • KeyEvents occur when the user type at the
    keyboard.
  • Methods
  • int getKeyChar()
  • int getKeyCode()
  • String getKeyText()
  • others.

45
KeyListener
  • KeyListener is used to respond KeyEvents
  • Methods
  • keyTyped(KeyEvent)
  • keyPressed(KeyEvent)
  • keyReleased(keyEvent)

46
MouseEvent
  • MouseEvent occurs when the user uses the mouse to
    interact with a component.
  • Methods
  • getClickCount()
  • getX()
  • getY()
  • Others.

47
MouseListener
  • MouseListener is used to respond to MouseEvents
  • Methods
  • mouseClicked(MouseEvent)
  • mousePressed(MouseEvent)
  • mouseReleased(MouseEvent)
  • mouseEntered(MouseEvent)
  • mouseExited(MouseEvent)

48
Examples
49
Examples
  • Bouncing Ball
  • Ball (mouse)
  • Digital Note
  • Word Finder

50
Bouncing Ball (Framework)
51
Bouncing Ball (Code)
52
Ball (mouse)
53
Ball (mouse)
  • public boolean mouseDown (Event e, int x, int y)
  • x_speed - (x_speed)
  • return true

54
Word Finder
55
Digital Note
56
Questions?
Write a Comment
User Comments (0)
About PowerShow.com