Transcript Advanced GUIs - The University of North Carolina at Chapel Hill

COMP 14
Introduction to Programming
Adrian Ilie
July 20, 2005
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Last Week of Class
• Basic programming concepts
♦ Review
♦ Finish assignment 6
• Java applets
♦ Compose a web page with a Java applet
• Advance GUI (beyond JOptionPane)
• HTML
2
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Advanced GUI
• class JFrame
♦ Methods
♦ Concept of Inheritance
♦ Events
• class JApplet
3
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
GUIs
• We used
JOptionPane to
create a GUI
Calculator using
dialog boxes.
• We can create more
complex GUIs using
Java.
4
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Inheritance
• JFrame is a class provided by the package
javax.swing
• Instead of instantiating an object of the
JFrame class, we're going to extend the
JFrame class (called inheritance).
• The new class "inherits" features (including
methods and variables) from the existing
class -- big time-saver!
• We can use all of the methods and
variables from JFrame, while adding our
own.
5
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Extending JFrame
• Use the modifier extends, which is a
reserved word
public class BigGUI extends JFrame
{
}
• JFrame is the superclass
• BigGUI is the subclass
• It is ok to learn the recipe
6
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Next Step
• We'll need a constructor for BigGUI
♦ set the window title setTitle
♦ set the window size setSize
♦ set the default operation when the close
button is pressed
setDefaultCloseOperation
♦ display the window setVisible(true)
• We'll need a main method
♦ create an object of the BigGUI class (which
will call the constructor)
7
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
import javax.swing.*; // needed for JFrame
public class BigGUI
{
private final
private final
private final
extends JFrame
static String TITLE = “Big GUI";
static int WIDTH = 700;
static int HEIGHT = 600;
public BigGUI() // constructor
{
setTitle(TITLE);
setSize(WIDTH, HEIGHT);
setDefaultCloseOperation(EXIT_ON_CLOSE);
setVisible(true);
}
public static void main(String[] args)
{
BigGUI gui = new BigGUI();
}
}
8
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
BigGUI.java
• Create JFrame and test.
JFrame
content pane
9
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Adding Things
• Access the content pane so we can
add things (buttons, labels, images)
Container content = getContentPane();
♦ Container class is provided by the java.awt
package
♦ add import statement for java.awt
• Then, we set the layout type and add
things to the content pane
10
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Layout Managers
• FlowLayout
♦ default
♦ components are added left to right, top to bottom
• BorderLayout
♦ consists of NORTH, SOUTH, EAST, WEST, CENTER regions
♦ size of CENTER region depends on the number of
components in the EAST and WEST regions
• GridLayout
♦ define number of rows and columns to get equally sized
cells
♦ cells are filled left to right, top to bottom
11
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
BorderLayout
• Select layout for BigGUI as
BorderLayout
content.setLayout(new BorderLayout());
• When adding components with
BorderLayout, you have to specify
the section (using NORTH, SOUTH,
EAST, WEST, CENTER constants from
BorderLayout class)
content.add(item, BorderLayout.SECTION);
12
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
BigGUI.java
• Get content pane and set layout.
13
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
JLabels
• We'll identify the regions of the
BorderLayout with labels (text areas)
• JLabel is a region of text
♦ can be assigned an alignment (left-justified, rightjustified, centered)
JLabel northLabel = new JLabel ("NORTH",
SwingConstants.CENTER);
JLabel southLabel = new JLabel ("SOUTH");
• Text can be changed with setText
method
northLabel.setText ("Changed Text");
14
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Adding Labels
Container content = getContentPane();
content.setLayout (new BorderLayout());
JLabel northLabel = new JLabel ("NORTH",
SwingConstants.RIGHT);
content.add (northLabel, BorderLayout.NORTH);
JLabel southLabel = new JLabel ("SOUTH");
content.add (southLabel, BorderLayout.SOUTH);
JLabel westLabel = new JLabel ("WEST",
SwingConstants.CENTER);
content.add (westLabel, BorderLayout.WEST);
15
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Adding Labels
• After adding stuff to the content
pane...
setVisible(true);
16
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
BigGUI.java
• Add labels.
17
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Colors
• Set the background color of the content
pane
• Set the foreground color of the text
(JLabels)
• Use Color class from the java.awt package
• Available colors pg. 734
♦ constants (but lowercase)
• Methods
♦ darker() - darkens the color
♦ brighter() - brightens the color
content.setBackground(Color.blue.darker().darker());
northLabel.setForeground(Color.white);
18
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Adding Images
• We can create images and associate
them with labels
• ImageIcon
♦ use JPG or GIF images
filename
ImageIcon image = new ImageIcon ("img/0.gif");
• Use setIcon method from JLabel
class
centerLabel.setIcon (image);
19
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
Text Position Relative to Icon
label.setVerticalTextPosition(vposition);
label.setHorizontalTextPosition(hposition);
SwingConstants.TOP
SwingConstants.CENTER
SwingConstants.BOTTOM
20
Adrian Ilie
SwingConstants.LEFT
SwingConstants.CENTER
SwingConstants.RIGHT
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
BigGUI.java
• Add icon.
21
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL
To do
• Read ch. 6: pp 320-328 (282-290
in old book) - important
• Get AFS for web space
• Homework 6
• Homework 7 will be assigned
22
Adrian Ilie
The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL