1. 1 Unit 5 GUI Aum Amriteshwaryai Namah

2. 2 Overview Shall learn how to reuse the graphics classes provided by Java for constructing Graphical User Interface (GUI) applications. Event Driven Programming Java API for GUI – java.awt and java.swing.

3. 3 Java APIs for GUI There are two sets of Java APIs for GUI programming: – AWT (Abstract Windowing Toolkit) and Swing. AWT APIs were introduced in JDK 1.0. – Swing APIs, a much more comprehensive set of graphics libraries that enhances the AWT counterparts, has been integrated into core Java since JDK 1.2. These provide a huge set of reusable GUI components, such as button, text field, label, choice, panel and frame for building GUI applications.

4. 4 Sample GUI using AWT

5. 5 Container vs. Component

6. 6 Two groups of classes are involved in a GUI program: – Component classes: Components are elementary UI entities such as buttons, labels, text fields, and check boxes. – Container classes: Containers, such as frames and panels, are used to hold UI components. A container can also hold containers. Container vs. Component

7. 7 It is important to note that in a GUI program: a component must be kept in a container. You need to identify the container and component. Every container has a method called add(Component c). E.g.:- A container (says aContainer) can invoke aContainer.add(aComponent) to add aComponent into itself. Container vs. Component

8. 8 Frame & Panel Frame is the top-level container of an AWT GUI program. Frame has a title bar (containing program icon, title, minimize, maximize/restore-down and close buttons), an optional menu bar and program display area. Panel is an invisible rectangular box used to group related UI component. I

9. 9 AWT Container Classes A GUI program must begin with a top-level container. The commonly-used top-level containers in AWT are Frame, Dialog and Applet. An AWT Frame is a "window”

10. 10 AWT Container Classes An AWT GUI program is usually written as a subclass of java.awt.Frame class. An AWT Dialog is a pop-up window used for interacting with the users. A Panel is an invisible retangular box under a higher-level container, used to group and layout a set of related UI components

11. 11 Hierarchy of the AWT Container classes

12. 12 Component classes AWT provides many ready-made and reusable UI components. The frequently-used are: Button, TextField, Label, Checkbox, CheckboxGroup (radio buttons), List, and Choice

13. 13 Component creation Three steps are necessary to create and place a UI component: – Declare the component with an identifier; – Construct via new operator and invoke the chosen constructor; – Identify the container (such as Frame or Panel) designed to hold this component. The container can then add this component into itself via aContainer.add(aComponent) method. Every container has a add(Component) method.

14. 14 Designing GUI GUI components are associated with events. Separate the program GUI classes from the program processing classes. – Use one class to present the graphics, – another class to process the data/user input, – and one class to handle the events that occur with user interaction.

15. 15 Java APIs for GUI The Java API provides a rich selection of classes to create the visual elements of a GUI and its functional facilities. This part explores the AWT and the Swing API of classes.

16. 16 Java APIs for GUI There are two sets of Java APIs for GUI programming: – AWT (Abstract Windowing Toolkit) and Swing. AWT APIs were introduced in JDK 1.0. (java.awt and javax.swing) – Swing APIs, a much more comprehensive set of graphics libraries that enhances the AWT counterparts, has been integrated into core Java since JDK 1.2. These provide a huge set of reusable GUI components, such as button, text field, label, choice, panel and frame for building GUI applications.

17. 17 GUI components Components form a major part of a GUI. Java components are pre-defined standard elements such as buttons, text-fields, frames, windows, labels, scrollbars, menus, menu items, text areas, and dialog boxes. The display space on the screen is also a component.

18. 18 GUI components Like all GUI-based applications, the Java display space is a window. Some windows have additional graphics features and are known as frame windows. Frame windows have a title, a border, and buttons for closing, minimizing, and maximizing the window.

19. 19 GUI components Some components are used to hold other components. For example, a dialog box can hold a label and a button. A window can hold a dialog box and other buttons and components. Components that can hold other components are called containers.

20. 20 AWT & Swing packages These contain all of the classes for creating user interfaces and for painting graphics and images. A user interface object such as a button or a scrollbar is called a component.

21. 21 AWT & Swing packages The Component class is the root of all AWT components. All AWT components share the properties described in the Component class.

22. 22 AWT & Swing packages A container is a component that can contain components and other containers. A container usually has a layout manager that controls the visual placement of components in a container. The AWT package contains several layout manager classes

23. 23 Class Hierarchy

24. 24 Container vs. Component

25. 25 It is important to note that in a GUI program: a component must be kept in a container. You need to identify the container and component. Every container has a method called – add(Component c). E.g.:- A container (says aContainer) can invoke aContainer.add(aComponent) to add aComponent into itself. Container vs. Component

26. 26 Java API – Graphics class The Graphics class has methods to draw lines, rectangles, and ovals as basic shapes. From these basic shapes, a programmer can create many complex graphics. GUI components are drawn on the screen using Graphics objects as well as the paint, repaint, and update methods. The Applet class also uses these methods to display the applet graphics in a browser window.

27. 27 Common AWT Components A component is an object having a graphical representation that can be displayed on the screen and that can interact with the user. Examples: buttons, checkboxes, and scrollbars of a typical graphical user interface. The Component class is the abstract superclass of the Abstract Window Toolkit components. The basic steps involved in using a GUI component are: 1.The component object must be created with a constructor. 2.It must be added to a container.

28. 28 Button A Button component creates a labeled button. An object of class Button is a push button. The application can cause some action to happen when the button is pushed. The gesture of clicking on a button with the mouse is associated with one instance of ActionEvent The constructor of Button class: Button(String label)

29. 29 Example: Button Button quitButton = new Button(“Quit”); setLabel() and getLabel(): Sets and gets the label associated with the button.

30. 30 Label A Label component is a single line of text. The text cannot be edited by the user, although it can be changed by your program. A Label class has two main constructors: 1. Label name = new Label(“John"); //This Label constructor displays the given text. 2.Label name = new Label(“John", Label.CENTER); //creates a label whose text is centered in the available space. getText() and setText(): Sets and gets the text for the label. name.setText(“Harry");

31. 31 Example: Label setLayout(new FlowLayout(FlowLayout.CENTER, 10, 10)); add(new Label("Hi There!")); add(new Label("Another Label")); (From Java API Docs)

32. 32 Standard Component methods comp.setBackground(color) and comp.setForeground(color) : Sets the background and foreground colors for the component. If no colors are set for a component, it inherits the colors of its parent container. comp.setFont(font): Sets the font for the component. That font is used to display text on the component. comp.getSize(): Returns the size of the component in the form of a Dimension object. When a component is first created, its size is zero. The size will be set later, probably by a layout manager.

33. 33 comp.getParent(): Returns the parent Container of the component. For a top-level component such as a Window or Applet, the return value will be null. comp.getLocation() : Gets the location of this component in the form of a point specifying the component's top-left corner. The location will be relative to the parent's coordinate space. comp.isEnabled(): Determines whether the component is enabled. An enabled component can respond to user input. Components are enabled initially by default. comp.setVisible(boolean b): Shows or hides the component depending on the value of parameter b. If true, shows the component; otherwise, hides the component.

34. 34 AWT Container Classes A GUI program must begin with a top-level container. The commonly-used top-level containers in AWT are Frame, Dialog and Applet. An AWT Frame is a "window”

35. 35 AWT Container Classes An AWT GUI program is usually written as a subclass of java.awt.Frame class. An AWT Dialog is a pop-up window used for interacting with the users. A Panel is an invisible retangular box under a higher-level container, used to group and layout a set of related UI components

36. 36 Component creation Three steps are necessary to create and place a UI component: – Declare the component with an identifier; – Construct via new operator and invoke the chosen constructor; – Identify the container (such as Frame or Panel) designed to hold this component. The container can then add this component into itself via aContainer.add(aComponent) method. Every container has a add(Component) method.

37. 37 Event Handling GUIs are event driven – Generate events when user interacts with GUI e.g., moving mouse, pressing button, typing in text field, etc. Class java.awt.AWTEvent

38. 38 Event Handling Models Event Inheritance Delegation

39. 39 Some event classes of package java.awt.event Object EventObject AWTEvent ActionEvent AdjustmentEvent ItemEvent TextEvent ContainerEvent FocusEvent PaintEvent WindowEvent InputEvent MouseWheelEvent ComponentEvent KeyEvent MouseEvent Object EventObject AWTEvent ComponentEvent TextEvent ItemEvent AdjustmentEvent ActionEvent WindowEvent InputEvent MouseEventKeyEvent MouseWheelEvent FocusEvent PaintEvent ContainerEvent

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

41. 41 Event-listener interfaces of package java.awt.event interface EventListener interface ActionListener interface AdjustmentListener interface ComponentListener interface ContainerListener interface FocusListener interface ItemListener interface KeyListener interface MouseListener interface MouseMotionListener interface TextListener interface WindowListener «interface» EventListener «interface» ActionListener «interface» AdjustmentListener «interface» ComponentListener «interface» ContainerListener «interface» FocusListener «interface» ItemListener «interface» KeyListener «interface» MouseListener «interface» MouseMotionListener «interface» TextListener

42. 42 Event model Components that react to user input can generate events Events are objects that represent what happened Objects that are designed to process the event register as a listener with the event generator

43. 43 Events & listeners Event objects represent the event Subclass from java.awt.AWTEvent – ActionEvent, TextEvent, KeyEvent, InputEvent Objects designed to process events are called handlers Handlers implement the appropriate listener interface Register with the event generator

44. 44 Listener classes Separate listener interface for each event type ActionListener, ItemListener, FocusListener, etc The class that will be receiving the event implements the appropriate listener The action is performed in the method specified by the interface

45. 45 Adapter classes Some listener interfaces include many methods To implement these interfaces the handler class must implement all these methods Java provides adapter classes, that implement empty methods The handler need only extend the adapter class and implement the method(s) of interest