1. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie COMP 14 Introduction to Programming Adrian Ilie July 20, 2005

2. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 2 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

3. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 3 Advanced GUI class JFrame ♦ Methods ♦ Concept of Inheritance ♦ Events class JApplet

4. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 4 GUIs We used JOptionPane to create a GUI Calculator using dialog boxes. We can create more complex GUIs using Java.

5. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 5 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.

6. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 6 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 { }

7. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 7 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)

8. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 8 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(); } }

9. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 9 BigGUI.java Create JFrame and test. JFrame content pane

10. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 10 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();

11. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 11 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

12. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 12 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);

13. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 13 BigGUI.java Get content pane and set layout.

14. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 14 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");

15. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 15 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);

16. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 16 Adding Labels After adding stuff to the content pane... setVisible(true);

17. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 17 BigGUI.java Add labels.

18. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 18 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);

19. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 19 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

20. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 20 label.setVerticalTextPosition(vposition); label.setHorizontalTextPosition(hposition); Text Position Relative to Icon SwingConstants.LEFT SwingConstants.CENTER SwingConstants.RIGHT SwingConstants.TOP SwingConstants.CENTER SwingConstants.BOTTOM

21. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 21 BigGUI.java Add icon.

22. The UNIVERSITY of NORTH CAROLINA at CHAPEL HILL Adrian Ilie 22 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