Version 0 of Building User Interfaces with Tcl and Tk

Updated 2001-10-05 13:25:14

Building User Interfaces With Tcl And Tk

                                        [John Ousterhout]

Tcl/Tk Tutorial, Part III Outline

  • Basic structures: windows, widgets, processes.
  • Creating widgets: class commands.
  • Widget commands.
  • Geometry management: the placer and the packer.
  • Bindings.
  • Other commands: send, focus, selection, window manager, grabs.
  • Two examples: showVars, mkDialog.

Structure Of A Tk Application

  • Widget hierarchy.
  • One Tcl interpreter.
  • One process (can have > 1 application in a process).
  • Widget: a window with a particular look and feel.
  • Widget classes implemented by Tk:
 Frame  Menubutton      Canvas
 Label  Menu    Scrollbar
 Button Message Scale
 Checkbutton    Entry   Listbox
 Radiobutton    Text    Toplevel

The Widget Hierarchy Types Of Windows Creating Widgets

  • Each widget has a class: button, listbox, scrollbar, etc.
  • One class command for each class, used to create instances:
 button .a.b -text Quit -command exit
 scrollbar .x -orient horizontal

Configuration Options

  • Defined by class. For buttons:
        -activebackground       -disabledforeground     -justify        -underline 
        -activeforeground       -font   -padx   -width 
        -anchor -foreground     -pady   -wraplength 
        -background     -height -relief
        -bitmap -highlightbackground    -state
        -borderwidth    -highlightcolor -takefocus
        -command        -highlightthickness     -text
        -cursor -image  -textvariable
  • If not specified in command, taken from option database:
      -  Loaded from RESOURCE_MANAGER property or .Xdefaults file.
      -  May be set, queried with option command.
  • If not in option database, default provided by class.

Widget Commands

  • Tcl command for each widget, named after widget.
  • Used to reconfigure, manipulate widget:
 button .a.b
 .a.b configure -relief sunken
 .a.b flash
 scrollbar .x
 .x set 0.2 0.7
 .x get
  • Widget command is deleted when widget is destroyed.
  • Principle: all state should be readable, modifiable, anytime.

Geometry Management

  • Widgets don't control their own positions and sizes: geometry managers do.
  • Widgets don't even appear on the screen until managed by a geometry manager.
  • Geometry manager = algorithm for arranging slave windows relative to a master window.

The Placer

  • Simple but not very powerful.
  • Each slave placed individually relative to its master.

The Placer, cont'd The Packer

  • More powerful than the placer.
  • Arranges groups of slaves together (packing list).
  • Packs slaves around edges of master's cavity.
  • For each slave, in order:

The Packer: Choosing Sides The Packer: Padding The Packer: Filling Stretch widgets to fill parcels: The Packer: Filling, cont'd The Packer: Expansion Increase parcel size to absorb extra space in master:

The Packer: Expansion, cont'd Hierarchical Packing Use additional frames to create more complex arrangements: Connections

  • How to make widgets work together with application, other widgets? Tcl scripts.
  • Widget actions are Tcl commands:
 button .a.b -command exit
  • Widgets use Tcl commands to communicate with each other:
 scrollbar .s -command ".text yview"
  • Application uses widget commands to communicate with widgets.


  • Associate Tcl scripts with X events:
 bind .b <Control-h> {backspace .t}
  • Use tags to select one or more windows:
      -  Name of window: .b
      -  Widget class: Text
      -  All windows: all
      -  Arbitrary string: foo, bar, ...

Bindings: Specifying Events

  • Specifying events:

Bindings: Substitutions

  • % substitutions in binding scripts:
      -  Coordinates from event: %x and %y.
      -  Window: %W.
      -  Character from event: %A.
      -  Many more...
  • Examples:
 bind .c <B1-Motion> {move %x %y}
 bind .t <KeyPress> {insert %A}
 bind all <Help> {help %W}

Binding Order

  • What if multiple bindings match an event?
 bind .t a ...
 bind all <KeyPress> ...
  • One binding triggers per tag: most specific.
  • Default order of tags: widget, class, toplevel, all.
  • Can change tags with bindtags command:
 bindtags .b {MyButton .b foo all}
  • Can use break to skip later tags.
  • Note: these rules apply only to Tk 4.0.

More On Bindings

  • Text and canvas widgets support bindings internally:
      -  Associate tags with text or graphics:
 .t tag add foo 1.0 2.0
 .c create rect 1c 1c 2c 2c -tags foo
      -  Associate bindings with tags:
 .t bind foo <1> {...}
 .c bind foo <Enter> {...}
  • Bindings always execute at global level:
      -  If binding created in procedure, procedure's local variables aren't available at event- time.

Quoting Hell

  • Often want binding script to use some information from binding-time, some from event-time.
  • Use list commands to generate scripts.
  • Use procedures to separate event-time information from bind-time information.
 bind .x <1> {set y [expr $a + $b]}
 bind .x <1> "set y [expr $a + $b]"
 proc sety a {
    global b y
    set y [expr $a + $b]
 bind .x <1> [list sety $a]

Other Tk Commands

  • The selection:
 selection get
 selection get FILE_NAME
  • Issuing commands to other Tk applications:
 send tgdb "break tkEval.c:200"
 winfo interps
  • wish tgdb ppres
  • Window information:
 winfo width .x
 winfo children .
 winfo containing $x $y

Access To Other X Facilities

  • Keyboard focus:
 focus .x.y
  • Communication with window manager:
 wm title . "Editing main.c"
 wm geometry . 300x200
 wm iconify .
  • Deleting windows:
 destroy .x
  • Grabs:
 grab .x
 grab release .x

Example #1: showVars

  • Displays values of one or more values, updates automatically:
 showVars .vars name age ssn phone
 showVars, cont'd
 proc showVars {w args} {
    toplevel $w
    wm title $w "Variable values"
    frame $ -relief raised -bd 2
    pack $ -side top -fill x
    menubutton $ -text File \
        -menu $ -underline 0
    pack $ -side left
    menu $
    $ add command -label Quit \
        -command "destroy $w" -underline 0
 showVars, cont'd
 proc showVars {w args} {
    frame $ -relief raised -bd 2
    pack $ -side bottom -fill both
    label $ -width 20 -anchor center \
        -text "Variable values:" -font \
    pack $ -side top -fill x
 showVars, cont'd
 proc showVars {w args} {
    foreach i $args {
        frame $$i
        pack $$i -side top -anchor w
        label $$ -text "$i: "
        label $$i.value -textvariable $i
        pack $$ -side left
        pack $$i.value -side left
 showVars .vars name age ssn phone

Example #2: mkDialog Creates dialog box, waits until button pressed, returns index.

 mkdialog .d "File Modified" $msg warning \
 "Save File" "Discard Changes" "Return To Editor"
 mkDialog, cont'd
 proc mkDialog {w title text bitmap args} {
    toplevel $w
    wm title $w $title
    wm protocol $w WM_DELETE_WINDOW { }
    frame $ -relief raised -bd 1
    pack $ -side top -fill both
    frame $ -relief raised -bd 1
    pack $ -side bottom -fill both
    label $w.msg -wraplength 3i -text $text \
        -justify left -font \
    pack $w.msg -in $ -side right \
        -expand 1 -fill both -padx 3m -pady 3m

 mkDialog, cont'd
 proc mkdialog {w title text bitmap args} {
    if {$bitmap != ""} {
        label $w.bitmap -bitmap $bitmap
        pack $w.bitmap -in $ -side left \
            -padx 3m -pady 3m

mkDialog, cont'd

 proc mkDialog {w title text bitmap args} {
    set i 0
    foreach but $args {
        button $w.button$i -text $but \
            -command "set button $i"
        pack $w.button$i -in $ -side left \
            -expand 1 -padx 3m -pady 2m
        incr i

mkDialog, cont'd

 proc mkDialog {w title text bitmap args} {
    global button
    grab $w
    set oldFocus [focus]
    focus $w
    tkwait variable button
    destroy $w
    focus $oldFocus
    return $button


  • Creating interfaces with Tk is easy:
      -  Create widgets.
      -  Arrange with geometry managers.
      -  Connect to application, each other.
  • Power from single scripting language:
      -  For specifying user interface.
      -  For widgets to invoke application.
      -  For widgets to communicate with each other.
      -  For communicating with outside world.
      -  For changing anything dynamically.

An Overview of Tcl and Tk - An Introduction To Tcl Scripting - Writing Tcl-Based Applications in C