Enhancing Java GUI with JFrame and Advanced BorderLayout Techniques

1. COMP 14Introduction to Programming Adrian Ilie July 20, 2005

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. Advanced GUI • class JFrame • Methods • Concept of Inheritance • Events • class JApplet

4. GUIs • We used JOptionPane to create a GUI Calculator using dialog boxes. • We can create more complex GUIs using Java.

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. 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. 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. import javax.swing.*; // needed for JFramepublicclass BigGUI extends JFrame{privatefinalstatic String TITLE =“Big GUI";privatefinalstaticint WIDTH =700;privatefinalstaticint HEIGHT =600;public BigGUI() // constructor { setTitle(TITLE); setSize(WIDTH, HEIGHT); setDefaultCloseOperation(EXIT_ON_CLOSE); setVisible(true); }publicstaticvoid main(String[] args) { BigGUI gui =new BigGUI(); }}

9. BigGUI.java • Create JFrame and test. JFrame content pane

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. 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. 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. BigGUI.java • Get content pane and set layout.

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. 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. Adding Labels • After adding stuff to the content pane... setVisible(true);

17. BigGUI.java • Add labels.

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. filename ImageIcon image = new ImageIcon ("img/0.gif"); 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);

20. Text Position Relative to Icon label.setVerticalTextPosition(vposition); label.setHorizontalTextPosition(hposition); SwingConstants.LEFT SwingConstants.CENTER SwingConstants.RIGHT SwingConstants.TOP SwingConstants.CENTER SwingConstants.BOTTOM

21. BigGUI.java • Add icon.

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