1 / 31

GUI Programming

GUI Programming. Graham Hardman (gph@comp.leeds.ac.uk) 12 th June 2002. Overview. GUI Packages & Technologies. Components. GUI component layout. GUI program layout. Swing event-driven programming model. Useful(?) Examples (all the way through). A bstract W indowing T oolkit.

elton-conner
Download Presentation

GUI Programming

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. GUI Programming Graham Hardman (gph@comp.leeds.ac.uk) 12th June 2002

  2. Overview • GUI Packages & Technologies • Components • GUI component layout • GUI program layout • Swing event-driven programming model • Useful(?) Examples (all the way through) Java GUI Programming

  3. Abstract Windowing Toolkit • GUI package in original SDK • Platform-dependent (heavyweight) components – contains native components which rely on underlying window manager • Provides components, and methods for laying them out within containers Java GUI Programming

  4. Swing • Became part of core API in JDK 1.2 • Platform-independent (lightweight) components, as Swing is written in Java • Consistent look-and-feel across platforms • Built on top of AWT Java GUI Programming

  5. AWT vs Swing • Swing designed to complement AWT rather than replace it (completely…) • Swing components offer more functionality • Swing components still being developed / enhanced, AWT API (probably) complete • Swing components offer built-in support for accessibility (eg braille readers), which is becoming more significant Java GUI Programming

  6. Import the AWT and Swing classes Make the program executable Create a top-level frame Make the frame visible A (uselessly) Basic GUI Program import java.awt.*; import javax.swing.*; public class Hello { public static void main(String args[]) { JFrame frame = new JFrame(“Hello world”); frame.setVisible(true); } } Java GUI Programming

  7. GUI Components • Swing provides a rich set of widgets • (Almost) all inherit from one superclass … • …so much of the API is consistent across widgets • Without further ado, let’s look at some widgets Java GUI Programming

  8. Some Basic Components • JButton A simple push-button • JLabel Displaying text or icon • JTextField A text type-in box • JComboBox A drop-down option list • JSlider Allow selection from range • JPanel Groups other components • JFrame Visible window on screen Java GUI Programming

  9. JFrame • Very important in most Swing applications – without it you won’t see anything! • Many Swing apps are subclasses of JFrame, therefore taking advantage of its methods • A heavyweight Swing component – relies on OS windowing system for appearance Java GUI Programming

  10. JFrame (continued 1) • JFrame uses the concept of a content pane to keep hold of and arrange (most) components : Menu bar Content pane Different layers for other component types (to accommodate overlap etc.) Pane to handle mouse events etc. Java GUI Programming

  11. Using Simple Components • Often the GUI appearance can be achieved by calling the same few methods on each widget… setText(“fish”); setEnabled(true); setIcon(new ImageIcon(“fish.jpg”)); setSize(123,321); setBackground(Color.blue); setLocation(15,50); setForeground(Color.red); setVisible(false); • …and of course frame.add(widget). Correct? Java GUI Programming

  12. Container c = frame.getContentPane(); c.add(widget1); c.add(widget2); JFrame (continued 2) • frame.add(widget); Wrong – program compiles, but error occurs at runtime • frame.getContentPane().add(widget); This is the correct method • Frequently the code looks slightly different… Java GUI Programming

  13. JPanel • Designed specifically as a container for displaying other components together in logical groups. • Invisible by default, but its appearance can be tailored in the same way as any other component. • Can be treated in pretty much the same way as the main content pane – for example, the setLayout( ) and add( ) methods are identical. Java GUI Programming

  14. JPanel (continued) • Much of the power and usefulness of the JPanel lies in its ability to contain other JPanels… • …which, when combined with carefully-chosen layout managers, provides almost infinite flexibility in terms of GUI appearance • JPanel also recognises low-level events such as mouse motion and clicking, so it can be used as a canvas to support mouse-intensive tasks such as drawing shapes by following the mouse pointer. Java GUI Programming

  15. Layout Managers • While we can work without using any of Java’s predefined layout managers… • …they do make it easier to add extra widgets, resize windows etc. without too much disruption to code or interface. • We’ll look at three provided with AWT – FlowLayout, BorderLayout and GridLayout • (There are others, but sophisticated enough GUIs can be made without them, so we’ll ignore them). Java GUI Programming

  16. BorderLayout • Default layout for JFrame and JApplet • Display is divided into 5 regions • Each region holds one visible component (only the last component is seen if more than one is added to a single region) • Each component expands to fill the entire region by default Java GUI Programming

  17. BorderLayout NORTH WEST CENTER EAST SOUTH Java GUI Programming

  18. FlowLayout • Default layout for JPanel • Components arranged from left to right, top to bottom, as they are added • Components can be centered, or aligned to the left or the right of the container Java GUI Programming

  19. GridLayout • Container is logically divided into a grid • Components can be laid out in the order they are added (default), or any arbitrary order by using an overloaded add( ) method • All grid cells are of equal size, and each component expands to fill its cell Java GUI Programming

  20. Taking stock • So far we’ve looked at how we can make GUIs look the way we want them to… • … but we also need to look at how we can make them work the way we want. • End of lecture 1. More later :-) Java GUI Programming

  21. Anatomy of a GUI Program • Graphical components (Visible bits which generate actions) • Listeners (Listen for actions and respond in a useful way) • Application code (Performs the donkey work) Java GUI Programming

  22. Analogy • ‘User interface’? Dial • ‘Listener’? Variable resistor • ‘Application code’? Volume changes Java GUI Programming

  23. Event-driven Programming • Order of execution is governed by user • Program responds to events generated by user interaction with GUI components • Swing achieves this by using events, event listeners and event handlers Java GUI Programming

  24. Quit Initialise Wait for event Interaction with widget Code executed Automatic method call EventObject generated A Diagram Handler processes Event occurs Listener receives Java GUI Programming

  25. Events • Common events are keystrokes, mouse clicks and mouse cursor movement across components (also known as rollovers) • Programmer doesn’t (usually) need to create them by hand… • … Swing generates events automatically for all common interactions with GUI components… • …we just need to know what kind of event is generated for each action, and how to listen for it Java GUI Programming

  26. Some Events • ActionEvent – when a JButton is clicked • ChangeEvent – when a JSlider is moved • ItemEvent – when a list item is selected • KeyEvent – a key stroke • MouseEvent –mouse movement or click Java GUI Programming

  27. ActionEvent generated JButton Container (left click) MouseEvent generated (right click) Event examples • Currently, these events fire off into space… Java GUI Programming

  28. Event Listeners • Events are useless to us if we don’t know they’ve occurred (seems obvious, but is a common gotcha) • For each component we expect to generate an event, we register an event listener to deal with it (one listener can handle one or more components). • Listener can then execute useful methods depending on the type of event • The listener can also tell which widget generated the event by calling the event’s getSource( ) method, which returns a reference to the widget. Java GUI Programming

  29. Event Listeners (continued) • Each listener must implement certain method(s), which are automatically called when the relevant event is generated : • Example – ActionListeners must implement the actionPerformed( ) method, which is called whenever the listener detects an ActionEvent • See the examples on the web page for more in-depth information • We are now at the stage where we can create GUIs that do more than just look nice. Almost… Java GUI Programming

  30. Event Handlers • Event handlers are just pieces of code that do useful things (no different to standard code in appearance) … • …the difference is they are only executed when specific events occur (ie the user determines the execution path) • Event handler code must be called by a listener, or included within a listener method, or once again, events are useless to us (another common gotcha) Java GUI Programming

  31. Initialise component Define and register listener Call application method when event occurs Define application method Event handling in WidgetDemo comboBox = new JComboBox(names); frame.add(comboBox); comboBox.addItemListener ( new ItemListener() { public void itemStateChanged(ItemEvent ie) { changeLandF(selectedName); } } ); changeLandF(arg) { UIManager.setLookAndFeel(arg); } Java GUI Programming

More Related