1. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets1 Chapter 9 Graphical User Interfaces and Applets

2. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets2 Java GUIs The Java SDK contains to different Graphical User Interfaces (GUIs) –The Abstract Windowing Toolkit (AWT), which contained the original Java GUI –The Swing package, which is a newer, more flexible Java GUI Only the Swing GUI is taught in this text

3. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets3 How GUIs Work GUIs provide a user with a familiar environment in which to work, with push buttons, menus, drop- down lists, text fields, etc. GUI-based programs are harder to program, since they must be ready for mouse clicks or keyboard input to any component at any time Mouse clicks or keyboard inputs are known as events, and GUI-based programs are event-driven

4. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets4 How GUIs Work (2) A GUI consists of: –GUI Components, which represent elements on the screen such as push buttons, text fields, etc. –A Container to hold the components. The containers in this chapter are JPanel and JFrame. –A Layout Manager to control the placement of GUI components within the container. –Event handlers to respond to mouse clicks or keyboard inputs on any component or container in the GUI

5. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets5 Creating and Displaying a GUI To create a GUI: –Create a container class to hold the GUI components –Select and create a layout manager for the container –Create components and add them to the container –Create “listener” objects to detect and respond to the events expected by each GUI component –Register the listeners with appropriate components –Create a JFrame object, and place the completed container in the center of content pane associated with the frame.

6. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets6 Creating and Displaying a GUI (2) Required packages Set layout manager Create GUI in init method Create GUI components Method (s) to implement actions Add listener for button

7. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets7 Creating and Displaying a GUI (3) Create JFrame Add GUI to JFrame Create and add window listener Define listener class for pushbutton main method, so the program starts here Method init called here, so GUI created here

8. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets8 Creating and Displaying a GUI (4) Result after three mouse clicks on the button:

9. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets9 Events and Event Handling An event is an object that is created by some external action (mouse click, key press, etc.) When an event such as a mouse click occurs, Java automatically sends that event to the GUI object that was clicked on. When the event is received by the GUI object, the object checks to see if any listener object has registered with it to receive the event, and it forwards the event to the actionPerformed method of that object.

10. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets10 Events and Event Handling (2) The actionPerformed method is known as an event handler because it performs whatever steps are required to process the event. In many cases, the event handler makes a call to a callback method in the object that created the GUI, since such methods can update instance variables within the object directly –In the previous example, class ButtonHandler was a listener, its method actionPerformed was an event handler, and method updateLabel was a callback method

11. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets11 Events and Event Handling (3) In the previous example: –A mouse click on the button creates an event –The event is sent to the JButton object –The JButton object sends the event to the action- Performed method of the ButtonHandler object –That method calls the method updateLabel (callback) –updateLabel updates the label

12. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets12 The JLabel Class A label is an object that displays a single line of read-only text and/or an image. –It does not respond to mouse clicks or keyboard input. Constructors: public JLabel(); public JLabel(String s); public JLabel(String s, int horizontalAlignment); public JLabel(Icon image); public JLabel(Icon image, int horizontalAlignment); public JLabel(String s, Icon image, int horizontalAlignment); These constructors create a label containing text s, image image, or both

13. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets13 The JLabel Class (2) Methods:

14. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets14 Example: The JLabel Class

15. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets15 The JButton Class The JButton class creates a pushbutton. –When a mouse clicks on a button, an ActionEvent is generated and passed to any registered listeners. Constructors: public JButton(); public JButton(String s); public JButton(Icon image); public JButton(String s, Icon image); These constructors create a pushbutton containing text s, image image, or both

16. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets16 Example: Creating Buttons

17. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets17 ActionEvent Events JButton s generate ActionEvent objects when an event (mouse click) occurs on them. A listener class for these events must implement the ActionListener interface, and have an action- Performed method. An listener object must be registered to listen for ActionEvent s on each button. When a mouse click occurs, the actionPerformed method of the corresponding listener object will be called to handle the event

18. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets18 The JTextField Class The JTextField class creates a text field. –When a user types text and presses the ENTER key, an ActionEvent is generated and passed to any registered listeners. Constructors: public JTextField(); public JTextField(int cols); public JTextField(String s); public JTextField(String s, int cols); These constructors create a text field containing a blank space large enough for cols characters, the text string s, or both

19. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets19 The JPasswordField Class The JPasswordField class is identical to the JPasswordField class, except the text typed into the field is not visible. Instead, a string of asterisks are shown to represent the characters typed. Constructors: public JPasswordField(); public JPasswordField(int cols); public JPasswordField(String s); public JPasswordField(String s, int cols);

20. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets20 Example: Creating Text Fields

21. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets21 The JComboBox Class The JComboBox class field in which a user can either type text or select a choice from a drop down list of options. Constructors: public JComboBox(); public JComboBox( Object[] ); public JComboBox( Vector ); These constructors create a combo containing list of choices from the Object or Vector A user can be forced to select from the drop down list only using the method setEditable(false)

22. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets22 Example: Creating Combo Boxes

23. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets23 The JCheckBox Class The JCheckBox class creates a special type of button that toggles between “on” and “off” each time it is clicked. It looks like a small box with a check mark, but it is really a full-fledged button Selected Constructors: public JCheckBox( String s, boolean state ); public JCheckBox( Icon image, boolean state ); public JCheckBox( String s, Icon image, boolean state ); These constructors create a check box containing text s, image image, or both, in initial state state

24. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets24 Example: Creating Check Boxes

25. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets25 The JRadioButton Class The JRadioButton class creates a radio button, a small circle with a dot in the center when “on”. Selected Constructors: public JRadioButton( String s, boolean state ); public JRadioButton( Icon image, boolean state ); public JRadioButton( String s, Icon image, boolean state ); These constructors create a radio button containing text s, image image, or both, in initial state state

26. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets26 Button Groups Radio buttons are grouped together into groups known as button groups. Only one button within a group may be on at any time. If one is turned on, the other radio buttons in the group will be forced off Constructor: public ButtonGroup(); Methods: public void add(AbstractButton b); // Add button to group public void remove(AbstractButton b); // Remove from group

27. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets27 Example: Creating Radio Buttons ButtonGroup ensures that the 4 radio buttons are mutually exclusive

28. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets28 Layout Managers Layout managers are classes that control the location of components within a container

29. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets29 BorderLayout Layout Manager The BorderLayout layout manager arranges components in five regions, known as North, South, East, West, and Center Constructors: public BorderLayout(); public BorderLayout(int horizontalGap, int verticalGap); A layout manager is associated with a container using the container’s setLayout method: setLayout( new BorderLayout() ); Components are added to specific regions with a special option of the container’s add method: add(new Button("North"), BorderLayout.NORTH); Default layout manager for JFrame

30. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets30 Example: Creating a BorderLayout

31. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets31 FlowLayout Layout Manager The FlowLayout layout manager arranges com- ponents in order from left to right and top to bottom across a container Constructors: public FlowLayout(); public FlowLayout(int align); public FlowLayout(int align, int horizontalGap, int verticalGap); The alignment can be LEFT, RIGHT, or CENTER Default layout manager for JPanel

32. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets32 Example: Creating a FlowLayout

33. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets33 GridLayout Layout Manager The GridLayout layout manager arranges components in a rigid rectangular grid structure. Constructors: public GridLayout(int rows, int cols); public GridLayout(int rows, int cols, int horizGap, int vertGap); Components are added to the grid in order from left to right and top to bottom

34. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets34 Example: Creating a GridLayout

35. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets35 BoxLayout Layout Manager The BoxLayout layout manager arranges components within a container in a single row or a single column. The spacing and alignment of each element on each row or column can be individually controlled. Containers using BoxLayout managers can be nested inside each other to produce complex layouts Constructor: public BoxLayout(Container c, int direction); The direction can be X_AXIS or Y_AXIS Rigid areas and glue regions can be used to space out components within a BoxLayout

36. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets36 Example: Creating a BoxLayout

37. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets37 Combining Layout Managers to Produce a Result To create just the look you want, it is sometimes useful to create multiple containers inside each other, each with its own layout manager For example, a top-level panel might use a horizontal box layout, and that panel may contain two or more panels using vertical box layouts The result is complete control of component spacing in both dimensions

38. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets38 Example: Nested Containers and Layouts Structure: Result:

39. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets39 Applets An applet is a special kind of Java program that is designed to run inside a Web browser –It is a subclass of javax.swing.JApplet –The JApplet class is similar to JFrame, in that components must be attached to its content pane –The JApplet class is similar to JPanel, in that the default layout is FlowLayout Applets are usually restricted from accessing computer resources (files, etc.) on the local computer for security reasons

40. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets40 Applet Methods Every applet has 5 standard methods: –init — called by the browser when the applet is first loaded into memory –start — called by the browser to start animations running when the applet is made visible –stop — called by the browser to stop animations running when the applet is covered or minimized –destroy — called by the browser just before the applet is destroyed –paintComponent — called when the applet is drawn or re-drawn

41. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets41 Applet Methods Applet methods will always be called in the order init, start, stop, destroy start and stop may be called many times during the life of an applet All 5 methods are implemented as dummy methods in class JApplet, and the dummy methods are inherited by all applets Applets override only the methods that they need to perform their function

42. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets42 Creating an Applet To create an applet: –Create a subclass of JApplet to hold GUI components –Select a layout manager for the container, if the default layout manager ( FlowLayout ) is not acceptable –Create components and add them to the content pane of the JApplet container. –Create “listener” objects to detect and respond to the events expected by each GUI component, and assign the listeners to appropriate components. –Create an HTML text file to specify to the browser which Java applet should be loaded and executed

43. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets43 Example: Creating an Applet This simple applet implements init and inherits all other methods as dummies Note that all components are added to the ContentPane of the JApplet

44. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets44 Example: Creating an Applet (2) Listener class for button on applet HTML code to start applet in browser

45. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets45 Location of Class Files for Applets If an applet uses a class that is not built into a package, that class must be present in the same directory as the HTML file used to start the applet –This directory could be local or remote—it doesn’t matter –Class files can be transferred over the net, so they should be small

46. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets46 Using Packages with Applets If an applet uses non- standard package, then the package must appear in the appropriate subdirec- tory of the directory containing the HTML file. –This directory could be local or remote—it doesn’t matter –CLASSPATH is ignored by applets! Location of class chapman.io.Fmt within package chapman.io

47. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets47 Creating Dual Application / Applets If an application does not need to perform I/O or other restricted tasks, it can be structured to run both as an applet and an application –Design the program as an applet –Add a main method with calls to init and start –Add calls to stop and destroy in the windowClosing method of the Window handler Such program can be more versatile

48. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets48 Dual Application / Applet init method in applet

49. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets49 Dual Application / Applet (2) main method calls init and start

50. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets50 Dual Application / Applet (3) windowClosing method calls stop and destroy

51. Introduction to Java Chapter 9 - Graphical User Interfaces and Applets51 Dual Application / Applet (4) Running as applicationRunning as applet