1. Scott Grissom, copyright 2006Ch 11: GUI Slide 1 Graphical User Interfaces (Ch 11) Careful design of a graphical user interface is key to a viable software system To the user, the user interface is the system Java provides strong support for building GUIs through the javax.swing package Platform independence same code same appearance This is a large topic but we will only cover a portion of the chapter JFrame (11.1 - 11.4.2) menus (11.4.3) layout managers (11.5.3, 11.5.4) event handling (11.4.4, 11.4.5) GUI components (11.7.1) Dialogs (11.5.6)

2. Scott Grissom, copyright 2006Ch 11: GUI Slide 2 Event-Driven Programming the user controls when and what happens in a program GUI components are the screen elements that a user manipulates with the mouse and keyboard Layout managers govern how the components appear on the screen Event handling allows a program to respond to user actions

3. Scott Grissom, copyright 2006Ch 11: GUI Slide 3 Frame (11.4.1) the top level of a GUI application We need to import three packages java.awt.*; java.awt.events.*; javax.swing.*; be familiar with a few of Jframe’s methods JFrame f; f = new JFrame(“some title”); f.setSize(400,300); f.pack(); f.setVisible(true);

4. Scott Grissom, copyright 2006Ch 11: GUI Slide 4 Menus (11.4.3) Create pull down menus JMenuBar JMenu JMenuItem Sample code to create a menu // create the menu bar menus = new JMenuBar(); f.setJMenuBar(menus); // build a Fle menu with Quit fileMenu = new JMenu(“File”); quitItem = new JMenuItem(“Quit”); quitItem.addActionListener(this); fileMenu.add(quitItem); // add menu to the bar menus.add(fileMenu);

5. Scott Grissom, copyright 2006Ch 11: GUI Slide 5 Layout Managers (11.5.3) Java Swing layout is dynamic to allow for different screen sizes and platforms automatically sizes and places components There are several layout managers to choose from: flow layout border layout grid layout box layout

6. Scott Grissom, copyright 2006Ch 11: GUI Slide 6 Flow Layout Components are placed in a row from left to right in the order in which they are added New rows are created as needed Components are displayed at their preferred size Show demo

7. Scott Grissom, copyright 2006Ch 11: GUI Slide 7 Border Layout Defines five locations where a component can be added North, South, East, West, and Center The programmer specifies the area in which a component should appear add(BorderLayout.NORTH, comp) Only one component per location Components expand to full size Default for JFrame Show demo

8. Scott Grissom, copyright 2006Ch 11: GUI Slide 8 Box Layout Components are placed in a row OR a column as specified Sample Code BoxLayout b; b = new BoxLayout(f.getContentPane(), BoxLayout.X_AXIS) Show demo

9. Scott Grissom, copyright 2006Ch 11: GUI Slide 9 Grid Layout Components are placed in a grid with a user-specified number of columns and rows Each cell is the same size Components placed left to right and top to bottom Sample Code GridLayout g; g = new GridLayout(row, col) Show demo

10. Scott Grissom, copyright 2006Ch 11: GUI Slide 10 Nested Containers (11.5.4) Place multiple components inside a Panel Flow is default layout manager Sample Code JPanel p = new JPanel(); p.setLayout(new FlowLayout()); Jbutton b1 = new Jbutton(“one”); Jbutton b2 = new Jbutton(“two”); p.add (b1); p.add (b2); add(p,BorderLayout.NORTH); Show demo

11. Scott Grissom, copyright 2006Ch 11: GUI Slide 11 GUI Components (11.7.1) There are several GUI components that permit specific kinds of user interaction: JTextField, JTextArea JButton, JComboBox, JCheckBox JLabel, JMenu We are only interested in buttons and menus Useful methods setBackground(Color c) setEnabled(boolean) setSize(width, height) setVisible(boolean)

12. Scott Grissom, copyright 2006Ch 11: GUI Slide 12 Event Handling (11.4.4, 11.4.5) When the user performs an action, an event is fired Selecting a menu item or a button fires an ActionEvent Open or closing a Frame fires a WindowEvent Classes can be designed to listen for specific types of events For example A mother and her son at the park

13. Scott Grissom, copyright 2006Ch 11: GUI Slide 13 Action Event when user selects menu items or clicks on a button there must be a class that implements ActionListener this class must include a special method public void actionPerformed( ActionEvent e) each component must register the listener

14. Scott Grissom, copyright 2006Ch 11: GUI Slide 14 actionPerformed this method is called automatically when one of the registered components is selected public void actionPerformed(ActionEvent e) how do we determine which component was clicked? String str = e.getActionCommand(); if (str.equals(“sort”) or JComponent = e.getSource(); if (comp == SortButton)

15. Scott Grissom, copyright 2006Ch 11: GUI Slide 15 Using GUI Components Four Critical Steps 1) define as an instance variable 2) instantiate the component 3) display within the Frame 4) register a listener For Example sortButton = new JButton (“Sort”); getContentPane().add (sortButton); sortButton.addActionListener(this);

16. Scott Grissom, copyright 2006Ch 11: GUI Slide 16 JOptionPanes (11.5.6) Simple solution for common pop-up message boxes that requires little code Different styles are provided WARNING_MESSAGE ERROR_MESSAGE PLAIN_MESSAGE Sample Code JOptionPane.showMessageDialog (frame, “my specific warning message”, “some title”, JOptionPane.WARNING_MESSAGE); JOptionPane.showMessageDialog (frame, “my specific error message”, “some title”, JOptionPane.ERROR_MESSAGE);

17. Scott Grissom, copyright 2006Ch 11: GUI Slide 17 Model View Pattern Separate GUI front end from the application provides flexibility for future interface development View create frames and components create instance of model handle events Model manage data respond to View requests should not know anything about the View Responsibilities Tom and Mary have their own jobs and will be upset if someone else does it