Graphical User Interface Components: Part 1 Chapter 11

2 Graphical User Interface (GUI) Gives program distinctive “______________” Provides users with basic level of familiarity Built from GUI ________________ (controls, widgets, etc.) –User interacts with GUI component via mouse, keyboard, etc Check out this visual index of componentsvisual index

3 Netscape Window With GUI Components menu bar buttoncombo boxmenus scroll bars

4 Dialog Boxes Used by applications to interact with the user Provided by Java’s JOptionPane class –Contains input dialogs and message dialogs View example program, Figure 11.2Figure 11.2

5 Dialog Boxes Note icon Other icons available

6 Some Basic GUI Components

7 Overview Swing GUI components –Declared in package __________________ –Most are ____________ Java components –Part of the Java Foundation Classes (JFC) Abstract Window Toolkit (AWT) –___________________ to Swing –Declared in package java.awt –Does not provide consistent, cross-platform look- and-feel

8 Lightweight vs. Heavyweight Lightweight components –Not tied directly to ________________________ supported by underlying platform Heavyweight components –Tied directly to the ____________ platform –AWT components –Some Swing components

9 Superclasses of Swing’s Lightweight GUI Components Class Component –(package java.awt ) –______________________ of Object –Declares many behaviors and attributes common to GUI components

10 Superclasses of Swing’s Lightweight GUI Components Class Container –(package java.awt ) –Subclass of Component –_____________________ Component s

11 Superclasses of Swing’s Lightweight GUI Components Class JComponent –(package javax.swing ) –Subclass of Container –_________________ of all lightweight Swing components

12 Common Lightweight Component Features Pluggable look-and-feel –_______________ the appearance of components Shortcut keys –mnemonics Common ____________________ capabilities Brief description of component’s purpose –tool tips Support for _____________________

13 Displaying Text and Images in a Window Class JFrame –Most windows are an instance or subclass of this class –Provides _______________________ –Provides min, max, close ______________ Label –______________________ or information stating the purpose of each component –Created with class JLabel

14 Three Parts of a GUI Application 1.________________________ that make up the Graphical User Interface 2.________________ that receive the events and respond to them 3.____________________ that does useful work for the user

15 Events Generated by Swing Components Act that results in the eventListener type User clicks a button, presses Return while typing in a text field, or chooses a menu item User closes a frame (main window) WindowListener User presses a while the cursor is over a component MouseListener User over a component MouseMotionListener Component becomes visible ComponentListener Component gets the keyboard focus FocusListener Table or list selection changes ListSelectionListener

16 Events Generated by Swing Components Each __________ is represented by an object –Object gives information about the event –Identifies the event _________________. Event sources are typically _____________, –Other kinds of objects can also be event sources. Each event source can have _____________ listeners registered on it. –Conversely, a single listener can register with multiple event sources.

17 JLabel Label –Provide ________________ on GUI –Defined with class JLabel –Can display: Single line of read-only text __________________________ Text and image View Figure 11.6Figure 11.6 –Note uses of the JLabel Class

18 Creating and Attaching label1 label1 Method setToolTipText of class JComponent –Specifies the tool tip Method add of class Container –Adds a _________________ to a container

19 Creating and Attaching label2 label2 Interface Icon –Can be added to a ________________ with the setIcon method –Implemented by class ImageIcon

20 Creating and Attaching label2 label2 Interface SwingConstants –Declares a set of ___________________________________ such as those used to set the alignment of components –Can be used with methods setHorizontalAlignment and setVerticalAlignment

21 Creating and Attaching label3 label3 Other JLabel methods –getText and ____________________ For setting and retrieving the text of a label –getIcon and setIcon For setting and retrieving the _______________ displayed in the label –getHorizontalTextPosition and setHorizontalTextPosition For setting and retrieving the horizontal position of the text displayed in the label

22 Some basic GUI Components.

23 Other JFrame MethodsMethods setDefaultCloseOperation –Dictates how the ____________________________ when the user clicks the close button setSize –Specifies the width and height of the __________ setVisible –Determines whether the window is displayed ( true ) or not ( false )

24 Event Handling An event occurs every time the user –________________ a character or –Pushes a _________________________ Any object can be ________________ of the event. That object must: –________________ the appropriate interface –Be registered as an event _____________ on the appropriate event source.

25 Event Handling GUI's are _______________ driven –Events occur when user interacts with GUI –e.g., moving mouse, pressing button, typing in text field, etc. Class java.awt.AWTEvent Checkout Sun tutorial on event handlingSun tutorial

26 Some Event Classes Of Package java.awt.event

27 Event Handling Model Three parts –Event _________________ GUI component with which user interacts –Event _________________ Encapsulates information about event that occurred –Event _________________ Receives event object when notified, then responds Programmer must perform two tasks –____________ event listener for event source –Implement event-handling method (event handler)

28 Event Listener Object When a GUI program is running, each action of the user generates an event The following are some types of events: –Moving the ______________ –Clicking the mouse on a button –______________ some text into a text area For a program to respond to an event there must be an ____________ object in the GUI program that listens to that type of event

29 What is an Event Listener? An event listener is an _____________ –It "listens" for events from a specific GUI component (itself an object) When an event is generated by the GUI component –A ____________ in the listener object is invoked to respond to the event

30 What If …? When there is no event ______________ for an event –A program can ____________ events –If there is no listener for an event, the event is just ignored

31 Event- listener Interfaces Of Package java.awt. event

32 Textfields JTextField –__________ area in which user can enter text JPasswordField –Extends JTextField –______________ characters that user enters View Figure 11.9Figure 11.9 –Illustrates capabilities of textfields –Note help on handling number fieldshelp

33 How Event Handling Works You must ______________ the event handler –Through component’s method addActionListener

34 How Event Handling Works The component knows to call actionPerformed because … –Event is _______________ only to listeners of appropriate type –Each event type has corresponding event-listener interface Event _____________ specifies event type that occurred

35 Event Registration for JTextField textField1

36 JButton Button –Component user clicks to trigger a specific action –Several different types Command ________________ Check ________________ Toggle buttons __________________ buttons –javax.swing.AbstractButton subclasses Command buttons are created with class JButton Generate __________________________ when user clicks button

37 Swing Button Hierarchy

38 JButton Example View, ButtonFrame class, Figure 11.15Figure Test program, Figure 11.16Figure Look for –Declaration of the buttons –Inner class ButtonHandler which does event handling for the button –Call to. addActionListener(handler) method registers buttons to receive events –The actionPerformed() method

39 Comments on JButton To detect when user clicks button –Program must have an _______________ that implements ActionListener interface Program must __________ object as an action listener on the button (the event source) –Using the addActionListener method

40 Comments on JButton When user clicks the button, it fires an action _________________. –Results in the invocation of the action listener's actionPerformed _____________ –The only method in the ActionListener interface JButtons can have a __________ icon –Appears when mouse is positioned over a button –Added to a JButton with method setRolloverIcon

41 Buttons That Maintain State Swing contains three types of ____________ buttons JToggleButton, JCheckBox and JRadioButton JCheckBox and JRadioButton are ______________ of JToggleButton

42 JCheckBox Contains a check box ______________ that appears to right of check box by default Generates an ItemEvent when it is ____________ –ItemEvent s are handled by an ItemListener –Passed to method _______________________ Method isSelected returns whether check box is selected ( true ) or not ( false ) View example class Figure test Figure 11.18Figure 11.17Figure 11.18

43 JRadioButton Has two states – selected and unselected Normally appear in a _____________ in which only one radio button can be selected at once –Group maintained by a ButtonGroup object Declares method add to add a JRadioButton to group Usually represents mutually ____________ options View RadioButtonFrame, Figure Test program, Figure 11.20Figure 11.19Figure 11.20

44 Demonstration of JRadioButton When viewing Figure 11.19, look for the followingFigure –Declaration of JRadioButton references –Group specification –Instantiation of JRadioButton objects –Registration of JRadioButton 's to receive events –RadioButtonHandler invokes method itemStateChanged

45 JComboBox –List of items from which user can select –Also called a drop-down list Note features in Figure 11.21Figure Instantiate JComboBox to show three Strings from names array at a time Register JComboBox to receive events ItemListener invokes method itemStateChanged

46 JList A list is a series of items –User can _____________ one or more items –Single-selection vs. multiple-selection JList demonstration, Figure 11.23Figure –Note use of ColorNames array to populate JList –Specification of SINGLE_SELECTION –Registration of JList to __________ events –ListSelectionListener invokes method valueChanged –Background set according to user choice

47 Multiple-Selection Lists Multiple-selection list capabilities –Select ______________ items from Jlist –Allows continuous _________ selection Look for the following in Figure 11.25Figure Use of ColorNames array –Specification of MULTIPLE_INTERVAL_SELECTION option –Use of JButton and JListCopyList method

48 Mouse Events Create a MouseEvent object Handled by MouseListeners and MouseMotionListeners MouseInputListener combines the two interfaces Interface MouseWheelListener declares method mouseWheelMoved to handle MouseWheelEvents

49 Mouse Event Handling Event-listener interfaces for mouse events –MouseListener –MouseMotionListener –Listen for MouseEvents In Figure note use of…Figure –Register JFrame to receive mouse events –Methods invoked for various mouse events (Note that program does not seem to perform as advertised when run under ReadyTo !!?)

50 Listener Interfaces

51 Listener Interfaces

52 Listener Interfaces Suppose your class directly implements MouseListener, –Then you ___________________ all five MouseListener methods. –Even if you care only about mouse clicks Methods for those events you don't care about can have ______________ bodies. –Resulting collection of empty method bodies can make code harder to read and maintain

53 Adapter Classes Solution is to use __________________ classes For example, the MouseAdapter class implements the MouseListener interface. An adapter class implements ____________ of all its interface's methods.

54 Adapter Classes To use an adapter –Create a ________________ of it, instead of directly implementing a listener interface. –By extending MouseAdapter, your class _________________ empty definitions of all five of the methods that MouseListener contains.

55 Adapter Classes Characteristics of an adapter class –_________________ interface –Provides ________________ implementation of each interface method –Used when all methods in interface is not needed

56 Adapter Classes Example of use of an adapter class –Figure 11.34, the Painter programFigure Note –Registration of MouseMotionListener to listen for window’s __________________ events –____________________ method mouseDragged, but not method mouseMoved –Store ________________ where mouse was dragged, then repaint JFrame

57 Extending MouseAdapter The MouseDetails.java program, Note example, Figure 11.31Figure Demonstrates –How to determine the __________ of mouse clicks –How to distinguish between _______________ mouse buttons

58 InputEvent Methods Help distinguish among –left-, –center- and –right-mouse-button clicks

59 Key Event Handling Interface KeyListener Handles key events –Generated when keys on keyboard are pressed and released KeyEvent –Contains ___________________ that represents key Demonstrated in Figure 11.36Figure 11.36

60 Layout Managers Layout manager capabilities –Provided for _________________ GUI components –Provide basic layout capabilities –Processes layout details –Programmer can concentrate on basic “look and feel” –Interface LayoutManager

61 Layout Managers Layout manager methods

62 FlowLayout _____________________ layout manager GUI components placed in container from _________ to ______________ Example program, Figure 11.39Figure –Layout set as FlowLayout –Note results as user presses button

63 BorderLayout Arranges components into five ___________ –NORTH (top of container) –SOUTH (bottom of container) –EAST (left of container) –WEST (right of container) –CENTER (center of container) View example, Figure 11.41Figure 11.41

64 GridLayout Divides container into grid of specified ___________________________ Components are added starting at top-left cell –Proceed left-to-fight until ____________ is full GridLayout demonstration, Figure 11.43Figure –Clicking buttons toggles between different layouts

65 Panels Helps organize components Class JPanel is ____________ subclass May have components (and other _____________) added to them Panel example, Figure 11.45Figure 11.45

66 Applying Concepts Suppose you wish to have a GUI which accomplishes the following –Enter numbers in text boxes –Press button to do calculations

67 Step By Step View code to create the windowcreate the window Note –Class (program) extends JFrame –Constructor sets up window using methods inherited from JFrame –Method main() instantiates class object

68 Add the Text Labels View additional codeadditional code Note –Declaration, instantiation of JLabels –Container reference, pane Gets handle for contentPane –pane layout specified –JLabels added

69 Add the Text Boxes View next iteration of code for adding the JTextFieldsnext iteration Note –Declaration, instantiation of JTextFields –Change grid layout of pane for 2 columns –Adding to pane

70 Final Version View final code versionfinal code Note –Declaration, instantiation of buttons –Declaration, definition, instantiation of action handlers Different author, does not use inner anonymous classes –Add action handlers to the buttons Our program never actually calls the action handlers

71 Implement an Event Handler Every event handler requires three bits of code: 1.Code that specifies that the class either 1.Implements a listener interface or 2.Extends a class that implements a listener interface. For example: public class MyClass implements ActionListener {… 2.Code that registers an instance of the event handler class as a listener upon one or more components. For example: someComponent.addActionListener(instanceOfMyClass); 3.Code that implements the methods in the listener interface. For example: public void actionPerformed(ActionEvent e) {...//code that reacts to the action... }