Window of Opportunity

Add graphics that automatically update. We show you how to build an analog clock widget with the Cairo and GTK libraries.

- By Michael Williams

Last month, I covered drawing an analog clock face using the Cairo graphics library [1], [2]. While the programs in that article drew to image files, this article demonstrates how to program an analog clock drawn in a graphical user interface (GUI) window. I will also show how to make the clock automatically update, redrawing every second to simulate a ticking clock.

Because I have already covered the process of drawing a clock, this article focuses on the GUI aspect of the program. For this project, I will use the GTK [3] GUI library, because it interfaces well with Cairo and the Python language, both of which I used in the previous clock program. GTK is used from a Python program via the GObjectIntrospection [4] library; you need to ensure that you have Cairo, GTK, and GObjectintrospection installed before you start programming this project. You will also need the interface between Cairo and GObjectIntrospection in order to use Cairo with GTK. On Debian, Ubuntu, and their derivative Linux distributions, the following command will ensure everything you need is installed:

sudo apt install python3-cairo python3-gi python3-gi-cairo girl.2-gtk-3.0

This article uses GTK3, which is in long-term maintenance status, instead of the current version GTK4. Despite its age, GTK3 is still prevalent as of this writing and has had more time to mature than GTK4. Nevertheless, if you want to experiment with GTK4 and Python, install the additional GObjectIntrospection data for GTK4:

sudo apt install girl.2-gtk-4.0

A Simple GUI Window

To introduce programming with GTK, I will write a very simple program to open a window and exit the program when the user closes the window. I begin by loading GTK using GObjectIntrospection:

import gi gi.require_version ('Gtk', '3.0') from gi.repository import Gtk