COMP 14Introduction to Programming
Miguel A. Otaduy
June 7, 2004
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
Advanced GUI
• class JFrame– Methods– Concept of Inheritance– Events
• class JApplet
GUIs
• We used JOptionPane to create a GUI Calculator using dialog boxes.
• We can create more complex GUIs using Java.
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.
Extending JFrame
• Use the modifier extends, which is a reserved word
• JFrame is the superclass• BigGUI is the subclass
• It is ok to learn the recipe
public class BigGUI extends JFrame{
}
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)
import javax.swing.*; // needed for JFrame
public class BigGUI extends JFrame{
private final static String TITLE = “Big GUI";private final static int WIDTH = 700;private final 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();}
}
BigGUI.java
• Create JFrame and test.
JFrame
content pane
Adding Things
• Access the content pane so we can add things (buttons, labels, images)
– 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
Container content = getContentPane();
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
BorderLayout
• Select layout for BigGUI as BorderLayout
• When adding components with BorderLayout, you have to specify the section (using NORTH, SOUTH, EAST, WEST, CENTER constants from BorderLayout class)
content.setLayout(new BorderLayout());
content.add(item, BorderLayout.SECTION);
BigGUI.java
• Get content pane and set layout.
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, right-justified, centered)
• Text can be changed with setText method
JLabel northLabel = new JLabel ("NORTH", SwingConstants.CENTER);
JLabel southLabel = new JLabel ("SOUTH");
northLabel.setText ("Changed Text");
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);
Adding Labels
• After adding stuff to the content pane...
setVisible(true);
BigGUI.java
• Add labels.
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);
Adding Images
• We can create images and associate them with labels
• ImageIcon– use JPG or GIF images
• Use setIcon method from JLabel class
centerLabel.setIcon (image);
ImageIcon image = new ImageIcon ("img/0.gif");
filename
label.setVerticalTextPosition(vposition);label.setHorizontalTextPosition(hposition);
Text Position Relative to Icon
SwingConstants.LEFTSwingConstants.CENTERSwingConstants.RIGHT
SwingConstants.TOPSwingConstants.CENTERSwingConstants.BOTTOM
BigGUI.java
• Add icon.
To do
• Read ch. 6: pp 282-290 (important)• Get AFS access• Homework 6• Homework 7 will be assigned