DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Cover image for The Ultimate Guide to Graphical User Interfaces with Python using Guizero Library
Blackie
Blackie

Posted on • Updated on

The Ultimate Guide to Graphical User Interfaces with Python using Guizero Library

Contents

Introduction

Install and Setup Guizero

Create Your First GUI

Create a birthday Card

Create an interactive GUI App

Create a meme generator

Create a bad UI

Summary

References

Introduction

By using a graphical user interface (GUI), or "gooey"), Python programs can be made more user-friendly and fascinating. With the help of the Guizero library, beginners can add several "widgets" to their user interfaces, giving the program a wide variety of input and output methods. It allows people to be able to select an item from a menu, press a button, or see some text on a screen.

GUI Image

Install and Setup Guizero

Python’s standard GUI package is called tkinter, and is already installed with Python on most platforms. As a wrapper for tkinter, the guizero package provides a considerably more user-friendly interface for using the default GUI library for Python.

You need to install Guizero to get it up and running. To install it, open your command line / terminal and input the command provided below.

pip3 install guizero
Enter fullscreen mode Exit fullscreen mode

You can visit the Github Page for detailed installation instructions.

Hello GUI

Heelo GUI
To create your first GUI app, open your code editor or Python IDE. After that, you'll need to import each widget; hence, you can use it as many times as you wish throughout your program. To import the App widget, select and import the widgets you need from the guizero library at the start of each guizero program using the following command.

from guizero import App
Enter fullscreen mode Exit fullscreen mode

After that, enter the following code to create your first GUI app.

app = App(title="Hello, world!")
app.display()
Enter fullscreen mode Exit fullscreen mode

You can now save and run your code. A GUI window with the title "Hello,Β world!" should appear.

Congrats!! You createdΒ your first GUI application.

Birthday Card

Card
Now that you understand how to create a simple GUI, let's advance and create a more fascinating app. You can changeΒ the background color, add images, and add text in differentΒ fonts, sizes, and colors. Let's make a birthday cardΒ to put this all into practice. Add 'Text' and 'Picture' to the list of widgets to import at the start of the program.

Note: You need to add a picture in png or jpg format to the folder of the project. My picture is cake.png

# import the widget, 
from guizero import App, Text, Picture
app = App("Card")

# change the background color to pink, #FFC0CB as hexadecimal or as RGB (159, 43, 104)
app.bg = "pink" 

# add some text
message = Text(app, "Hurray!!")
message.font = "verdana"     #change the font to verdana
message.text_size = 54
message.text_color = "#000000"

# now create a Picture widget with two parameters: the app and the file name of the picture.
cake_pic = Picture(app, image="cake.png") 

app.display()
Enter fullscreen mode Exit fullscreen mode

Create an Interactive App

It's time to get into the really interactive part and make a GUI application that generate a password from 3 random words.

# Imports....
from guizero import App, Text, PushButton
from random import choice

# function......
def gen_passkeys():
    first_word = ["brain", "nose", "mouth", "hand", "palm", "forehead"]
    second_word = ["highway", "junction", "river", "rails", "express",  "sky"]
    third_word = ["rain", "storm", "sun", "wind", "hurricane", "dry"]
    print(choice(first_word)+choice(second_word)+choice(third_word))  

# the app.....
app = App("Password_Gen")

# Widgets.....
title = Text(app, "Click the button below")
gen_button = PushButton(app, gen_passkeys, text="gen")
gen_button.bg = "#000000"
gen_button.text_color = "#ffffff"

# display.......
app.display()
Enter fullscreen mode Exit fullscreen mode

App

Create a meme Generator

It's time to get into the really interactive part and Start by creating a simple GUI with two text boxes for the top and bottom text. This is where you will enter the text which will be inserted over your picture to create your meme. Add this line to import the widgets needed.

from guizero import App, Drawing, Slider, Combo, TextBox

# app
app = App("Hello", bg="Green")

# define draw_meme function
def draw_meme():
    meme.clear()
    meme.image(0,0,"PngItem_769277.png")
    meme.text(
        0,0, top.value,
        color=color.value,
        size=size.value,
        font=font.value,
    )
    meme.text(
        0,200,bottom.value,
        color="red",
        size=24,
        font=font.value
    )

# TextBox
top = TextBox(app, "top_text", command=draw_meme)
bottom = TextBox(app, "bottom_text", command=draw_meme)

# Combo
color = Combo(app, options=["orange", "red", "blue", "green", "grey"], command=draw_meme, selected="blue")
font = Combo(app, options=["monospace", "verdana", "helvetica", "cursive", "sans-serif"], command=draw_meme)

#Slider
size = Slider(app, start=10, end=100, command=draw_meme)

# Drawing
meme = Drawing(app, width="fill", height="fill")

# call function
draw_meme()

# display
app.display()
Enter fullscreen mode Exit fullscreen mode

Create a bad UI

Now after learning how to use different widgets, we are going to practise them by creating the worst possible user interface.


Enter fullscreen mode Exit fullscreen mode

Summary

Guizero aims to make the process of developing quick GUIs simple, approachable, and accessible for new users. There is no need to install additional libraries as it works with the standard Python Tkinter GUI library.

References

Guizero Github Page: https://github.com/lawsie/guizero

Python Official Docs, Tkinter: https://docs.python.org/3/library/tkinter.html

Top comments (0)

All DEV content is created by the community!

Hey, if you're landing here for the first time, you should know that this website is a global community of folks who blog about their experiences to help folks like you out.

Sign up now if you're curious. It's free!