Swing & GUI Design

AWT
Swing
GUI Design Using IDE Tool
 What is GUI
 Graphic User Interface
 Outer Interface of Program
 GUI is Built by GUI Components
 GUI Component : Visual Object to Interact With Out
side such as Mouse, Keyboard, etc.
 Ex) AWT, Swing Components
 Interfaces Provided by Java
 Graphic : line, rectangle, polygon, arc, ….
 Interaction Elements : button, textfield, menu, …
 Image : image files
 GUI and AWT
 Abstract Window Toolkit (AWT)
 Java.awt package
 Component Class : Button, List, Menu, TextArea,
Window, MenuBar, Dialog
 Graphics Related Classes : Graphics Context, Fon
t , Color
 Event Class : For Event Handling
 Layout Management Class : Size and Position of C
omponent
GUI Component Hierarchy
 GUI Operation Outline
 Procedure for Making GUI in Java
 Select the Container Component and Arrange the
Basic Components within this container. Select the
Layout Manager Also.
 Make the Event Handling Routine and Register it.
 Event Listener
 Insert the Drawing Code to Override the paint()
method in order to draw some figure on component
 Paint(), repaint(), update()
 Make the GUI Component
 Procedure to put the GUI components into Frame or P
anel which is container
 Make the container object
 Declare and create the component object.
 Put the objects created into container
 Layout Manager
 FlowLayout : From Left to Right in Panel, Default Manager
 GridLayout : With Grid, Arrange in Lattice Type
 GridBagLayout : Arrange Different Size Component on Grid
 BorderLayout : Up, Down, Left, Right, Center
 CardLayout : Arrange Several Cards
 Graphics User Interface (I)

 Component Class
 Abstract Class which provides :
 Methods to control size and position on the screen
 Methods to setup cursor and return the cursor
position
 Methods for drawing such as
paint(),update(),repaint()
 Methods to determine keyboard input, visibility
 Function for providing event handling registration
 Methods related with Font and Color
 Graphics User Interface (I)

 Label
 Not able to change
 Describes Text information
 Button
 When user presses
 Occur events to make some action.
 Check Box
 Has two states of ON and OFF
 When user selects one of two
 For multiple selection, CheckboxGroup can be used
 Graphics User Interface (I)

 Choice Button
 Select one of several items to select
 When user clicks arrow button, then the selection list is
displayed.
 When user select one, Action event occurred.
 Select List
 Used to select one or more item(s)
 Text Field
 A line of text area to input
 It is possible to disable/enable input
 Text Area
 Multi-lines of text area to input
 Graphics User Interface (I)

 TextComponent Class
 Super class of TextField and TextArea
 Scroll Bar
 To input an integer within some range
 Canvas
 To create display area for graphic
 Building a customized component by user
 Graphics User Interface (II)

 Panel
 Inherited from Container class (Super of Applet)
 Components can be added into Panel
 Frame
 Window to have Title Bar and Border
 Independent of Window( compare to Dialog)
 Dialog Box
 Window to have Title Bar
 Dependent on Parent Window
 Modal Dialog (Can do work only after terminating the Dialog)
 Non-Modal Dialog
 Graphics User Interface (II)

 Scroll Pane
 To make an area to be scrolled easily
 To display the child component as large as possible
 If child component is larger than Scroll Pane, it adds the hor
izontal or vertical scroll bar.
 Menu
 MenuItem : Each Item of Menu
 CheckboxMenuItem
 Menu
 MenuBar
 PopupMenu
 Events

 Event
 Event Listener
 Delegation Model
 Adaptor
 Low Level Event :
 Mouse, MouseMotion, Key, Component, Container,
Focus, Window
 High Level (Have Semantics) Event:
 Action, Adjustment, Item, Text
Events
 JFC & Swing

 JFC (Java Foundation Class)

 Give a group of class to help people build GUI
 Things Contains :
 Swing Components
 Pluggable Look and Feel Support
 Accesibility API
 Java 2D API
 Drag and Drop Support
 JFC & Swing

 Differences between AWT and Swing

 Swing components are implemented with
absolutely no native code => can be present on
every platform.
 Swing component which their names start with J
can be identified
 Have capabilities beyond what the AWT
components offer
 JFC & Swing

 Capabilities beyond AWT

 Swing buttons and labels can display images instead of, or in
addition to, text.
 You can easily add or change borders drawn around most
Swing components.
 You can easily change the behavior or appearance of a Swing
component by either invoking methods on it or creating a
subclass of it
 Swing components need not be rectangular.
 Assistive technologies such as screen readers can easily get
information from Swing components.
 Swing Components
 Content URL :
http://java.sun.com/docs/books/tutorial/uiswing/components/compo
nents.html
 Top Level Containers
 The components at the top of any Swing containment hierarchy
– Applet, Dialog, Frame
 General Purpose Containers
 Intermediate containers that can be used under many different ci
rcumstances – Panel, Scroll Pane, Split Pane, Tabbed Pane,
Tool bar
 Swing Components
 Special Purpose Containers
 Intermediate containers that play specific roles in the UI. – Internal Frame,
Layered Pane, Root pane
 Basic Controls
 Atomic components that exist primarily to get input from the user; they gener
ally also show simple state – Buttons, Combo Box, List, Menu, Slider,
Spinner, Text Field
 Uneditable Information Displays
 Atomic components that exist solely to give the user information – Label,
Progress bar, Tool tip
 Editable Displays for Formatted Information
 Atomic components that display highly formatted information that (if you cho
ose) can be edited by the user – Color chooser, File chooser, Table, Text,
Tree
 Swing Application Code
 Code Location :
/home/course/prog3/examples/ch15/SwingApplication.java
 Importing Swing Packages ( and AWT packages)
<SwingApplication.java>
Import javax.swing.*;
Import java.awt.*; Import java.awt.event.*;
 Choosing the Look and Feel
 Java Look and Feel, Windows Look and Feel, CDE/Motif Look and Feel
public static void main(String[] args) { try { UIManager.setLookAndFeel(
UIManager.getCrossPlatformLookAndFeelClassName()); } catch
(Exception e) { }
...//Create and show the GUI... }
 Swing Application Code

 Setting Up a Top-Level Container

 Instances of JFrame, JDialog, JApplet
 JFrame : implements a single main window
 JDialog : implements a secondary window
 JApplet : implements an applet’s display area within
a browser windows
Ex)
JFrame frame = new JFrame(“SwingApplication”);
 Swing Application Code

 Setting Up Buttons and Labels

 Make component objects and set up attribute
Ex)
JButton button = new JButton("I'm a Swing button!"); butt
on.setMnemonic(KeyEvent.VK_I); //use Alt-i button.addAct
ionListener(...create an action listener...);
final JLabel label = new JLabel(labelPrefix + "0 "); ... label.s
etLabelFor(button); ...//in the event handler for button clic
ks: label.setText(labelPrefix + numClicks);
 Swing Application Code

 Adding Components to Containers

 To group a label and button in a container (a JPane
l) before adding components to the frame
Ex)
JPanel pane = new JPanel(); pane.setBorder(BorderFactory.
createEmptyBorder(30, 30, 10, 30));
pane.setLayout(new GridLayout(0, 1)); pane.add(button);
pane.add(label);
 Swing Application Code

 Adding Borders Around Components

 Provides some empty space around the panel’s contents
 Ex)
pane.setBorder(BorderFactory.createEmptyBorder(
30, //top
30, //left
10, //bottom
30) //right );
 Swing Application Code

 Handling Events
 Make Event Handler
Ex)
button.addActionListener(new ActionListener() {
public void actionPerformed(ActionEvent e) { numClicks++; label.se
tText(labelPrefix + numClicks); }
}); ...
frame.addWindowListener(new WindowAdapter() { public void wind
owClosing(WindowEvent e) { System.exit(0); }
});
 Swing Application Code

 Dealing with Thread Issues

 Because the event handler runs in the same thread
that performs all event handling and painting for the
application, there's no possibility that two threads wi
ll try to manipulate the GUI at once
 All manipulation of the GUI such as setText, getTex
t, etc, is performed in event handlers such as action
Performed()
 Swing Application Code

 Supporting Assistive Technologies

 Support for assistive technologies -- devices such a
s screen readers that provide alternate ways of acc
essing information in a GUI -- is already included in
every Swing component.
 The only code in SwingApplication that exists solel
y to support assistive technologies is this: label.setL
abelFor(button);
 GUI Design Using IDE TOOL

 There are several Integrated Development En

vironment (IDE) Tools
 Eclipse
 Jbuilder of Borland
 Visual Age of IBM
 Visual J++ of Microsoft

 Demonstration