The previous post laid out the basics for creating windowing (GUI) apps in Python using the tkinter (Tk Interface) module. The module has been part of the standard library since Python versions 2.7 and 3.1.

In this post, as a small seasonal gift, I’ll start presenting a working GUI application — a script-driven pre-fix calculator with variables. Between the calculator code and its window code, there is too much for one post, so there will be (at least) a second part next week.

When run, the app looks like this:

The script shown:

setvar x 2.71828
setvar y 3.14159

power
    ln mul x y
    2

Uses pre-fix notation (and thus needs no parentheses) to implement this bit of math:

The first two lines set variables, x and y, to 2.71828 and 3.14159 respectively. The fourth line sets up an exponential expression (power operator); the fifth line takes the natural log of their product, and the last line provides the exponent (2). The result, 4.599859774787909, is displayed in the black text field above the script.

Pre-fix notation puts the operator before any arguments it processes. For example:

add 2 5

The add operator expects two terms to sum and, in this case, finds 2 and 5. So, this is a valid pre-fix expression, and it has the value 7. More complex expressions don’t require parentheses because there is no ambiguity. For example, consider:

sqrt mul add 2 5 add 3 log10 7

The sqrt (square root) operator expects a single value, so it evaluates the mul operator. The mul operator expects two values, so it first processes the first add. Which expects two values and finds 2 and 5 (more correctly, it evaluates the next two terms which evaluate respectively to 2 and 5). It has its values, so it sums and returns 7, which provides the first value for the mul operator. Wanting a second value, the mul operator evaluates the second add. Which expects two values and finds 3 and the log10 operator. Which expects a value and finds 7, so it returns log₁₀(7)≈0.845 as the second value for the add operator. Which can now sum its values and return ~3.845, providing the second value for the mul operator. Which can now do 7×~3.845=~26.915686, providing a value for the sqrt operator.

The sqrt operator, which kicked off the chain of evaluations, can now calculate and return the final result: 5.188032987568583.

Indentation can be helpful in making clear which values go with which operators:

sqrt
    mul
        add
            2
            5
        add
            3
            log10
                7

Breaking it down this far is extreme, but it illuminates the inherent tree structure of expressions. (The other two modes, post-fix and in-fix, create similar trees but with a different shape.) Any valid expression has a tree structure associated with it.

Lastly, in the first formula above, the first two lines (with the setvar operator) are each separate expressions and each returns a value. A third expression begins with the power operator on the fourth line. The three tree structures look like this:

setvar
    x
    2.71828

setvar
    y
    3.14159

power
    ln
        mul
            x
            y
    2

The engine returns the last value as the result (but see below for viewing all results).

The app works like a small Windows Notepad. It’s mainly a text area in which the user writes a simple formula script. The usual file menu allows loading and saving scripts:

The File menu provides the standard options. The user either starts with a blank textbox and enters a script or loads a saved one and clicks the [Result] button (or presses F5). The app parses the script into a string of tokens and passes that string to an engine that executes the code. More on that when we look at the code.

The Edit menu allows copying the result or source text to the clipboard.

Note that nothing prevents the user from selecting all the result or source text (either with the mouse or by clicking in and typing Ctrl+A) and then typing Ctrl+C to accomplish the same thing. The menu items and their associated accelerator keys just make it easier (and we’ll see how easy it is to do in the code).

The View menu lets the user see all the results produced (earlier results will usually be the value of setvar operations, but there are other possibilities). The first, F1, shows all results in order. The second, F2, shows any variables created.

That’s all there is to the operation of the app. Type a formula and evaluate it for an answer. The code implements a variety of math functions along with a number of potentially useful constants (like pi and e). The design makes it easy to add additional functions or constants.

We’ll return to this when we look at the calculator code. In the next section we look at the code implementing the window shell.

A shell is really what the window app is. The calculator code is well-separated from the window code, so the window app can potentially support other simple script languages implementing other simple tasks. To illustrate this, later I’ll implement a simple word-counter to replace the calculator parsing and execution code:

The possibilities are only limited by your imagination.

To make the app nice to use, we’d like it to remember its previous size and location on the screen. That requires saving that information somewhere and reloading it when the app starts. There are several ways to save a program’s state, but the simplest might be to use a file. There are several types of files, but the simplest are text files. There are several types of text files, but one simple (and popular) one, especially in Python, is a JSON file. So, let’s do that:

The code is pretty simple (and documented). A new instance loads the settings from the JSON file (if the file exists — lines #12 to #20). Then the configuration is checked to ensure expected options exist (lines #22 to #48).

Two properties, window and options, make it easier to access the two groups of settings. A save method writes the settings back to the JSON file.

We test the class:

Which when run prints:

<Configuration @01f919da4ec0>
{'x':200, 'y':100, 'w':460, 'h':240, 'min.w':220, 'min.h':100}

Assuming the expected file, nominally tk_calc.json, does not exist (or does but still has the default settings). You can, of course, arrange for the Configuration class to use a different filename or look for the file in a special location other than the current working directory (presumably the same one as the app).

Now we’ll look at the window shell application. It’s long, so I’ll break it into sections, starting with the class’s DOC text:

Tk Calculator Application class.

Implements a multi-line textbox for a user script and delegates
to a backend calculator (or other engine) to execute the script.

Create a new Application:
    app = Application(file='', mode='calc')

    if file is provided, calculator loads named file
    if mode is provided, calculator loads named mode

Attributes:
    filename            name of current source file
    mode                type of calculator to be
    dirty               current textbox text has been modified
    nofile              no file loaded or save-as
    config              Configuration object
    calc                Calculator object
    root                Tk root
    result              Tk string variable for result textbox
    output              Tk Entry for result display
    source              Tk ScrolledText for source text
    status              Tk Label for status results
    mbar                Tk Menu for menubar
    <various>           other Tk widgets used in app

Methods:
    calculate           execute the script
    open_source_file    open and load a source code file
    load_source_file    load a source code file into Textbox
    save_source_file    save the Textbox text to a text file
    update_title        update the window title (with new filename)
    update_status       write to the result
    file_new            reset everything
    file_open           open a source file
    file_save           save current source to file
    file_save_as        save current source to a new file
    copy_source         copy all source text to clipboard
    copy_result         copy current result to clipboard
    view_results        view all results (incl intermediate ones)
    view_variables      view current variables
    view_operators      view calculator operators
    about               about this application
    txt_keypress        textbox key handler
    app_keypress        application key handler
    app_exit            destroy application window
    _create_widgets     create and place the window widgets
    _create_menubar     create the menubar

As you see, lots of properties and methods.

Here’s the first part (with the above DOC text removed for clarity):

This imports what we need imported (lines #1 to #8), defines some global variables we’ll need (lines #10 to #16), and starts the Application class definition (line #18).

The only method shown here is the initialization method for new instances (lines #21 to #45). It saves the two passed parameters, file and mode and sets two file-related flags (lines #23 to #26). Then it creates a Configuration instance and a Calculator instance (lines #28 to #32). The Configuration instance provides application settings in self.config. The Calculator instance in self.calc will handle everything related to “calculating” the “source code”. (We won’t get to the calculator until next week.)

Lines #35 and #36 call methods that build the window. Line #38 displays the newly built window. Lines #39 to #41 load a source code file if a filename was provided (via the file parameter). Finally, lines #43 to #45 update the window title (with the possible filename), update the status bar, and set the app focus to the source code textbox.

At this point, the app is initialized and ready to go.

Let’s jump to the bottom of the code and look at _create_widgets:

Refer to the screen grabs above to see the window created by this code. Line #313 calls tk.Tk to get things rolling and in the next line hides the window the call creates.

Lines #316 to #326 get the settings for window size and location and use them to set the window’s geometry and minimum size. Lines #328 to #331 bind important keypress events to three methods that will handle them.

Lines #333 to #335 set the Tk theme (because the default ignores certain configuration options). Line #338 creates a Tk variable that we’ll later bind to the result textbox.

Lines #340 to #344 create and configure the main window frame and three sub-frames that fit inside it for the result bar across the top, the main text window, and the status bar across the bottom. Note how line #365 binds the Tk String variable in line #338 to the result textbox. Now setting the variable also sets the text in the widget. Line #366 makes the textbox read-only, but if the user did type text into the textbox, it would be available through the variable.

Lines #346 to #370 create and configure the widgets in the result bar. Lines #372 to #377 create and configure the textbox widget that will contain source code. Lines #379 to #395 create and configure label widgets for the status bar.

Lastly, lines #397 to #401 pack the widgets in their respective frames.

Here is the _create_menubar method:

Note that the code above shortens a few parts to make them fit. The code in the ZIP file (available next week) is the correct version.

The previous post went over menus in enough detail that there’s not much to say here.

Now we’ll go back and see the middle parts of the code. Firstly, two critical methods, app_exit and calculate:

The first method is called when the user selects Exit from the File menu, or presses Alt+X, or presses the Escape key. We’ll see how the app handles Alt+X below. Recall how line #329 in _create_widgets bound the Escape key to the app_exit method.

Note how app_exit first checks the self.dirty flag to see if the source text should be saved (lines #49 to #53). It also gets the window’s current geometry and writes it to the configuration object (lines #55 to #63) before saving the settings JSON file.

Note also that app_exit takes optional positional parameters. No parameters are passed for menu or button bindings, but an event object is passed to methods that handle keypress events. We don’t care about the event here but do have to provide the possibility of receiving one.

The calculate method is called when the user presses F5 (recall line #330 in _create_widgets) or clicks the app’s [Result] button (created in lines #347 to #355 of _create_widgets). Most of the work is delegated to the calculator object, which handles the text parsing into tokens as well as executing those tokens. The call to the calculator is wrapped in a try/except to catch any errors due to user input.

Next, three methods concerned with loading and saving source code files:

The open_source_file method assumes that self.filename is valid and uses it to open and read a text file. It passes that text to the load_source_file method sets the self.dirty and self.nofile flags, clears the result variable, loads the passed source text into the source textbox, and updates the window title and status bar.

The save_source_file is essentially the counterpart to the load_source_file. It saves the source code text to a file (again assuming self.filename is valie).

Next, a pair of small utility methods for updating the windows title and status bar:

The next two sections contain the methods that handle the menu selections. First the File menu suite:

The four methods have the usual New, Open, Save, and Save As behaviors. It’s in these methods that the self.dirty and self.nofile flags come into play. For instance, if the user selects Save but there isn’t a file loaded, Save jumps to Save As.

The file_open method uses the askopenfile function in the tkinter.filedialog module to handle the dialog and to return the selected file data. There is also an askopenfilename function that only returns a filename. An alternate design uses the latter to get the filename and combines open_source_file and load_source_file into a single method. The functions are split here because I opted to use askopenfile.

The file_save_as method uses the asksaveasfilename function from the same tkinter.filedialog module. Note how these functions allow setting the initial filename and directory along with other parameters.

Here are the other menu selection methods:

Note how easy it is to put text into the Windows clipboard (lines #225 and #226 and #235 and #236). The View menu methods give the user access to some calculator basics.

Lastly, two important methods that handle keypress events for the source code textbox and for the whole app (note that both methods receive an event object with information about the event):

The txt_keypress method (bound to the source textbox in line #376) receives an event for all keypresses seen by the source code textbox. We don’t do anything with the event object; we just use the fact of a keypress to check the state of the textbox (line #261) and set the self.dirty flag if the text has been modified.

The app_keypress method (bound to self.root in line #331) receives an event for all app keypresses. We use the event state and keysym (key symbol) attributes to detect relevant keypresses and dispatch to the methods that handle them.

We launch this app shell window like this:

But we need the back-end calculator for it to do anything.

That’s where we’ll pick up next time and finish with a working application.

No ZIP file until next week when we’ve looked at the rest of the code.

∅