Presentation is loading. Please wait.

Presentation is loading. Please wait.

Unit 3 Graphical User Interface (GUI) Dr. Magdi AMER.

Similar presentations

Presentation on theme: "Unit 3 Graphical User Interface (GUI) Dr. Magdi AMER."— Presentation transcript:

1 Unit 3 Graphical User Interface (GUI) Dr. Magdi AMER

2 Java library has a class JFrame that implements the methods necessary to create a window on any operating system (Windows, Mac and UNIX). JFrame is generic. It does not have the features that we need (labels, buttons, etc). In real life, when we have a factory and we want to modify it’s product, we do not destroy the factory and build a new one, we simply add the machines that we need. Dr. Magdi Amer2 JFrame

3 Similarly, in OOP, when we want to modify the behavior of a class, we extend the class. This means that we take all the method of the class into the new one (without having to write the code again) so we can modify a method or add a new method. Dr. Magdi Amer3 Extending JFrame

4 Dr. Magdi Amer4 Simple Window

5 A window must extend the class JFrame. JFrame handle all the complexity of creating a window on any OS (remember same java code runs on any operating system. setSize ( 400, 140 ); – Creates a window width = 400, height = 140 setVisible( true ); – Makes the window visible. Dr. Magdi Amer5 Simple Window

6 Dr. Magdi Amer6

7 To add a title to the window, we use the code – super(title); – This code uses the constructor of the parent class JFrame. – Calling the constructor of the parent class is a good programming practice, and it may be sometimes necessary. Dr. Magdi Amer7 Simple Window

8 Dr. Magdi Amer8

9 GridLayout layout = new GridLayout(4,1);  Creates a layout of 4 rows and 1 column. Container c = getContentPane(); c.setLayout(layout );  Gets the main container of the window and assign to it the grid container Dr. Magdi Amer9 Advanced Window

10 JPanel p1 = new JPanel(); JPanel p2 = new JPanel(); JPanel p3 = new JPanel(); JPanel p4 = new JPanel(); c.add(p1); c.add(p2); c.add(p3); c.add(p4);  Creates 4 panels (containers) and place them on the window. Each will be placed on a new row. Dr. Magdi Amer10 Advanced Window

11 p1.add(new JLabel("First")); p2.add(new JLabel("Second")); p3.add(new JLabel("Third")); p4.add(new JLabel("Forth"));  Creates 4 labels and put each label on a panel. Dr. Magdi Amer11 Advanced Window

12 Dr. Magdi Amer12

13 JPanel p4 = new JPanel(); c.add(p4); p4.add(new JButton(“Forth")); When a button is placed on a panel  It takes its best fit size c.add(new JButton(“Third")); When a button is placed directly on the window  It expands to take all of the area Dr. Magdi Amer13 Advanced Window

14 Dr. Magdi Amer14 Event Based System

15 Dr. Magdi Amer15 Event Based System

16 this.addWindowListener(new MyWindowAdaptor()); Place an event listener to listen to events generated by the window. If we are interested in handling a specific event, we implement the method that handles this event. Public class MyWindowAdaptor extends WindowAdapter WindowAdapter  class responsible for handling all events of a window public void windowClosing(WindowEvent event) { System.exit(0); } Handles the window closing event and closes the application Dr. Magdi Amer16 Event Based System

17 Dr. Magdi Amer17 Handling the events of a button

18 Dr. Magdi Amer18 Handling the events of a button

19 TextFieldHandler handler = new TextFieldHandler(this); button.addActionListener(handler); Creates an event handler that is associated with a button public class TextFieldHandler implements ActionListener { protected MyFrame myFrame; public TextFieldHandler(MyFrame myFrame) { super(); this.myFrame = myFrame; } Creates an action listener and stores a reference to the window that it controls. Dr. Magdi Amer19 Handling the events of a button

20 public void actionPerformed(ActionEvent e) { String txt = myFrame.text1.getText(); JOptionPane.showMessageDialog(null, txt); } } Reads the text entered in the text field and displays the text in a popup. Dr. Magdi Amer20 Handling the events of a button

21 Dr. Magdi Amer21 Building Rich Interface

22 Dr. Magdi Amer22 Handling the events of a text field

23 Dr. Magdi Amer23 Handling the events of a text field

24 Dr. Magdi Amer24 Using a radio button

25 Dr. Magdi Amer25 Handling the events of a Radio Button

26 Dr. Magdi Amer26 Using a check box

27 Dr. Magdi Amer27 Handling the events of a check box

28 Dr. Magdi Amer28 Using a combo box

29 Dr. Magdi Amer29 Handling the events of a combo box

30 Dr. Magdi Amer30 Using Menus

31 Dr. Magdi Amer31 Using CardLayout

32 Dr. Magdi Amer32 Creating Panels

33 Dr. Magdi Amer33 Handling a menu event

34 Dr. Magdi Amer34 Handling a menu event

35 Dr. Magdi Amer35 2D Graphics

Download ppt "Unit 3 Graphical User Interface (GUI) Dr. Magdi AMER."

Similar presentations

Ads by Google