05-830, User Interface Software, Spring, 2001
Lecture 9,   February 28, 2001
Copyright © 2001 - Brad Myers

Toolkits: Intrinsics, Callbacks, Resources,
Widget Hierarchies, Geometry Management

(About 30-40 minutes)

Widgets as objects

• Menus, buttons, scrollbars
• Refresh themselves and handle input, redraw if change
• In Motif and Tk each widget is at least one window
  • Also Motif has "gadgets" which aren't windows
  • In Amulet, widgets are not windows
• Decorative lines, labels and boxes also are "widgets"

Intrinsics

• How the widgets are implemented
• Motif --  "fake" object system out of C (same in Andrew)
• Tk -- Tcl language
• Amulet -- Prototype-instance object system, constraints, Opal graphics model, Interactors input model, command objects

Resources

• Every parameter of widgets in Motif
  • Passed as a parameter to the create routine, set afterwards, or read from a configuration file
• Called "options" by Tk
• Amulet doesn't support having them in a file
• Each resource has a default value defined by the class
• In an X file = appl.widget1.resource: value
appl.widget1.widget2.resource: value
*.resource: value
• "sensitive" to grey-out
• "resizable" for windows

Callbacks

• In Motif, associate C procedures with widgets
  • Many different callbacks for the same widget
    • create, start, abort, finish, destroy, ...
  • Registered (set) at widget creation time, invoked at run time
  • Are "resources"
  • There are also "actions" which are internal to the widget and called by events.
  • Not usually set by programmers
  • Parameters: widget, client data, value
• In tk, associate tcl script with "events" in widgets
  • or the widget action if it has one
• In Amulet, invoke Command Objects on "interactors" or widget finish, and call-back is the DO method.

Widget Hierarchies

• Motif-Primitive adds 3-D shadow
  • (picture)
  • Label adds string or pixmap display
    • Push-button adds accepting input
• Composite is for geometry management
  • Constraint = how size and position of children managed
    • Manager = 3D shadows
• Shell = windows
• Inheritance down the parent or class hierarchy
• Java object hierarchy contains about 500 classes
  • See the list for 1.1.5
  • Over 50 are for AWT (user interface)

Geometry Management

• Widgets don't set their own location.
  • Widgets put into special group objects called "geometry managers" that perform the layout by setting the component's positions and size
  • Used in Motif and tk
• Each widget negotiates with parent for more room when resize
• Motif
  • RowColumn - add widgets and it lays them out
    • Treats all children the same, so not for ScrollBars
    • (picture)
  • Form - generic constrained layout
    • Put extra resources on the children widgets
    • "For details, see the Motif Reference Manual, because the complete behavior of Form is quite complicated."
    • Each edge can be constrained
      • at a position or offset from an edge of the Form
      • at an offset from an edge of another widget
      • percent of the way across the Form (edge, not center)
      • a percent calculated based on the initial position
    • If wrong, widgets are on top of each other
  • Two phases: bottom up requesting size, then top down setting size.
    • All done before windows are allocated
  • Unnecessary complexity: "XmCreateMenuBar actually creates a RowColumn widget, but with some special resource settings.... The Motif widget creation routines often have names that are different from the widgets they create."
  • (picture of code)
• Tk
  • All widgets must be in a geometry manager, or else not displayed
  • Any widget with any geometry manager
  • Layout depends on
    1. widget specified sizes
    2. programmer specifications,
    3. size of geometry manager itself
  • Widgets must adjust themselves to the size given
  • Geometry manager requests size recursively
  • Placer - specific location for each widget
    • Each widget treated independently
    • Place "anchor" in absolute coords or as a % of way across
    • then say which part of object is at the anchor
    • n, ne, e, se, ... center
  • Packer - "constraint based"
    • specify position of each widget in available space
    • side left, right, top, bottom
    • fill x, -fill y stretch widget to fill available space
  • Text
  • Canvas - mix graphics and widgets
• Amulet
  • Group can have the Am_LAYOUT slot set with a constraint that depends on other slots
    • Sets positions of parts by side effect
    • Default layout routines: Horizontal and Vertical layout, for lists or tables.
  • Rest done by arbitrary constraints

Standard Motif Application

1. Include Motif and widget header files
2. Initialize the toolkit: XtAppInitialize
   • reads resources, creates server connection, returns top-level screen pointer
3. Create the widgets and put them in composites ("parent")
   • "manage" the widgets (except when pop-ups)
4. Register call-backs with the widges
5. "Realize" the top level widget
   • Causes geometry management to be invoked
6. Start the main loop: XtAppMainLoop

#include <amulet.h>
main (void) {
  Am_Initialize ();
  Am_Screen
    .Add_Part (Am_Window.Create ("window")
      .Set (Am_WIDTH, 200)
      .Set (Am_HEIGHT, 50)
      .Add_Part (Am_Text.Create ("string")
        .Set (Am_TEXT, "Hello World!")));
  
  Am_Main_Event_Loop ();
  Am_Cleanup ();
}

#include <amulet.h>

main (void)  {
  Am_Initialize ();
  Am_Screen
    .Add_Part (Am_Window.Create ("window")
	       .Set (Am_WIDTH, 200)
	       .Set (Am_HEIGHT, 50)
	       .Set (Am_FILL_STYLE, Am_Amulet_Purple)
	       .Add_Part (Am_Button.Create ("button")
			  .Set_Part(Am_COMMAND, 
				    Am_Quit_No_Ask_Command.Create()
				    .Set (Am_LABEL, "Goodbye, world!"))));
  Am_Main_Event_Loop ();
  Am_Cleanup ();
}

#include <amulet.h>
Am_Define_Method (Am_Object_Method, void, quit_method, (Am_Object)) {
  cerr << "It was nice knowing you.\n" << flush;
  Am_Exit_Main_Event_Loop();
}

main (void) {
  Am_Object inter;
  Am_Initialize ();
  Am_Screen
    .Add_Part(Am_Window.Create ("window")
	      .Set (Am_WIDTH, 200)
	      .Set (Am_HEIGHT, 50)
	      .Add_Part(Am_Text.Create ("string")
			.Set (Am_TEXT, "Goodbye World!")
			.Add_Part(inter = Am_One_Shot_Interactor.Create())
			)
	      );
  inter.Get_Part(Am_COMMAND)
	Set (Am_DO_METHOD, quit_method);
  Am_Main_Event_Loop ();
  Am_Cleanup ();
}

Minimal Hello-World in Java as Applet using AWT

import java.applet.Applet;
import java.awt.Label;
public class AWTHelloWorld
  extends Applet
{
  public void init ()
  {
    super.init ();
    add ( new Label ( "Hello World!" ) );
  }
}

Hello-World in Java as Applet or Application using Swing (In another file)

Goodbye-World in Java as Applet or Application using AWT (In another file)

Goodbye-World in Java as Applet or Application using Swing (In another file)

Back to 05-830 main page