The PAGE Interface

This section discusses the menus and several of the windows in the PAGE interface. Again, the PAGE interface is a modified version of the Visual Tcl interface. It was modified because some of the original facilities and features of Visual Tcl are inappropriate for PAGE or because the Visual Tcl documentation is in such a sad state that I cannot decipher them.

When PAGE is executed initially, a number of windows are spread across the screen in what may appear as random locations and sizes. I have arranged them at the corners and the edges so that they will be out of the way of the GUI you are building. They should then be resized and moved to more desirable locations. Follow such placement with Main Menu selections such as Windows->Save Window Locations or File->Quit and the geometry of the windows will be saved in the .pagerc file and used when PAGE is next invoked.

Many PAGE parameters are are saved from one invocation of PAGE to the next in the file “HOME/.pagerc”. Included are the preferences and the geometry (size and location) of the various windows in the page interface as described above. This file is saved when the user does a quit.

Start PAGE by executing ‘page’ on Linux, winpage.bat in a DOS window, or activating the PAGE icon on the Windows desktop. The page and winpage.bat scripts may specify a filename. If the filename includes an extension, it must be ”.tcl”; in the case of no extension or a final ”.”, the extension ”.tcl” will be appended to the filename.

The user is then greeted with a number PAGE windows and the main menu.

The default interface for PAGE presents small font sizes and the Tk default scheme of black on gray. So for my personal use I made the fonts larger and wanted the background color Wheat. See the section on Defaults and Preferences.

PAGE may be terminated with File->Quit which cleanly stops execution while saving preferences and window geometry; Control-Q also quits PAGE cleanly.

Widget Toolbar

The Widget Toolbar is where one obtains widgets for inclusion in the GUI. One begins building a GUI by selecting Toplevel with Button-1 and a blank toplevel window appears on the screen. To add widgets to the toplevel, click on the widget in the toolbar and then click in the parent. The upper left hand corner of the widget appears at the spot where the user clicked.

The Widget Toolbar appears below:


Clicking on the gray bands causes the corresponding section to collapse or expand.

Note that the above image differs from that of version earlier than 4.10 in that the Toplevel widget does not appear. That is because I decided to have PAGE generate the Toplevel widget automatically at start up. Since only one Toplevel widget is allowed, there is no need to a Toplevel entry in the Widget Toolbar. Similarly I have never figured out the use of the Pointer button, so it too is gone.

Attribute Editor

When one selects a widget the Attribute Editor displays all attributes of that widget. The plum colored fields are not writable the others are. For instance, the Attribute Editor shown below allows one to change the title from “New Toplevel” to something more meaningful. That field is used to generate the Python class name for the GUI.


There is the Alias field which is writable by the user. The user can provide an alias to improve the readability of the generated code.

Widget Tree

The Widget Tree shows all of widgets created by PAGE and how they are nested within their parent widgets, see below. The labels in the tree show the widget class as well as the program alias used in the generated Python code.


The above tree shows that the selected widget is a Button nested in a Frame that is the first tab of a TNotebook within the Toplevel window. The alias which appears in the generated Python code for the Button is Button3; the Frame, Second; the TNotebook, TNotebook1; and finally the Toplevel window is implemented by the Python class - Special.

The Widget Tree is a very convenient place to select a widget with Button-1 especially for selecting widgets within more complex widgets like TNotebooks. I frequently use this window to select the widget I want to modify and occasionally it fails to select the widget, particularly when doing copy and paste operations. For unknown reasons, if I go and select another widget and then reselect the widget I want, it usually works.

When you make a change which should appear in the Widget Tree, the Widget tree may not be updated until you hit the update button in the upper left of the Widget Tree. The number of such cases has been reduced.

As described below in the section Using PAGE, the Widget Tree is very important when trying to move or select some of the more complex widgets like paned windows or scrolled windows.

Bindings Window

This window which appears when Bindings is selected from the Widget menu allows one to add an event one of the possible bindings shown for the widget and to specify the associated action. In the image below the event <Button-2> has been added for a Button widget and “button_handler2” is specified for the action.


Preferences Window

The Preferences Window allows one to set some PAGE preferences. I considered removing the Preferences Window completely, but on further thought I realized that the this is indeed a complex subject involving preferences for both PAGE and the GUI generated by page. Please see the section on Defaults and Preferences.

The Colors tab of the Preferences Window is shown below:


In version 4.6, the IDE entry command has been added to support the new function of opening the users favorite IDE with stored versions of the GUI and support modules. You will notice that the example shows the full path of the IdleX.

The Basics tab of the Preferences Window is shown below:


Python Console

When the user generates Python for either the GUI module or the support module as described above, a separate Python Console window appears with the generated code inside the upper text box. Thus one can see both the GUI module and the support module side by side as of version 4.6.

The Python Console has the following appearance:


The upper text box contains the generated text with a bit of colorization applied; it is editable. The lower text box contains any generated output from running the source program. The Python Console is a ttk::panedwindow which allows one to move the sash between the two text boxes.

To execute the generated Python module, just click on the Run button of the ‘Python console’. Unless you have written the necessary functions not much will happen other than providing a preview of the GUI. The skeletal functions that are generated automatically for callbacks print the function name in the Execution Output window using the Print function. On Linux or OS X the function name will appear immediately in the execution window; on Windows, when execution is terminated. The Print function works fine for Python 2.7 or 3.x. See the penultimate paragraph of this section which discusses this more. As explained in the Rework section, the GUI module will not execute unless there is a existing support module. If the GUI code has been modified to include new callbacks then one shouldn’t expect the GUI code to execute until those callbacks have been incorporated in the support module.

There are several buttons along the bottom of the window. They behave as follows:

  • Save - Saves the contents of the upper text box into a file. It also saves the tcl file.
  • Run - Attempts to execute the GUI source module even if the displayed code is the Python support module. It also may save the Python and the tcl file. The shortcut for run is <Control-r>.
  • Close - Closes the Python console. The shortcut is <Control-w>.

The upper text box can be modified (edited) by selecting a character position with the mouse and typing. Such changes will be saved with either the Save or Run buttons.

As you can imagine the colorization is not fancy. Keywords, comments, and strings are set to distinct colors. The defaults are set to reasonable colors for light backgrounds. One place you may have trouble is with quotes that bracketed by ‘’’ or “””. You should start a line with one of these delimiters and end a following line with one.

The Run Button attempts a trial run on your GUI. If you have enough skeleton functions in the support module and there are no errors in the generated code, you should see the python code executed and the GUI window will appear. From there you close the Python window go back to PAGE and refine the GUI by moving widgets around, adding additional widgets, or changing attributes.

A problem was reported when users attempt to resize the window. Recent changes allow the window to gracefully resize. This can be necessary if the screen resolution will not allow the entire window to be displayed. When the window is made smaller, it may appear to loose the Execution pane. However, it can be recovered by moving up the sash of the paned window. When one quits and restarts PAGE after resizing the Python console, the new size will have been saved in ~/.pagerc and used when subsequently invoking the Python console including the placement of the sash. So invoke the Python console, resize it, re-position the sash quit PAGE, and restart PAGE to use the new Python console.

Also, scroll wheel support in the Python console works. To use the scroll wheel in Windows one must focus on the desired pane first. Finally, when the Python Console is in focus, Control-P and Control-U will have the effect of generating the GUI module and the supporting module respectively.

Execution of the python module on Linux communicates with the console through pipes; thus output from the execution now appears immediately in the Execution Output pane. Coupled with a recent change which embeds a print statement in the generated dummy functions, if a user specifies a command for a button, for example, and generates the python and runs it from the Python Console, and selects the button, the name of the command will appear in the Execution Console. This is useful because no output from selecting the widget means that you have not defined a callback function. Unfortunately, on Windows the this output does not appear until the execution terminates. (I have not been able to get Tcl pipes to work with Windows. I would appreciate help or suggestions.)

Color Dialog

There are many cases where when setting preferences in the Preferences window or attributes for a widget in the Attribute Editor one selects a little button with an ellipsis and the invokes a color dialog window:


When this window pops up you are given several different ways of selecting a color:

  • Pick a color in the multicolored window with your mouse.
  • Enter values in the Red, Green, and Blue entry fields.
  • Enter an Hex color value such as #f5deb3 in the Color entry field. That is the color wheat.
  • Enter a color name such as wheat in the Color entry field.


Since PAGE is aimed at using ttk widgets which will obey the canned themes which are basically black on gray, I want the background of created windows to be gray. Unless you are prepared to work with themes, I recommend that you stay with the tk default colors.

Dual Monitors

One user reported a problem involving dual monitors where he had opened PAGE with dual monitors set up with the second monitor to the right of the main monitor. He then dragged one of the PAGE windows to the monitor on the right. Later he disconnected the second monitor and reopened PAGE and was unable to see the window displayed on the nonexistent monitor. Version 4.8 attempts to fix this problem by relocating the wayward window in its default position. I have tested this code in a Windows virtual machine but do not have the hardware to test it on either Linux or OSX. I would appreciate any information from users using Dual monitors.