2.1 Our First Graphical Application

Figure 2.1 shows a screen dump of our first graphical application. It allows to enter text into the entry field. Pressing the button toggles the capitalization of the text in that entry field.

---

Figure 2.1: Our first graphical application.

---

The program for the small graphical application is concerned with the following three issues:

widgets

Create the graphical entities called widgets. The application consists of three widgets: a toplevel widget (this is the outermost window), an entry for entering text, and a button.

geometry

Arrange the entry and button such that they appear inside the toplevel widget.

actions

Attach an action to the button widget such that pressing the button changes the capitalization of the entry text.

In the sections below, we exhibit the code handling these issues. The complete application then has the following structure:

<Widget creation> 
<Geometry management>

2.1.1 Widgets

The following program fragment

<Widget creation>=

W={New Tk.toplevel tkInit(title:'Capitalization')}
E={New Tk.entry    tkInit(parent:W)}
B={New Tk.button   tkInit(parent: W
                          text:   'Change Capitalization' 
                          action: <Action definition>)}

creates and initializes the widget objects of our application. Creating and initializing a widget object creates a graphical image for the widget object. We refer to the graphical image just as the widget. Most often we do not distinguish between the object and its widget. All but the toplevel widget are linked by the parent features: this defines a widget hierarchy for closing widgets and geometry management.

2.1.2 Geometry

Here we define the geometry for the entry and button widgets:

<Geometry management>=

{Tk.send pack(E B fill:x padx:4 pady:4)}

2.1.3 Actions

The remaining program fragment:

<Action definition>=

proc {$}
   S={E tkReturn(get $)}
in 
   {E tk(delete 0 'end')}
   {E tk(insert 0 {Map S <Change capitalization>})}
end

defines the action as a procedure to be executed when the button is pressed. It retrieves the current content S from entry E, clears E, and reinserts S in E, but with toggled capitalization. tkReturn illustrates another important issue: returning values from widgets.