next up previous
Next: Interactors Up: Interaction mechanisms Previous: Interaction mechanisms


The first interaction mechanism supported by the slate directly mimics the binding mechanism of the Tk canvas. With this mechanism, a command can be bound to an event and an item. For example, executing

  $slate bind $citem <Button-1> {puts !!}

will add a binding to citem. Whenever the mouse is clicked on item citem, the string ``!!'' is printed to the console.

In the presence of a visual hierarchy, bindings take on some subtle complications. In figure 5, for example, I want a click on either frame to be handled by the top-level item. Dragging these items should move the whole tree of items. The terminal item, however, should respond differently - in this case, I want clicking and dragging on the terminal item to create a new arrowed line and extend the end of the line to follow the cursor. Also, dragging on the text label will sometimes need to select a region of the text.

Our solution is to mark nodes of the tree: only marked nodes are able to respond to user input. Figure 6 illustrates a marked tree, in which nodes a and e are marked. With respect to any node, its root node is the root of the lowest marked sub-tree containing it. The top-level node is the root of the whole tree, and is implicitly marked. Conceptually, when an event occurs on an item, the event is propagated up the tree until it reaches a marked node, at which point the event is handled. This is illustrated at the left of figure 6: node a will handle events from itself, b, c, and d; node e will handle events from itself, f, and g.

In the current implementation of the Slate, nodes can only be marked when they are created. Returning to our earlier example, we can create a child item of a ComplexItem that responds to user input with code such as this:

  set flag [$slate createrootchild $citem rectangle 40 50 50 60 -fill red]
  $slate bind $flag <Button-1> {puts Foo}

Events can also be used with tags. For example, we can write

  $slate bind "fred" <Button-1> {puts "Clicked fred!"}

and any top-level or marked child item tagged with fred - that is, it and the nodes for which it handles events - will respond to the event.

If used without any hierarchy, the slate thus provides the same mechanism as the canvas for event-handling. The visual hierarchy aids more complex item construction without discarding this powerful mechanism. However, the binding mechanism is low-level, and complex user interaction built on this mechanism very quickly mushrooms into spaghetti-like code.



Figure 6: Events and interactors in the visual hierarchy

next up previous
Next: Interactors Up: Interaction mechanisms Previous: Interaction mechanisms