INSTITUTIONEN FÖR Tool Kits, Swing SMD158 Interactive Systems Spring 2005 Jan-28-05 2002-2005 by David A. Carr 1 L Overview Tool kits in the abstract An overview of Swing/AWT Jan-28-05 2002-2005 by David A. Carr 2 L INSTITUTIONEN FÖR Tool Kits in the Abstract Jan-28-05 2002-2005 by David A. Carr 3 L
Remember - An Interactive Systems View of the Software Functional Core (FC) Dialog Control Interaction Objects Window System Device Drivers Tool kits are libraries of interaction objects Jan-28-05 2002-2005 by David A. Carr 4 L Tool Kit Development In the early days, graphics systems had many different physical input devices: - Knobs, thumb wheels, tablets, buttons, switches, keyboards, track balls, mice, etc. Then, it was discovered that graphics plus one device could be used to emulate others. - Virtual devices were born. - E.g., on screen buttons, a pointer, and 1 button could replace a row of buttons. Since these virtual devices were reused often, they were: - Regularized and made into logical devices called widgets, controls, interaction objects, - Grouped together into tool kits. Jan-28-05 2002-2005 by David A. Carr 5 L A Architectural View of Widgets A widget can be view as a small UI and with an MVC architecture - Model is very simple. E.g., a button has one ordinal value. - Controller implements the logic - View the appearance Widgets can be classified according to their models - Buttons, one nominal value - Sliders, one bounded, quantitative value - Menus, one from a large group - Text boxes, one value with textual representation from a (nearly) infinite set Note, the similarity of behavior of each group combined with the different appearance that is possible led to the separation of the view and controller. But, in practice the principle of consistency as led to one view per widget and merging of the view and controller Jan-28-05 2002-2005 by David A. Carr 6 L
Attributes of Widgets Acquire/release - Are the interactive resources allocated? yes = acquired - E.g., a pull-down menu. Enable/disable - Can the widget be manipulated? yes = enabled - E.g., graying out a menu item Active/inactive - Is the user interacting? Yes = active Echo - Reflects the current value. Jan-28-05 2002-2005 by David A. Carr 7 L INSTITUTIONEN FÖR An Overview of Swing/AWT Jan-28-05 2002-2005 by David A. Carr 8 L Relationship Between AWT and Swing AWT was the first Java UI tool kit - Portability in AWT relied on peer components - AWT encapsulated native components, so widgets were slightly different from platform to platform Swing is: - Built on top of AWT - Entirely written in Java - Swing components behave the same on different platforms Swing is the path for future UI developments in Java Jan-28-05 2002-2005 by David A. Carr 9 L
The Swing package Can be divided into four parts: - Components + GUI components such as buttons, scroll bars, etc. - Layout Managers + Controls the layout of the GUI components - Graphics + Colors, fonts, images, drawing primitives, etc. - Events + Signaling of user interaction Jan-28-05 2002-2005 by David A. Carr 10 L INSTITUTIONEN FÖR Components Overview of the GUI components in Swing Jan-28-05 2002-2005 by David A. Carr 11 L Overview of Components JComponent AbstractButton STANDARD DIALOGS JLabel JList... JTextComponent... JPanel JToggleButton JButton JMenuItem JTextArea JTextField JEditorPane JCheckBox JRadioButton JMenu JRadioButtonMenuItem JCheckBoxMenuItem JPasswordField JTextPane Jan-28-05 2002-2005 by David A. Carr 12 L
Windows, Child Windows, Applications, & Applets JFrame is the base class for an application - It contains a root pane, which holds other panes + Window decorations + A content pane (contentpane, getcontentpane) + Most panes are JPanel objects by default - A pane is: + A graphical area + A container + The root pane is equivalent to a window JApplet is just the version of an applet Jan-28-05 2002-2005 by David A. Carr 13 L Panes Provide basic containment of components Variations are: - JTabbedPane, layer of components usually panes - JScrollPane, standard window area - JSplitPane, tiled window area Jan-28-05 2002-2005 by David A. Carr 14 L Selection Widgets JList, selectable list JComboBox, selectable list with a button displaying the current value Dialog-box based (JDialog is parent) - JColorChooser, color palette - JFileChooser, standard file selection dialog Jan-28-05 2002-2005 by David A. Carr 15 L
Labels and Buttons JLabel is a basic label containing text, an icon, or both Buttons come in many flavors - JButton, basic push button - JToggleButton, has on/off state + JCheckBox, different view + JRadioButton, mutually exclusive button in a group - JMenuItem, menu component Jan-28-05 2002-2005 by David A. Carr 16 L INSTITUTIONEN FÖR Layout managers Automatic layout of components in a pane Jan-28-05 2002-2005 by David A. Carr 17 L The Standard Managers Flow, left-to-right, top-to-bottom Grid, in an array with all widgets of equal size Border layout, 5 regions: north, south, east, west, & center Card, pile of tiles (AWT, see JTabbedPane) Grid bag, Grid with uneven sizes, items can take more than one position (AWT) Box, Swings answer to grid, vertical or horizontal row Jan-28-05 2002-2005 by David A. Carr 18 L
Layout Appearance Flow Grid Border Jan-28-05 2002-2005 by David A. Carr 19 L Grid Bag Layout Appearance gridx, gridwidth Column 0 Column 1 Column 2 Row 0 Comp 1 Component 2 gridy, gridheight Row 1 Row 2 Component 3 Component 4 Component 5 Jan-28-05 2002-2005 by David A. Carr 20 L Complex Layout Base on Boxes Jan-28-05 2002-2005 by David A. Carr 21 L
Code for Complex Layout // create parameters panel for hierarchical clustering algorithm parameters = new HierClusterParms(dInitial,dMax,bMax,allEdges, thenetwork); // create the control button panel mgr = new BoxLayout(simControl,BoxLayout.X_AXIS); simcontrol.setborder(borderfactory.createtitledborder( BorderFactory.createLineBorder(Color.darkGray), "Simulation Control")); simcontrol.add(step); simcontrol.add(run); // create the file selection panel topofile = new JFileChooser(parmPath); tfile.setborder(borderfactory.createtitledborder( BorderFactory.createLineBorder(Color.darkGray), "Topology File")); tfile.add(topofile); Jan-28-05 2002-2005 by David A. Carr 22 L Code for Complex Layout // Swing UI elements JButton step = new JButton("Step"), run = new JButton("Run"); JCheckBox dispalllinks; JTextField maxd, initiald, maxb, root; JLabel rootrange; Box dinitrow = new Box(BoxLayout.X_AXIS), dmaxrow = new Box(BoxLayout.X_AXIS), bmaxrow = new Box(BoxLayout.X_AXIS), rootrow = new Box(BoxLayout.X_AXIS), alledgesrow = new Box(BoxLayout.X_AXIS); public void createpanel() { // set the layout manager, boarder setlayout(new BoxLayout(this, BoxLayout.Y_AXIS)); setborder(borderfactory.createtitledborder( BorderFactory.createLineBorder(Color.darkGray), "Hierarchical Clustering Parameters")); Jan-28-05 2002-2005 by David A. Carr 23 L Code for Complex Layout // create the Swing controls maxd = new JTextField(new String(Integer.toString(dMax)), 5); maxd.setmaximumsize(maxd.getpreferredsize()); initiald = new JTextField(new String(Integer.toString(dInitial)), 5); initiald.setmaximumsize(initiald.getpreferredsize()); maxb = new JTextField(new String(Integer.toString(bMax)), 5); maxb.setmaximumsize(maxb.getpreferredsize()); root = new JTextField("0", 5); root.setmaximumsize(root.getpreferredsize()); nnodes = (thenetwork!= null)? thenetwork.nodecount() : 0; if (nnodes > 0) { rootrange = new JLabel( "Number of root node [0.." + new String(Integer.toString(nNodes-1)) + "]"); } else { rootrange = new JLabel("no network loaded"); } dispalllinks = new JCheckBox("",allEdges); Jan-28-05 2002-2005 by David A. Carr 24 L
Code for Complex Layout // add labels and fields dinitrow.add(new JLabel("Initial offer distance")); dinitrow.add(box.createhorizontalglue()); dinitrow.add(initiald); add(dinitrow); dmaxrow.add(new JLabel("Maximum offer distance")); dmaxrow.add(box.createhorizontalglue()); dmaxrow.add(maxd); add(dmaxrow); bmaxrow.add(new JLabel("Maximum childern")); bmaxrow.add(box.createhorizontalglue()); bmaxrow.add(maxb); add(bmaxrow); rootrow.add(rootrange); rootrow.add(box.createhorizontalglue()); rootrow.add(root); add(rootrow); alledgesrow.add(new JLabel("Display Inactive Links")); alledgesrow.add(box.createhorizontalglue()); alledgesrow.add(dispalllinks); add(alledgesrow); Jan-28-05 2002-2005 by David A. Carr 25 L INSTITUTIONEN FÖR Drawing graphics Jan-28-05 2002-2005 by David A. Carr 26 L Swing Graphics Standard graphics in Swing is based on the Graphics object, which is actually an AWT class Graphics - Abstract class that defines a device-independent interface to graphics - Cannot be constructed directly - Can be obtained by implementing the paintcomponent() method + paintcomponent() must call super.paintcomponent() as the first line + paint() in AWT Jan-28-05 2002-2005 by David A. Carr 27 L
How to draw graphics There are simple graphic primitives - drawline(), drawrect(), drawoval()... - fillrect(), filloval()... - drawstring(), drawimage()... But no drawpixel! You have to draw a 1 pixel long line. Colors and fonts also come from AWT Jan-28-05 2002-2005 by David A. Carr 28 L A Final Word AWT graphics were never very strong There are alternatives - Java3D for 3D graphics - Piccolo + 2D + Scene graph based + Automatic zoom and pan + Next time Jan-28-05 2002-2005 by David A. Carr 29 L INSTITUTIONEN FÖR Events Jan-28-05 2002-2005 by David A. Carr 30 L
Event Handling and Dispatching Events occur on every user input Swing and AWT events work in the same way Swing events are: - Component specific - Handled by an??listener interface - Objects register for event by calling add??listener(). - Objects stop listening by calling remove??listener(). Jan-28-05 2002-2005 by David A. Carr 31 L Multiple Listeners Swing supports a multicast model. - More than one listener can be added (and removed) from a source. - Deliver order is non-deterministic. - If order is important you must implement your own dispatcher. - Multiple listeners receive copies of original events if the event is modifiable. Jan-28-05 2002-2005 by David A. Carr 32 L Threads and Swing Events Swing is not thread safe. It is designed to run in one thread Swing events are dispatched in a special eventdispatching thread Painting and component layout are expected to occur within this thread. This thread is not the same thread as main(). - Once the frame/pane/canvas/ has been made visible you cannot dispatch events (paint, update) from main() without using special methods. Jan-28-05 2002-2005 by David A. Carr 33 L
Example, Listening for Window Events public class Driver extends JFrame implements WindowListener { addwindowlistener(this); public void windowdeactivated(windowevent e) { } public void windowclosed(windowevent e) { } public void windowdeiconified(windowevent e) { } public void windowopened(windowevent e) { } public void windowiconified(windowevent e) { } public void windowactivated(windowevent e) { } public void windowclosing(windowevent e) { System.exit(0); } Jan-28-05 2002-2005 by David A. Carr 34 L Questions Jan-28-05 2002-2005 by David A. Carr 35 L