Graphical User Interface (GUI)

00:00 Next, let’s take a look at the application program for a desktop GUI. In this section, the same application is going to be programmed for a GUI. In this case, I’m going to use the PySimpleGUI library.

00:13 This has been chosen as it provides the simplest access possible to a native GUI. There are more complicated ways to access it, but generally, these will involve more code to get your project up and running.

00:25 But as you can see, even when using a simplified library, the overhead of the amount of code you have to write is significantly more than when just using the command-line interface. Let’s get started. First up, importing the PySimpleGUI library.

00:41 Next, you’ll see the layout being created. This is a list of lists where each list item is part of the GUI layout.

01:01 So there, you can see that all the needed elements have been created in the list of lists. There’s this Text element, which will be the label for this first input, and then largely the same with different text for the second line, and on the third line, there are two buttons—one of them called 'Add' and the other one called 'Quit'. Next, a window is created, and this is using a PySimpleGUI.Window object. Here, it’s passed the title of the Window and the layout we created previously. Next, the structure of the program will be a while loop, where events and values are read from the window.read() method.

01:42 So, here’s an if statement with comparisons to either None or 'Quit', so if the Quit button is pressed or the window is closed, then the loop will be broken. And here, if the Add button has been pressed, the values will be taken and these are passed as the dictionary values, so the first one has a key of 0. And as you can see, the second one has a key of 1. A simple addition is performed.

02:12 In this case, a PySimpleGUI.Popup is going to be used to provide the user with the result. As you can see, that part of the code looks similar to the print statement from the previous version. Finally, if the loop has been exited, we’ll close the Window. So, let’s save that code and then see it in action.

02:35 The widgets are a little small so we’re going to zoom in. As you can see onscreen, the GUI has appeared with Enter the First Number and Enter the Second.

02:45 I can put in some numbers—a 4 and a 5—and pressing Add creates the popup with our sum. We’ve successfully achieved some simple maths and if we want to quit, pressing the Quit button does this.