1 / 18

Graphical User Interfaces (Part IV)

Graphical User Interfaces (Part IV). Overview GUI Programming (Cont’d). Example 1: Creating Multi-layout GUIs with Tooltips. Example 2: Creating Menus with Mnemonics. Example 3: Event Handling with Menus and File Dialogs. Coming Next: Introduction to Threads and Concurrency.

penn
Download Presentation

Graphical User Interfaces (Part IV)

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Graphical User Interfaces (Part IV) Overview • GUI Programming (Cont’d). • Example 1: Creating Multi-layout GUIs with Tooltips. • Example 2: Creating Menus with Mnemonics. • Example 3: Event Handling with Menus and File Dialogs. • Coming Next: Introduction to Threads and Concurrency. GUI Programming (Part IV)

  2. GUI Programming (Cont’d) • From the preceding lectures, it is clear that to design a GUI, we have to think carefully about: • What Containers & Components are required in the application. • What layout to use to arrange the Components in the Container(s). • What actions the Components should perform. • When developing non-trivial GUIs, it is necessary to think about these issues carefully before venturing into development. • In Example 1 that follows we make use of JPanels to illustrate how multi-layout windows can be built. • Multi-layout windows are pervasive in all interesting applications. For example in a graphics application one requires a multi-grid panel as part of the main graphics window in order to keep and make easily accessible the graphics toolbox items like brushes, ‘erasers’ etc. GUI Programming (Part IV)

  3. The JPanel Container • Can be used as a dedicated drawing area • Receives mouse events • Extended to create new components • Combining Swing GUI and drawing in one window can lead to errors • Fix problem by separating GUI and graphics GUI Programming (Part IV)

  4. Example 1: Multi-Layout GUIs import javax.swing.*;import java.awt.*; class MultiLayout extends JFrame{ private JPanel westPanel = new JPanel(); private JPanel southPanel = new JPanel(); private JButton b1, b2, b3, b4; MultiLayout(){ Container cp = getContentPane(); cp.add("North", new JButton("North")); cp.add("East", new JButton("East")); cp.add("Center", new JButton("Center")); westPanel.setLayout(new GridLayout(3,2)); westPanel.add(new JButton("Grid 1")); westPanel.add(new JButton("Grid 2")); westPanel.add(new JButton("Grid 3")); westPanel.add(new JButton("Grid 4")); westPanel.add(new JButton("Grid 5")); westPanel.add(new JButton("Grid 5")); cp.add("West", westPanel); southPanel.setLayout(new FlowLayout()); southPanel.add(b1=new JButton("Flow 1")); southPanel.add(b2=new JButton("Flow 2")); southPanel.add(b3=new JButton("Flow 3")); southPanel.add(b4=new JButton("Flow 4")); b1.setToolTipText("I'm a button labeled "+b1.getText()); cp.add("South", southPanel); setTitle("Multi-Layout GUI-building Sample"); setSize(400,400); show(); } public static void main(String args[]){ new MultiLayout(); }} GUI Programming (Part IV)

  5. Menus • Java provides several classes—JMenuBar, JMenu, JMenuItem, JCheckBoxMenuItem, and JRadioButtonMenuItem —to implement menus in a frame. • A JFrame or JApplet can hold a menu bar to which the pull-down menus are attached. Menus consist of menu items that the user can select (or toggle on or off). Menu bars can be viewed as a structure to support menus. GUI Programming (Part IV)

  6. Menus with Frames • Menus • Important part of GUIs • Perform actions without cluttering GUI • Attached to objects of classes that have method setJMenuBar • JFrame and Japplet • ActionEvents • Classes used to define menus • JMenuBar - container for menus, manages menu bar • JMenuItem - manages menu items • Menu items - GUI components inside a menu • Can initiate an action or be a submenu • Method isSelected GUI Programming (Part IV)

  7. Menu Classes • JMenu - manages menus • Menus contain menu items, and are added to menu bars • Can be added to other menus as submenus • When clicked, expands to show list of menu items • JCheckBoxMenuItem (extends JMenuItem) • Manages menu items that can be toggled • When selected, check appears to left of item • JRadioButtonMenuItem (extends JMenuItem) • Manages menu items that can be toggled • When multiple JRadioButtonMenuItems are part of a group (ButtonGroup), only one can be selected at a time • When selected, filled circle appears to left of item GUI Programming (Part IV)

  8. Menu Classes (Cont’d) • Mnemonics • Quick access to menu items (File) • Can be used with classes that have subclass • javax.swing.AbstractButton • Method setMnemonic() • JMenufileMenu = new JMenu("File") • fileMenu.setMnemonic('F'); • Press Alt + F to access menu • Method setSelected(true) • Of class AbstractButton • Sets button/item to selected state • addSeparator() • Of class Jmenu • Inserts separator line into menu GUI Programming (Part IV)

  9. The JMenuBar Class JFrame f = new JFrame(); f.setSize(300, 200); f.setVisible(true); JMenuBar mb = new JMenuBar(); f.setJMenuBar(mb); A menu bar holds menus; the menu bar can only be added to a frame. Following is the code to create and add a JMenuBar to a frame: GUI Programming (Part IV)

  10. The Menu Class JMenu fileMenu = new JMenu("File", false); JMenu helpMenu = new JMenu("Help", true); mb.add(fileMenu); mb.add(helpMenu); You attach menus onto a JMenuBar. The following code creates two menus, File and Help, and adds them to the JMenuBar mb: GUI Programming (Part IV)

  11. The JMenuItem Class fileMenu.add(new JMenuItem("new")); fileMenu.add(new JMenuItem("open")); fileMenu.add(new JMenuItem("-")); fileMenu.add(new JMenuItem("print")); fileMenu.add(new JMenuItem("exit")); fileMenu.add(new JMenuItem("-")); You add menu items on a menu. The following code adds menu items and item separators inmenu fileMenu: GUI Programming (Part IV)

  12. Submenus JMenusoftwareHelpSubMenu = new JMenu("Software"); JMenu hardwareHelpSubMenu = new JMenu("Hardware"); helpMenu.add(softwareHelpSubMenu); helpMenu.add(hardwareHelpSubMenu); softwareHelpSubMenu.add(new JMenuItem("Unix")); softwareHelpSubMenu.add(new JMenuItem("NT")); softwareHelpSubMenu.add(new JMenuItem("Win95")); You can add submenus into menu items. The following code adds the submenus “Unix,” “NT,” and “Win95” into the menu item “Software.” GUI Programming (Part IV)

  13. Example 2: Creating Menus with Mnemonics import javax.swing.*; class DemonstratingMenus extends JFrame { private JMenuBar menuBar = new JMenuBar(); private JMenu fileMenu = new JMenu("File"); private JMenuItem neW, opeN, closE, savE, prinT; private JMenuItem saveCurrent, saveAs, saveAll; DemonstratingMenus(String title){ super(title); setJMenuBar(menuBar); menuBar.add(fileMenu); fileMenu.setMnemonic('F'); fileMenu.add(neW = new JMenuItem ("New")); fileMenu.add(opeN = new JMenuItem ("Open")); opeN.setMnemonic('o'); fileMenu.add(savE = new JMenu ("Save")); savE.add(saveCurrent = new JMenuItem ("Save Current")); savE.add(saveAs = new JMenuItem ("Save As")); savE.add(saveAll = new JMenuItem ("Save All")); GUI Programming (Part IV)

  14. Example 2: Creating Menus with Mnemonics (Cont’d) fileMenu.add(savE); fileMenu.add(prinT = new JCheckBoxMenuItem ("Print")); fileMenu.addSeparator(); fileMenu.add("Quit"); setSize(400,400); show(); } public static void main(String args[]){ new DemonstratingMenus("Demonstrating Menus using Swing Components."); } } GUI Programming (Part IV)

  15. Example 3: Event Handling with Menus and FileDialogs import javax.swing.*; import java.awt.*; import java.awt.event.*; class HandlingMenuEvents extends JFrame { private JMenuBar menuBar = new JMenuBar(); private JMenu fileMenu = new JMenu("File"); private JMenuItem neW, opeN, closE, savE, prinT, quiT; private JMenuItem saveCurrent, saveAs, saveAll; private JTextField jtxf; GUI Programming (Part IV)

  16. Example 3: Event Handling with Menus and FileDialogs (Cont’d) HandlingMenuEvents(String title) { super(title); setJMenuBar(menuBar); menuBar.add(fileMenu); fileMenu.setMnemonic('F'); fileMenu.add(neW = new JMenuItem ("New")); fileMenu.add(opeN = new JMenuItem ("Open")); opeN.setMnemonic('o'); fileMenu.add(savE = new JMenu ("Save")); savE.add(saveCurrent = new JMenuItem ("Save Current")); savE.add(saveAs = new JMenuItem ("Save As")); savE.add(saveAll = new JMenuItem ("Save All")); fileMenu.add(savE); fileMenu.add(prinT = new JCheckBoxMenuItem ("Print")); fileMenu.addSeparator(); fileMenu.add(quiT = new JMenuItem("Quit")); quiT.setMnemonic('q'); GUI Programming (Part IV)

  17. Example 3: Event Handling with Menus and FileDialogs GUI Programming (Part IV)

  18. Example 4: A Useful Exercise. Q. Write a Java application MultiplicationTutor which repeatedly generates simple multiplication questions that can be used by children for self-assisted learning. The GUI of this application consists of three text field components where the questions are displayed, where the user types his answer and where the application responds to the user’s answer (telling him whether he is right or wrong. If the user types a wrong answer, the response box should tell the user to try again and the question should not change. If the user types the correct answer, the response filed should display this and another random question should be generated immediately. Write the program so that the user can stop the exercise appropriately. The figure below gives a sample GUI for this application. GUI Programming (Part IV)

More Related