Basics of GUI Programming

Chapter 11 and Chapter 22

GUI Components

GUIs are built from GUI components. GUI component is an object with which the

user interacts via---– Mouse– Keyboard– Voice– Etc;

Simple GUI Input/Output

Java’s JOptionPane in javax.swing– showMessageDialog static method– showInputDialog static method– Used for very simple input and output

GUI Components

Two sets of GUI components in Java– Swing (in package javax.swing)– AWT ( in package java.awt)

AWT – components are automatically mapped to the platform-

specific components– Tied to the local platform– Prone to platform-specific bugs– Referred to as heavyweight components– Eventually fade away

GUI Components

Swing– More robust, versatile, and flexible than AWT

components– Less dependent on the target platform– Referred to as lightweight components

Classification of GUI classes

Container classes Component classes Helper classes

Container Classes

Component classes that are used as containers to contain other GUI components

– JFrame Window not contained inside another window Container that holds other Swing components JFrame object is a window – has a border, sizing buttons

– JPanel Invisible container that holds user-interface components Can be used as a canvas to draw graphics Can be nested

– JApplet

Java GUI API

Object

Component Color Graphics

Container

WindowPanel JComponent

Frame

JFrame

Applet

JApplet

Font

JPanel

GUI Component Classes

JButton JTextField JTextArea JComboBox JList JRadioButton JMenu

GUI Helper Classes

Used by components and containers to draw and place objects– Graphics

Abstract class for drawing strings, lines and simple shapes

– Color Specifies colors of GUI components

– Font Specifies fonts for the text and drawings on GUI

components

GUI Helper Classes

LayoutManager– Interface that specifies how components are

arranged in a container

Layout Managers

Java GUI components are placed in containers, where they are arranged by the container’s layout manager.

Layout manager places components in the correct locations in the containers

Layout Managers - Examples

FlowLayout – simplest layout manager– Components are arranged in the container from

left to right, top to bottom in the order in which they were added

– Default manager

BorderLayout– Has 5 regions NORTH (top), SOUTH (bottom),

EAST (right side), WEST (left side) and CENTER

JFrame methods

To create a user interface, you need to create either a frame or an applet to hold user-interface components.

JFrame() – constructs an untitled JFrame object

JFrame(String ) – constructs a JFrame object with the specified title

JFrame methods

void setDefaultCloseOperation (int operation)Operation tells the program what to do when the

frame is closed. Possible values are: DO_NOTHING_ON_CLOSE HIDE_ON_CLOSE DISPOSE_ON_CLOSE EXIT_ON_CLOSE

JFrame methods

setSize (int width, int height)– Specified in pixels– Defined in Component class

setTitle (String title) dispose() – eliminates calling frame and all

subcomponents setVisible (boolean value)

– Defined in Component class

JFrame Concepts

JFrame will display only when setVisible is set to true

If setSize() is not used, frame will be 0x0; nothing will be seen but the title bar.

If setDefaultCloseOperation is not used, the program does not terminate and user must break at the DOS prompt (windows)

JFrame Example

import javax.swing.JFrame;public class MyFrame{

public static void main (String args[]) {JFrame frame = new JFrame (“My Frame”);frame.setSize (400,300);frame.setVisible (true);frame.setDefaultCloseOperation

(JFrame.EXIT_ON_CLOSE);}

}

MyFrame output

JFrame Concepts

JFrame object can have components added– Components must be added to the content pane of the

JFrame– Think of a content pane as the “inside” of the JFrame– In Java , you can add components directly to the frame and

it automatically adds them to the content pane. Example: add(component);

– Older versions: getContentPane().add (component);

Adding Components - JLabel

JLabel – uneditable text1. Constructors

public JLabel() public JLabel (String text) public JLabel (Icon icon) public JLabel (String text, Icon icon, int horizontalAlignment)

2. setIcon(Icon b) Image b = new ImageIcon (“cat.gif”);

– Label1.setIcon(b);

Adding Components - JLabel

1. .setHorizontalPosition (SwingConstants.CENTER);

2. .setVerticalTextPosition (SwingConstants.BOTTOM);

3. .setToolTipText(“This is a label”);

JTextField

Enables user to enter data from the keyboard Also can be used to display editable or un-

editable text

Example

Design the GUI for a “guessing” game. User should be asked to guess a number between 1 and 10. Points are deducted each time the user guesses the wrong number.

Java application for GuessGame

import javax.swing.JFrame;

public class TestGuessGame {

public static void main (String args[]){

GuessGame aGame = new GuessGame();

aGame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);aGame.setSize (200,200);aGame.setVisible (true);

}}

Output (using FlowLayout)

The GuessGame file

GuessGame.java

End (Part 1)

JFrame FlowLayout BorderLayout