Creating Simple Applications

Simplify Python GUI Development With PySimpleGUI Darren Jones 08:28

Here are resources and additional documentation about PySimpleGUI elements and example programs:

00:00 Creating Simple Applications. You can create a large variety of different cross-platform GUIs using PySimpleGUI. The demos that are included with the package are extensive.

00:13 You can create anything from simple desktop widgets to full-blown user interfaces. In the next few sections, you’ll see a few different ways to use PySimpleGUI, but there’s much more to it than is covered in this course and if you want more detail, be sure to check out the other demos that are included with PySimpleGUI.

00:33 Creating a PySimpleGUI Image Viewer. One of the demos on PySimpleGUI’s GitHub page is an image viewer. Being able to write your own custom image viewer with Python is fun!

00:45 You can use this code to view your own photos or incorporate it to view photos that you download or read from a database. To keep things simple, you’ll use PySimpleGUI’s built-in Image() element for viewing images.

00:59 Unfortunately, in the regular version of PySimpleGUI this can only display PNG and GIF formats. If you’d like to be able to open other image file types, then you can download Pillow, which supports TIFF, JPG, and bitmap formats.

01:14 Check out the PySimpleGUI demo folder on GitHub for an example that shows how to do this. On the other hand, if you install the PySimpleGUIQt port, you’ll find that it supports more image formats out of the box than the regular version.

01:30 Here is a mock-up of what the image viewer should look like at the end. This application will use much more code than the previous example, but don’t be deterred by this.

01:39 You’ll see the creation of each part of the application in turn and also run the app without functionality to better understand how the code works. Create a file named img_viewer.py and then add the following code as seen onscreen.

01:57 Here on lines 3 and 4, you import PySimpleGUI and Python’s os module. Then, on lines 8 through 20, you create a nested list of elements that represent a vertical column of the user interface.

02:40 An important parameter of PySimpleGUI elements is key. This allows identification of specific elements of the interface, allowing code to reference these elements, query their state, and change their contents. For the In() input text control, you give it an identity of "-FOLDER-".

02:58 You’ll use this later to access the contents of the element. You can turn events on or off for each element via the enable_events parameter.

03:07 The FolderBrowse() element opens the OS file selector and while you can set a target to refer to another element’s key, by default it will target the element that is before it in the list.

03:18 This is how the folder location is sent to the Image Folder input text control, as you will see when the program runs. The Listbox() element will display a list of paths to the images that you can then choose from to display. You can prefill the Listbox() with values by passing in a list of strings.

03:38 When you first load up your user interface, you want the Listbox() to be empty, so it’s passed an empty list. Events are turned on for this element, its size is set, and it’s given a unique identifier.

03:55 The list of lists on lines 22 through 27 creates three elements. The first element tells the user that they should choose an image to display, the second element displays the name of the selected file,

04:12 and the third displays the image. Note that the Image() element has a key set so it can be referred to and altered later on. For more information on the Image() element, check out the documentation.

04:29 The last list on lines 29 to 36 contains the code that controls how the elements are laid out on the screen. This code contains two Column() elements with a VSeperator() between them, and note the spelling of VSeperator().

04:43 This is an alias for vertical separator. You can learn more how Column() and VSeperator() work by reading their respective documentation pages.

04:53 The window is created with a title, and the layout using a line you’ve already seen before. While the final program will have more complexity in the event loop, let’s just create the basics and run the program to see if the interface looks as we planned.

05:09 This will also let you test out the folder selection as this is part of PySimpleGUI.

05:27 Let’s now run the program and check firstly, that it works, secondly, that it looks the way that it should, and thirdly, that we can select a folder and have the path appear in the Image Folder text input control.

05:57 With that working, now let’s add more code to the loop to start making the program functional.

06:11 This time, you check the event against the "-FOLDER-" key, which refers to the In() element you created earlier. If the event exists, then you know that the user has chosen a folder and you can use os.listdir() to get a file listing.

06:35 Then you filter that list down to only the files with the extension ".png" or ".gif". As mentioned earlier, you can avoid having to narrow down your image types by using Pillow or PySimpleGUIQt instead.

06:54 Finally, the file list is updated in the window.

07:03 Let’s see that part of the code in action.

07:13 You can see the file names now appear in the file list. Now you can take a look at the next part of the conditional statement. If the event equals "-FILE LIST-", then you know that the user has chosen a file in the Listbox(), and you want to update the Image() element as well as the Text() element that shows the selected filename on the right.

07:57 Now we’ll run the code and take the program through its paces.

08:05 You can use the Browse button to find a folder on your computer with images in it, so you can try this code out, or you can copy and paste a path to a file in the Text() element.

08:18 Once you’re done viewing your images, you’re ready to learn how to use Matplotlib with PySimpleGUI, and that’s what’s covered in the next section.

Orbital Mechanic on Sept. 21, 2022

I’m new to PySimpleGUI and I want to write a PySimpleGUI that returns the absolute path of a file. I know how to do this in Tkinter using tkFileDialog as follows:

import tkinter
from tkinter import filedialog

def TkGetFileName():

     root = tkinter.Tk()
     root.withdraw()
     ftypes = [ ("All files", "*.*"),
                ("Text Files", "*.txt"),
                ("Ephemeris", "*.e") ]

     # Create open file dialog
     # FYI: the title option is ignored on Mac OS X
     root.update()
     root.filename = filedialog.askopenfilename(
                    initialdir="/",
                    title ="Select STK Ephemeris File to be converted", 
                    filetypes = ftypes )
     root.withdraw()
     root.update()
     root.destroy()

     return root.filename

The problem I’m having is finding an equivalent example in PySimpleGUI.

Any suggestions?

Become a Member to join the conversation.