GTK Display Time in Glade Application

GTK display time in window using GTK+3, Glade and GLib functions. This tutorial shows how to write a GTK+ 3 application that displays the current time in a window. The application code is written in the C programming language. Glade is used to lay out the window and widgets. Below is an image that shows the finished application.

GTK Display Time Application
GTK Display Time Application

Displayed time is updated every second. A timer is used to generate a timer tick that updates the time label in the window.

GTK Display Time Files

Use the GTK+ 3 Glade C programming template files to start the application. Modify the makefile to change the name of the output executable file. As shown in the makefile below, the TARGET executable name is changed to display_time.

makefile from the root directory of the project:

If copying this makefile, remember to replace all of the indenting with tab characters for it to work without errors.

Creating the Glade File

The Glade file for the project found in the glade directory can be deleted as it contains some formatting that is not needed for this project. Create a new file using the Glade user interface designer program. Place this file in the glade directory of the project.

The following modifications must be made to the glade file. If you have been following the GTK Glade C programming tutorials on this website, you will know how to make all of these modifications.

  1. Place a new top-level window. Change the window ID to window_main. Change the window title to Time.
  2. Place a Box container in the main window with 2 items or sections.
  3. Change the box orientation to Horizontal.
  4. Place a label in the left section of the box container, and change its text to Current Time:
  5. Place a label in the right section of the box container, change its ID to lbl_time and its text to Time.
  6. Select the main window at the top right of Glade. Under the Signals tab at the bottom right of Glade, find the destroy signal. Use on_window_main_destroy as the handler for the destroy signal.
  7. Add padding and spacing as necessary to improve the layout of the widgets.

An image of the completed application window in Glade is shown below, followed by the Glade file itself.

The Display Time Application Window in Glade
The Display Time Application Window in Glade file from the project’s glade directory:

To follow this tutorial, either make your own Glade file as already described, or copy the above code to a file called and save it to the project’s glade directory.

GTK Display Time Application Code

Below is a listing of the C code for this application. An explanation of the code follows.

main.c from the project’s src directory:

Using a structure to pass widget pointers to functions is explained in the tutorial GTK Glade Get Pointers to Widgets. Although only a pointer to the time label widget is needed, a structure is still used in this application.

The main functionality of the application comes from starting a timer that ticks every second. GLib functions are used to start a timer, get the current time and format the time to the desired format. GLib function names start with g_ (g underscore).

On every 1 second timer tick, a handler function is called that updates the time in the window. g_timeout_add_seconds() is used in main() to start a timer. A handler function is passed to this function, as well as a pointer to the widget structure allowing it to access the time label for displaying the time.

The user defined handler function timer_handler() uses g_date_time_new_now_local() to get the current time from the computer that it is running on. g_date_time_format() is used to format the the time string to 24 hour format displaying hours minutes and seconds.

After reading and formatting the time, the pointer dt_format points to a string in dynamically allocated memory in the desired format. This string is used to update the label in the main window. The dynamically assigned memory is recovered using g_free() before timer_handler() returns.

In order for the timer handler function timer_handler() to be called every second continually it must return TRUE. Returning FALSE from this function will destroy the timer.

Leave a Reply

Your email address will not be published. Required fields are marked *