Wikijunior:Raspberry Pi/Raspberry Pi Make a Graphical User Interface (GUI)

Laura Sach @codeboom – CC-BY-SA 4.0

This workshop explores creating easy Python graphical interfaces with the  library.

itself is an alternative to the Tkinter graphical interface library which is included with Python.

Setup and installation
You can install the  library by running the   command from the Terminal which is the recommended way:

Alternatively, there is a Microsoft Windows installer from the website: https://lawsie.github.io/guizero/

Your first GUI



 * 1) From the Programming menu, open up Python 3
 * 2) Click on File > New File to create a blank window where you will write your code
 * 3) Add the following source code below to your file.
 * 4) Save the file, then press F5 to run the code. You should see a basic GUI!



Let's look at what the lines of code do:

Tells Python we want to use App and Text from

Creates the app (the box bit) and puts the words "My first GUI" in the title.

Creates the  (the word "Hello!" in the grey part) and adds it to the app. Whenever we create something new in  we always add it to the app so that it appears on the screen.

Display the app, and run a loop to update it in case anything changes. This line is always last.

Jazzing up the text
This text is a bit boring! You can change the size, colour and font of the text by adding some additional parameters.

Find this line of code.

Add another parameter to change the colour to red (note the American spellling).

You can add more parameters by putting commas between them, like this:



Pictures
Pictures must be in GIF format to be displayed on the GUI. All code for items to display on the GUI must go between these two lines of code.


 * Import the class –
 * Make sure you have a GIF picture saved in the same folder as your Python file
 * Add this line of code to your app (replace cat.gif with the filename of your picture)

Sadly,  can't display animated GIFs. 😟

Buttons
You can add a button like this:

Import the class by adding to the top line.

At the top of your program, just after the  statement, write a function which will be called when the button is pressed. Our example function is called  but you can call it whatever you like (don't put spaces or punctuation in the name though).

Make sure that the print line is indented by pressing the tab key – this is important!

Add the button code between the two lines of app code as for the picture.

Run your program by pressing F5. Click the button and look in the Python shell – you should see a message saying.



Challenge – Cat name generator


When you press the button, your randomly generated "cat name" will appear below.


 * 1) Change your GUI so that it looks like this. You should be able to work out how to do this by changing the code you already have. You can use your own picture!
 * 2) Add the line   at the top of your program so that we can randomly choose a cat name.
 * 3) Add this code below your button to create some text. This is where the cat name will be displayed, but we don’t know what it is yet so we will just put   for now.

Find the line of code  in your existing program. Replace the line of code  with this code to randomly choose your cat's first name from the list. Add some more different names if you like! 

Write another line of code underneath this one to randomly pick a last name for your cat. Make sure to start this line with  so we can tell which is which. 

Now add a line of code to join them together and set the result inside the  text you created earlier. 

Save and run your program, then press the button to discover your cat alter ego! 



What's next?
The official website for  has documentation for creating graphical user interface (GUI) apps. The authors have designed it to be used in "advanced projects": https://lawsie.github.io/guizero/

The Raspberry Pi Foundation has published a free PDF book for  called Create Graphical User Interfaces with Python (2020) by Martin O'Hanlon and Laura Sach: https://magpi.raspberrypi.org/books/create-guis