Download powerpoint

Lecture 3 - Graphical User Interfaces
 GUI toolkits in Java API
 JFrame
 GUI components
 Input in Frames
 Reading:
Horstmann, Chapters 4, 10 and 12
Swing tutorial
Java tutorial, Chapter on Swing (downloadable)
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -1
Java API
 java.awt - Original GUI toolkit in JDK 1.1,
implemented using native GUI libraries of
the operating systems. (Problem:
portability.)
 javax.swing - Portable GUI toolkit added in
Java 2, extending java.awt. (Gives
platform-independent operation, though it is
slower.)
 Many other third party GUI toolkits, e.g.,
SWT in Eclipse.
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -2
JFrame
 In many application programs one needs to
import both java.awt and javax.swing.
 To avoid confusion, the common class
names in Swing are are prefixed with the
letter “J”, e.g., JFrame, JApplet,
JButton, JMenubar etc.
 Frame – The Java term for a GUI window.
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -3
Creating JFrames
//1. Optional: Specify who draws the window decorations.
JFrame.setDefaultLookAndFeelDecorated(true);
//2. Create the frame.
JFrame frame = new JFrame("FrameDemo");
//3. Optional: What happens when the frame closes?
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
//4. Create components and put them in the frame.
//...create emptyLabel...
frame.getContentPane().add(emptyLabel,
BorderLayout.CENTER);
//5. Size the frame.
frame.pack();
//6. Show it.
frame.setVisible(true);
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -4
Creating JFrames - Commentary
1.
2.
3.
4.
5.
6.
Asks that the frame should be decorated with
borders etc.
Creates an instance of the JFrame class.
Specifies that the program should exit when the
frame is closed. (If you don’t put this, the
program might hang.)
Adds something called “emptyLabel” as a GUI
component to the frame.
Asks that the frame be automatically sized based
on its contents and their preferred sizes.
Makes the frame visible. (Otherwise, it would
be hidden by default.)
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -5
Components and Containers
 The things that you can display in GUI
windows are called components. Examples
are buttons, text fields, tables etc.
 Some of the components are containers,
i.e., they can contain other components
inside them (which might again be
containers etc.).
 A JFrame is a container of a specialized
sort. It has several “panes” as its
components, the important one being its
contentPane.
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -6
The contentPane
 The contentPane is a container. So, we can add
components to it.
Container pane = frame.getContentPane();
pane.add(new JLabel(
new ImageIcon(
“world.gif”))));
pane.add(new JLabel(“Hello World!”));
pane.add(new JButton(“Click Me”));
 Or, we can create a new contentPane:
JPanel pane = new JPanel();
frame.setContentPane(pane);
pane.add(new JLabel(“Hello World!”));
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -7
JPanel and JApplet
 Panels are simple lightweight containers.
 They support graphics, in addition to user
interface components.
 Applets are frames that can be drawn inside
web pages, included using a HTML tag
such as:
<APPLET code=“MyApplet.class”
width=400 height=300>
If you Java-enable your browser, you will see applet.
</APPLET>
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -8
GUI Components
 Display elements: text labels, image labels.
 Basic controls: text fields, buttons, radio
buttons, check-boxes, option lists, comboboxes (drop-down lists), menus, sliders.
 Containers: panels, scroll-panes, split-panes,
tabbed-panes, toolbars.
 Fancy displays: tables, tree-displays.
 Fancy controls: file chooser, color chooser.
 See
http://java.sun.com/docs/books/tutorial/uiswing/components/components.html
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -9
Using Inheritance to define Panels
 Good design practice to define panels as classes,
extending the JPanel class.
public class MyPanel extends JPanel {
int count = 0; // the state
JButton button = new JButton(“Click me”);
JLabel label = new JLabel(“0”);
public MyPanel() {
add(button); add(label);
}
}
 It is even necessary when you need to include graphics
painting.
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -10
Input in panels
 Users enter text in text field components
 Reading the value in a text field involves
four changes to what we’ve seen:
import java.swing.*;
import java.awt.event.*;
1
public class MyPanel extends JPanel
implements ActionListener {
2
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -11
Input in panels (cont.)
JTextField t = new JTextField(4);
public MyPanel () {
...
add(t);
t.addActionListener(this);
}
3
public void actionPerformed (ActionEvent e) {
... t.getText() ...
......
4
}
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -12
Input in panels (cont.)
1
2
3
“import java.awt.event.*” must appear
verbatim (the event-handling library).
“implements ActionListener” must appear
verbatim (to say that it handles action events).
JTextField variable, say t, is declared as
instance variable
In the constructor, in addition to calling add,
call
t.addActionListener(this);
(to say that this object will handle the action
events from t).
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -13
Input in applets (cont.)
4
Define actionPerformed method.
 Called
when user types Enter key in the text
field.
 Use getText method of JTextField class to
get the String contained in t.
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -14
The event model
 The code above is one instance of the event
model.
 With the event model, the panel can respond
to button clicks, mouse movements, etc.
 Can also use multiple text fields and
distinguish which one was modified.
 More in the next lecture...
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -15
Layout
 Layout of GUI panels is a tricky business.
 Need
to allow for resizing of windows.
 Need to be flexible about the text labels etc.
 Java library defines a number of “Layout
Managers” to facilitate layout.
 Or, you can define your own or import third
party libraries.
 http://java.sun.com/docs/books/tutorial/uiswing/mini/layout.html
2003-01-27
MSc Workshop - © S. Kamin, U. Reddy
Lect 3 - GUI -16