Building GUIs

1
Building GUIs

• Command Line Interfaces
• Graphical User Interfaces (1)
• Frames and Menus
• Handling Events

2
Running a program

• any Java application needs a main() method to run
• can put in any class, or in a separate class
• execution starts at first line of main() method
  and continues line-by-line to end
• main() can call other methods
• in the same class
• or in other classes
• these methods can then call other methods
• if any method in any class is never called, it
  will not be executed
• main() method drives the application
• consider running some use cases from our School
  example

3
School use cases
4
School example

• we have looked at how to design and implement
  appropriate classes for this system
• Student
• School
• we have also written a SchoolApp class which
• contains the main() method
• initiates the different use cases
• preferably involving interaction with the user
• this is a separate class so that the user
  interface can be changed without changing the
  underlying system (School and Student) classes

5
School system
6
Simple interface

• the simplest interface (application) class has
  only a main() method with the use cases hard
  coded in
• no choice
• no user interaction
• main() method could
• create a school
• enrol 2 students
• find one of the students and display their record
• delete one of the students
• print all the student details

7
Hard coded interface

• public static void main(String args)
• School soc new School(10)
• Student st new Student("Basil", "Computing")
• soc.addStudent(st)
• st new Student("Sybil", "Information
  Systems")
• soc.addStudent(st)
• st soc.getStudentByName("Basil")
• System.out.println(st.toString())
• soc.deleteStudent("Basil")
• soc.printStudentList()

8
Output

• Details for student Basil
• Program Computing
• Level 1
• Date enrolled Day2006,11,8
• Student number 1000
• List follows
• 0
• Details for student Sybil
• Program Information Systems
• Level 1
• Date enrolled Day2006,11,8
• Student number 1001

9
Adding user interaction

• hard coded interface has no
• choice
• user interaction
• quick way to test classes and their methods
• make modifications to test different aspects
• need user interaction for real application
• choose options from displayed menu
• enter data such as student name
• looked at example in Control Flow lecture

10
Menu interface

• What would you like to do?
• 1 Register student
• 2 Print all student details
• 3 Print student record
• 4 Delete student
• 5 Update student program
• 6 Increment student level
• 7 Exit
• ? 1
• What name? Basil
• What program? Computing
• Student added

11
Menu interface

• What would you like to do?
• 1 Register student
• 2 Print all student details
• 3 Print student record
• 4 Delete student
• 5 Update student program
• 6 Increment student level
• 7 Exit
• ? 3
• Name of student? Basil
• Details for student Basil
• Program Computing
• Level 1
• Date enrolled Day2006,11,8
• Student number 1000

12
GUI interface

• ideally we'd like implement a graphical user
  interface (GUI)
• if your system is well designed this should
• not involve any changes to the system classes
• School and Student in this example
• be easily done by modifying the user interface
  class
• SchoolApp
• may involve adding more user interface classes
• do NOT try to implement a GUI until you have
  built and tested the rest of your system

13
GUI menu
14
GUI data entry
15
GUI components

• we need to use components common to many windows
  systems

16
GUI components
17
Abstract Windows Toolkit

• Java provides classes for these components in the
  package java.awt
• abstract windows toolkit
• the sub-package java.awt.event has classes for
  handling GUI events
• need to import both packages to use them
• import java.awt.
• import java.awt.event.
• java.awt is the original Java GUI API

18
Java Swing

• later alternative Swing
• based on awt
• contained in package javax.swing
• written entirely in Java
• awt could only incorporate lowest common
  denominator capabilities present on every
  platform
• Swing's capabilities are platform-independent
• Swing has more components than awt
• flexible can change look and feel

19
GUIs in Java

• can design GUIs visually
• drag and drop interface
• designer in JBuilder or NetBeans
• UIDesigner in Together
• generates code automatically
• we are interested in understanding the code
  rather than learning to use a visual editor
• Swing is very similar to awt
• has different names for example JButton rather
  than Button
• look at example SchoolApp code

20
JFrame

• a JFrame is a window with a title bar
• can add the other components to it
• JMenuBar, JButtons, JTextFields.
• make the interface class a subclass of JFrame
• inherit JFrame's attributes and methods
• add our own constructor to set up and add the
  components
• add other methods to interact with rest of system

21

• import javax.swing.
• public class SchoolApp extends JFrame
• private School soc
• public static void main(String args)
• SchoolApp si new SchoolApp()
• public SchoolApp()
• super("The School Administration
  System")
• setDefaultCloseOperation(JFrame.EXIT_ON_CL
  OSE)
• soc new School(4)
• addMenu()
• setSize(500, 300)
• setLocation(150, 150)
• show()

22
Menus

• menus can be added to any subclass of JFrame
• need to declare the active components as
  attributes
• private JMenuItem register, printAll,
  printRecord, exit
• in the constructor (or a method called by it)
• create the menu components
• register them with an action listener
• add them to the JFrame object

23

• public void addMenu()
• // creates a menu bar, puts it at the top of
  the frame
• JMenuBar mBar new JMenuBar()
• setJMenuBar(mBar)
• // creates a pull-down menu to deal with
  students
• JMenu studentMenu new JMenu("Student")
• mBar.add(studentMenu)
• // creates menu items for "Student" pull-down
  menu
• register new JMenuItem("Register")
• printAll new JMenuItem("Print all
  students")
• printRecord new JMenuItem("Print student
  record")
• exit new JMenuItem("Exit")

24

• // attaches menu items to menu
• studentMenu.add(register)
• studentMenu.add(printAll)
• studentMenu.add(printRecord)
• studentMenu.addSeparator()
• studentMenu.add(exit)
• // registers this class as the
• // action listener for the menu items
• register.addActionListener(this)
• printAll.addActionListener(this)
• printRecord.addActionListener(this)
• exit.addActionListener(this)

25
Events in Java

• java.awt.event contains classes to deal with
  events
• every time an event occurs, a new object of the
  appropriate class is generated
• WindowEvent
• window opening and closing, window activation
• ActionEvent
• component actions such as button presses, menu
  and checkbox selection
• AdjustmentEvent
• moving of scrollbars
• KeyEvent
• key presses
• MouseEvent
• mouse clicks, moves, drags

26
Event listeners

• we need to register an event listener for each
  active component
• when a component generates an event object, it is
  sent to the registered listener
• a class which is an event listener must implement
  the appropriate listener interface
• WindowListener
• ActionListener
• AdjustmentListener
• KeyListener
• MouseListener

27
ActionListener for menus

• JMenuItem objects generate ActionEvents when
  selected
• we will register this class to respond to
  ActionEvents
• need to implement ActionListener interface
• public class SchoolApp extends JFrame implements
  ActionListener ...
• ActionListener has only one method,
  actionPerformed()

28
ActionPerformed Method

• public void actionPerformed(ActionEvent e)
• if (e.getSource() instanceof JMenuItem)
• JMenuItem choice (JMenuItem)e.getSourc
  e()
• if (choice register)
• registerStudent()
• else if (choice printAll)
• printStudentList()
• else if (choice printRecord)
• printStudentDetails()
• else if (choice exit)
• System.exit(0)

29
GUI with menu

• have only implemented the menu so far
• methods registerStudent(), printStudentList()
  etc. are unchanged from command line menu example
• still ask for student name, program name, and
  print student details on command line
• OK to incrementally develop GUI
• next week GUIs for data entry
• JDialog
• JButton
• JLabel
• JTextField, JTextArea
• JRadioButton and ButtonGroup

30
Further work

• Read the Swing tutorials on the Sun website
• http//java.sun.com/docs/books/tutorial/uiswing/TO
  C.htmllearn
• Tutorial
• add GUI menu to School system
• add GUI menu to your assignment system
• for Distinction
• don't attempt until you've fulfilled Pass and
  Merit criteria!