GTK Button & Signal - GUI Programming in C

In the previous blog, we looked at the Introduction to GUI programming in C Using GTK Library. This time we are going to take look at the GTK Button Widget and learn how to create buttons and provide the functionality to the GTK Buttons in C programming language.

A Button is a standard GTK Widget and supports many features like:

• You can change the label of the Button
• Change the appearance of the Button
• Provide a keyboard shortcut for the Button
• Also, Disable the Button and Activate when a condition is fulfilled

Creating GTK Button

In the previous blog about GTK, we just created a new window. Now we will create a labeled button and display it in the same window.

#include <gtk/gtk.h>

int main(int argc,char *argv[])
{
    gtk_init(&argc,&argv);
    GtkWidget *win = gtk_window_new(GTK_WINDOW_TOPLEVEL);
    GtkWidget *btn = gtk_button_new_with_label("Click Here");
    gtk_container_add(GTK_CONTAINER(win),btn);
    gtk_widget_show_all(win);
    gtk_main();
    return 0;
}

GtkWidget *btn = gtk_button_new_with_label("Click Here"); – In the GTK library, there is a standard function to create buttons i.e gtk_button_new function, but the newer version of GTK provides us with gtk_button_new_with_label allows us to add a text label to the button at the same time we create the button.

gtk_container_add(GTK_CONTAINER(win),btn); – The gtk_container_add function places the button inside the window, that we have created.

gtk_widget_show_all(win); – Previous blog, we used gtk_widget_show and this time it is replaced by gtk_widget_show_all. This function tells GTK to show all the named widgets and also the widget that the named widget contains.

Signal to GTK Button

In the previous section, we just created the button and were not able to click the button and perform some function. Now we will connect signals to the GTK Button that will perform some function when clicked.

Signals are used a lot in GTK. Signals can be emitted by all the widgets, but mostly used when we want to make users interact with the widget.

The g_signal_connect the function is used to ‘connect’ a c handler function to the widget.

#include <gtk/gtk.h>

void button_clicked(GtkWidget *widget,gpointer data)
{
    g_print("Button Clicked\n");
}

int main(int argc,char *argv[])
{
    gtk_init(&argc,&argv);
    GtkWidget *win = gtk_window_new(GTK_WINDOW_TOPLEVEL);
    GtkWidget *btn = gtk_button_new_with_label("Click Here");
    g_signal_connect(btn,"clicked",G_CALLBACK(button_clicked),NULL);
    gtk_container_add(GTK_CONTAINER(win),btn);
    gtk_widget_show_all(win);
    gtk_main();
    return 0;
}

g_signal_connect(btn,"clicked",G_CALLBACK(button_clicked),NULL); – The g_signal_connect function takes Instance, Detailed Signal, C_handler, and Data to be passed. This code connects the handler (button_clicked) to the signal called click. This signal is emitted by the button whenever the mouse is clicked on it.

The G_CALLBACK function is used to make sure that the compiler knows about the callback function created for the button.

Exit GTK Main Loop

We have created a window that is displayed at the topmost level and the button widget is displayed inside it. The gtk_main(); the main window is an infinite loop that runs in the background to display the window and it is necessary to exit that loop.

This can be done using the g_signal_connect function as the window also emits some of the signals and we can connect the signals to handlers to provide some kind of functionality.

g_signal_connect(win,"delete_event",gtk_main_quit,NULL);

One thing to notice in the above code is that this time we are connecting the “delete_event” signal to the main window and the handler is the gtk_main_quit with NULL data passed.

#include <gtk/gtk.h>

void button_clicked(GtkWidget *widget,gpointer data)
{
    g_print("\tButton Clicked - %d was passed.\n",data);
}

int main(int argc,char *argv[])
{
    gtk_init(&argc,&argv);
    GtkWidget *win = gtk_window_new(GTK_WINDOW_TOPLEVEL);
    g_signal_connect(win,"delete_event",gtk_main_quit,NULL);
    GtkWidget *btn = gtk_button_new_with_label("Click Here");
    g_signal_connect(btn,"clicked",G_CALLBACK(button_clicked),10);
    gtk_container_add(GTK_CONTAINER(win),btn);
    gtk_widget_show_all(win);
    gtk_main();
    return 0;
}

Now when the main window is closed, the delete_event signal will trigger the gtk_main_quit handler and the main loop will exit and our GTK Application will be closed cleanly.

Hope you like it!

Learn more about GTK Buttons from the official documentation.