Objectives The objectives of this chapter are:

Slides:



Advertisements
Similar presentations
1 Graphical User Interface (GUI) Applications Abstract Windowing Toolkit (AWT) Events Handling Applets.
Advertisements

Introduction to Java 2 Programming
Java GUI building with the AWT. AWT (Abstract Window Toolkit) Present in all Java implementations Described in (almost) every Java textbook Adequate for.
Objectives The objectives of this chapter are: To discuss the classes present in the java.awt package To understand the inheritance hierarchy of the AWT.
Graphical User Interfaces
TCU CoSc Programming with Java Visual Design (Chapter 5)
Java Software Development Paradigm Lecture # 12. Basics of GUI.
AWT Components. 2 Using AWT Components 4 Component –Canvas –Scrollbar –Button –Checkbox –Label –List –Choice –TextComponent –TextArea –TextField 4 Component.
Graphic User Interfaces Layout Managers Event Handling.
CMSC 341 Building Java GUIs. 09/26/2007 CMSC 341 GUI 2 Why Java GUI Development? Course is about Data Structures, not GUIs. We are giving you the opportunity.
Corresponds with Chapter 12
Events and the AWT The objectives of this chapter are: To understand the principles of the Java 1.1 event model To understand how the event model is used.
Java Programming, 3e Concepts and Techniques Chapter 5 Arrays, Loops, and Layout Managers Using External Classes.
Swinging Into Swing Leo S. Primero III. Understanding what Swing Is Swing is a package that lets you create applications that use a flashy Graphical User.
Inheritance Review CSC 171 FALL 2004 LECTURE 19. READING Read Horstmann, Chapter 11 Look at Chapter 12 – Will not be on MT or Final – One lab Begin Reading.
Advanced Java Class GUI – part 1. Intro to GUI GUI = Graphical User Interface -- “Gooey” Just because it’s “gooey” does not mean you may write messy code.
1 GUI Elements in Java Nelson Padua-Perez Chau-Wen Tseng Department of Computer Science University of Maryland, College Park.
Chapter 13: Advanced GUIs and Graphics J ava P rogramming: From Problem Analysis to Program Design, From Problem Analysis to Program Design, Second Edition.
GUI and event-driven programming An introduction.
Java Programming Chapter 10 Graphical User Interfaces.
20-753: Fundamentals of Web Programming Copyright © 1999, Carnegie Mellon. All Rights Reserved. 1 Lecture 16: Java Applets & AWT Fundamentals of Web Programming.
Chapter 13 Advanced GUIs and Graphics. Chapter Objectives Learn about applets Explore the class Graphics Learn about the class Font Explore the class.
Java Software Solutions Lewis and Loftus Chapter 10 1 Copyright 1997 by John Lewis and William Loftus. All rights reserved. Graphical User Interfaces --
Java Programming: From Problem Analysis to Program Design, 4e Chapter 12 Advanced GUIs and Graphics.
CIS 068 Welcome to CIS 083 ! Introduction to GUIs: JAVA Swing.
Applets and Frames CS 21a: Introduction to Computing I First Semester,
Graphical User Interface CSI 1101 N. El Kadri. Plan - agenda Graphical components Model-View-Controller Observer/Observable.
Java Programming: Advanced Topics 1 Common Elements of Graphical User Interfaces Chapter 6.
MCA-401: ADVANCED JAVA PROGRAMMING 1DEPTT. OF COMP. SC & APPLICATIONS PREPARED BY : NAVEEN NAGPAL (SENIOR ASSISTANT PROFESSOR)
 2002 Prentice Hall, Inc. All rights reserved Introduction Graphical User Interface (GUI) –Gives program distinctive “look” and “feel” –Provides.
1 Outline 1 Introduction 2 Overview of Swing Components 3 JLabel 4 Event Handling 5 TextFields 6 How Event Handling Works 7 JButton 8 JCheckBox and JRadioButton.
Graphics and Event-Driven Programming in Java John C. Ramirez Department of Computer Science University of Pittsburgh.
Timer class and inner classes. Processing timer events Timer is part of javax.swing helps manage activity over time Use it to set up a timer to generate.
Java Applets: GUI Components, Events, Etc. Ralph Westfall June, 2010.
Applets and Frames. Copyright 2005, by the authors of these slides, and Ateneo de Manila University. All rights reserved L14: GUI Slide 2 Applets Usually.
The Abstract Window Toolkit (AWT) supports Graphical User Interface (GUI) programming. AWT features include: a rich set of user interface components; a.
SEEM3460 Tutorial GUI in Java. Some Basic GUI Terms Component (Control in some languages) the basic GUI unit something visible something that user can.
Csc Basic Graphical User Interface (GUI) Components.
Creating a Window. A basic window in Java is represented by an object of the class Window in the package java.awt.
Graphical User Interfaces Tonga Institute of Higher Education.
CSI 3125, Preliminaries, page 1 AWT. CSI 3125, Preliminaries, page 2 AWT Java AWT (Abstract Windowing Toolkit) is an API to develop GUI or window-based.
AWT Layout Managers (Chapter 10) Java Certification Study Group January 21, 1999 Mark Roth.
Graphical User Interfaces (GUI). PART ONE About GUI’s.
Chapter 10 - Writing Graphical User Interfaces1 Chapter 10 Writing Graphical User Interfaces.
Introduction to GUI in 1 Graphical User Interface 3 Nouf Almunyif.
Introduction to GUI Programming in Java: Frames, Simple Components, and Layouts.
AWT Vs SWING. 2 AWT (Abstract Window Toolkit) Present in all Java implementations Described in most Java textbooks Adequate for many applications Uses.
©TheMcGraw-Hill Companies, Inc. Permission required for reproduction or display. Chapter 7 Event-Driven Programming and Basic GUI Objects.
Chapter 9: Graphical User Interfaces
Christopher Budo, Davis Nygren, spencer franks, Luke miller
Aum Amriteshwaryai Namah
A First Look at GUI Applications
Course Outcomes of Advanced Java Programming AJP (17625, C603)
Java Swing.
Graphical User Interface (pronounced "gooey")
Abstract Window ToolKit (AWT)
Ellen Walker Hiram College
Chap 7. Building Java Graphical User Interfaces
Chapter 13: Advanced GUIs and Graphics
Graphical User Interfaces -- Introduction
Timer class and inner classes
AWT Components and Containers
GUI building with the AWT
Graphical User Interface
GUI building with the AWT
AWT Components Java AWT components are platform-dependent i.e. components are displayed according to the view of operating system. AWT is heavyweight i.e.
Advanced GUIs and Graphics
Graphical User Interface
Java Chapter 1 (Estifanos Tilahun Mihret--Tech with Estif)
Presentation transcript:

Objectives The objectives of this chapter are: To discuss the classes present in the java.awt package To understand the inheritance hierarchy of the AWT To outline the basic structure of GUIs To show how to add components to containers To understand how to use Layout Managers To understand basic graphics processing under the AWT

AWT (Abstract Windowing Toolkit) The AWT is roughly broken into three categories Components Layout Managers Graphics Many AWT components have been replaced by Swing components It is generally not considered a good idea to mix Swing components and AWT components. Choose to use one or the other.

AWT – Class Hierarchy Component Container Window Frame Button Panel List Checkbox Note: There are more classes, however, these are what are covered in this chapter Choice Label This slide shows the hierarchy of classes which will be covered in this chapter. If you check the Java API documentation, you will note that there are many more classes in the java.awt package. TextComponent TextField TextArea

Component Component is the superclass of most of the displayable classes defined within the AWT. Note: it is abstract. MenuComponent is another class which is similar to Component except it is the superclass for all GUI items which can be displayed within a drop-down menu. The Component class defines data and methods which are relevant to all Components setBounds setSize setLocation setFont setEnabled setVisible setForeground -- colour setBackground -- colour The Component class contains the common features to all items which can be displayed in a GUI. Often, these items are called “widgets”. In the AWT, all widgets are components and, as such, inherit all the data and methods of the Component class.

Container Container is a subclass of Component. (ie. All containers are themselves, Components) Containers contain components For a component to be placed on the screen, it must be placed within a Container The Container class defined all the data and methods necessary for managing groups of Components add getComponent getMaximumSize getMinimumSize getPreferredSize remove removeAll The Container class is an abstract class which encapsulates the logic for managing Components. Note that Containers are, themselves, Components which means that Containers can be placed within other Containers

Windows and Frames The Window class defines a top-level Window with no Borders or Menu bar. Usually used for application splash screens Frame defines a top-level Window with Borders and a Menu Bar Frames are more commonly used than Windows Once defined, a Frame is a Container which can contain Components Frame aFrame = new Frame(“Hello World”); aFrame.setSize(100,100); aFrame.setLocation(10,10); aFrame.setVisible(true); Generally speaking, the Window class is not used very often. The Frame class, on the other hand, is used quite extensively for GUI based applications. Another subclass of Window, which is not described here, I the Dialog class. It is used to display Dialog Boxes. Dialog Boxes are generally used to convey important information to the user, and must be dismissed by the user before the application can continue. It should be noted that dialog boxes disrupt the flow of an application and can cause great user frustration if not used appropriately.

Panels When writing a GUI application, the GUI portion can become quite complex. To manage the complexity, GUIs are broken down into groups of components. Each group generally provides a unit of functionality. A Panel is a rectangular Container whose sole purpose is to hold and manage components within a GUI. Panel aPanel = new Panel(); aPanel.add(new Button("Ok")); aPanel.add(new Button("Cancel")); Frame aFrame = new Frame("Button Test"); aFrame.setSize(100,100); aFrame.setLocation(10,10); aFrame.add(aPanel); The Panel class is probably the most important class within the AWT. Panels can contain Components (which includes other Panels). It allows the GUI screen to be partitioned into manageable pieces. Panels should contain Components which are functionally related. For example, if an application wished to allow the user to input their name, address, phone number and other relevant contact information, it would be good design to place all of the necessary GUI Components on a Panel. That panel can be then added to and removed from other Containers within the application.

Buttons This class represents a push-button which displays some specified text. When a button is pressed, it notifies its Listeners. (More about Listeners in the next chapter). To be a Listener for a button, an object must implement the ActionListener Interface. Panel aPanel = new Panel(); Button okButton = new Button("Ok"); Button cancelButton = new Button("Cancel"); aPanel.add(okButton)); aPanel.add(cancelButton)); okButton.addActionListener(controller2); cancelButton.addActionListener(controller1); All GUI systems offer some form of push button. The Button class in Java represents that functionality. Buttons are typically single purpose (ie. Their function does not change).

Labels This class is a Component which displays a single line of text. Labels are read-only. That is, the user cannot click on a label to edit the text it displays. Text can be aligned within the label Label aLabel = new Label("Enter password:"); aLabel.setAlignment(Label.RIGHT); aPanel.add(aLabel); Many GUI applications require users to input data within TextFields, TextAreas, dropdown boxes, etc. However, presenting the user with an series of TextFields without any description would provide a great deal of confusion to the user. All GUI systems allow for the addition of Labels to the interface which provide textual information which aids in the description of the interface itself.

List This class is a Component which displays a list of Strings. The list is scrollable, if necessary. Sometimes called Listbox in other languages. Lists can be set up to allow single or multiple selections. The list will return an array indicating which Strings are selected List aList = new List(); aList.add("Calgary"); aList.add("Edmonton"); aList.add("Regina"); aList.add("Vancouver"); aList.setMultipleMode(true); The List class comes under many names in different GUI systems. Lists provide a list of strings (which is scrollable space the strings take up exceeds the allotted screen real estate) which can be selected by the user. The programmer may allow the user to select multiple strings within the list.

Checkbox This class represents a GUI checkbox with a textual label. The Checkbox maintains a boolean state indicating whether it is checked or not. If a Checkbox is added to a CheckBoxGroup, it will behave like a radio button. Checkbox creamCheckbox = new CheckBox("Cream"); Checkbox sugarCheckbox = new CheckBox("Sugar"); […] if (creamCheckbox.getState()) { coffee.addCream(); } Checkboxes allow for yes/no selections by the user. Each checkbox maintains an internal state indicating whether it is selected or not. If it is selected, it will display itself in such a manner as to indicate it is selected. The state of a checkbox can be queried through the getState method. Multiple checkboxes will all behave independently of one another meaning each one can be individually checked or unchecked. However, if a group of checkboxes are associated with a CheckBoxGroup object, then only one of the checkboxes can be selected at any one time. It is through the use of CheckBoxGroup that the AWT provides “RadioButton” functionality.

Choice This class represents a dropdown list of Strings. Similar to a list in terms of functionality, but displayed differently. Only one item from the list can be selected at one time and the currently selected element is displayed. Choice aChoice = new Choice(); aChoice.add("Calgary"); aChoice.add("Edmonton"); aChoice.add("Alert Bay"); […] String selectedDestination= aChoice.getSelectedItem(); This class provides a list of strings to choose from (just like a list does) but the list is not displayed to the user at all times. Instead, the user must click the Choice to reveal the list. Once revealed, the user may select one of the items within the list. The currently selected item is displayed.

TextField This class displays a single line of optionally editable text. This class inherits several methods from TextComponent. This is one of the most commonly used Components in the AWT TextField emailTextField = new TextField(); TextField passwordTextField = new TextField(); passwordTextField.setEchoChar("*"); […] String userEmail = emailTextField.getText(); String userpassword = passwordTextField.getText(); A TextField provides the user with a location that he/she may input a single line of text. Most TextFields are used in conjunction with a Label. The text provided by the label should describe the purpose (and thus, the expected input for) the TextField.

TextArea This class displays multiple lines of optionally editable text. This class inherits several methods from TextComponent. TextArea also provides the methods: appendText(), insertText() and replaceText() // 5 rows, 80 columns TextArea fullAddressTextArea = new TextArea(5, 80); […] String userFullAddress= fullAddressTextArea.getText(); If the user is to input multiple lines of text, a TextArea is used instead of a TextField.

Layout Managers Since the Component class defines the setSize() and setLocation() methods, all Components can be sized and positioned with those methods. Problem: the parameters provided to those methods are defined in terms of pixels. Pixel sizes may be different (depending on the platform) so the use of those methods tends to produce GUIs which will not display properly on all platforms. Solution: Layout Managers. Layout managers are assigned to Containers. When a Component is added to a Container, its Layout Manager is consulted in order to determine the size and placement of the Component. NOTE: If you use a Layout Manager, you can no longer change the size and location of a Component through the setSize and setLocation methods.

Layout Managers (cont) There are several different LayoutManagers, each of which sizes and positions its Components based on an algorithm: FlowLayout BorderLayout GridLayout For Windows and Frames, the default LayoutManager is BorderLayout. For Panels, the default LayoutManager is FlowLayout.

Flow Layout The algorithm used by the FlowLayout is to lay out Components like words on a page: Left to right, top to bottom. It fits as many Components into a given row before moving to the next row. Panel aPanel = new Panel(); aPanel.add(new Button("Ok")); aPanel.add(new Button("Add")); aPanel.add(new Button("Delete")); aPanel.add(new Button("Cancel")); Flow layout is the default layout manager for Panels

Border Layout The BorderLayout Manager breaks the Container up into 5 regions (North, South, East, West, and Center). When Components are added, their region is also specified: Frame aFrame = new Frame(); aFrame.add("North", new Button("Ok")); aFrame.add("South", new Button("Add")); aFrame.add("East", new Button("Delete")); aFrame.add("West", new Button("Cancel")); aFrame.add("Center", new Button("Recalculate")); Border Layout is the default layout for Frames and Windows

Border Layout (cont) The regions of the BorderLayout are defined as follows: North Center West East South

Grid Layout The GridLayout class divides the region into a grid of equally sized rows and columns. Components are added left-to-right, top-to-bottom. The number of rows and columns is specified in the constructor for the LayoutManager. Panel aPanel = new Panel(); GridLayout theLayout = new GridLayout(2,2); aPanel.setLayout(theLayout); aPanel.add(new Button("Ok")); aPanel.add(new Button("Add")); aPanel.add(new Button("Delete")); aPanel.add(new Button("Cancel"));

What if I don’t want a LayoutManager? LayoutManagers have proved to be difficult and frustrating to deal with. The LayoutManager can be removed from a Container by invoking its setLayout method with a null parameter. Panel aPanel = new Panel(); aPanel.setLayout(null); Ch. VIII - 21

Graphics It is possible to draw lines and various shapes within a Panel under the AWT. Each Component contains a Graphics object which defines a Graphics Context which can be obtained by a call to getGraphics(). Common methods used in Graphics include: drawLine drawOval drawPolygon drawPolyLine drawRect drawRoundRect drawString draw3DRect fill3DRect fillArc fillOval fillPolygon fillRect fillRoundRect setColor setFont setPaintMode drawImage