A set of template files for starting new GTK+ 3 C programming language projects using Glade for the GUI. The structure of the template directory separates the C source code and Glade files into their own sub-directories with a makefile in the main directory.
These template files make it easier to manage a project by separating the C source code and the Glade files. The makefile allows source code files to be added to the project easily as the project grows.
This article extends simple GTK+ 3 C programming using Glade and compiling by entering compile commands manually, to a better structured project and using a makefile.
Part 4 of GTK 3 Programming with C and Glade Tutorial
See the full GTK3 tutorial index
Structure of the GTK+ 3 Glade Template Directory
The template has a src directory that contains the C source files for the project, and a glade directory that contains the Glade files. The makefile is found in the root directory of the template as shown in the image below.
GTK+ 3 and Glade Template Source Code
The template directory contains the following source code that can be copied to create a set of template files for your own projects.
The Makefile
Below is the contents of the file called makefile which must be placed in the root directory of the project.
# change application name here (executable output name) TARGET=template_app # compiler CC=gcc # debug DEBUG=-g # optimisation OPT=-O0 # warnings WARN=-Wall PTHREAD=-pthread CCFLAGS=$(DEBUG) $(OPT) $(WARN) $(PTHREAD) -pipe GTKLIB=`pkg-config --cflags --libs gtk+-3.0` # linker LD=gcc LDFLAGS=$(PTHREAD) $(GTKLIB) -export-dynamic OBJS= main.o all: $(OBJS) $(LD) -o $(TARGET) $(OBJS) $(LDFLAGS) main.o: src/main.c $(CC) -c $(CCFLAGS) src/main.c $(GTKLIB) -o main.o clean: rm -f *.o $(TARGET)
Change the name template_app at the top of the file to the name of your project. This will be the name of the executable file that is generated after compiling.
Modify the makefile when new C source code files are added to the project so that the new files are compiled and linked.
Main C Source Code File
In the src directory, create a file called main.c and copy the following code to it.
#include <gtk/gtk.h>
int main(int argc, char *argv[])
{
GtkBuilder *builder;
GtkWidget *window;
gtk_init(&argc, &argv);
// builder = gtk_builder_new();
// gtk_builder_add_from_file (builder, "glade/window_main.glade", NULL);
// Update October 2019: The line below replaces the 2 lines above
builder = gtk_builder_new_from_file("glade/window_main.glade");
window = GTK_WIDGET(gtk_builder_get_object(builder, "window_main"));
gtk_builder_connect_signals(builder, NULL);
g_object_unref(builder);
gtk_widget_show(window);
gtk_main();
return 0;
}
// called when window is closed
void on_window_main_destroy()
{
gtk_main_quit();
}
All C source code files that are added to the project can be placed in the src directory. Glade files that are used in the project are placed in the glade directory and accessed as such in the C source code as the following line of code from above shows.
gtk_builder_add_from_file (builder, "glade/window_main.glade", NULL);
Update October 2019: the code has been simplified by replacing these two lines of code:
builder = gtk_builder_new(); gtk_builder_add_from_file (builder, "glade/window_main.glade", NULL);
With this single line of code:
builder = gtk_builder_new_from_file("glade/window_main.glade");
Glade File
A new glade file can be created in the Glade editor or the code below can be copied to a file called window_main.glade in the glade directory.
<?xml version="1.0" encoding="UTF-8"?> <!-- Generated with glade 3.16.1 --> <interface> <requires lib="gtk+" version="3.10"/> <object class="GtkWindow" id="window_main"> <property name="can_focus">False</property> <property name="title" translatable="yes">Template Window</property> <property name="default_width">640</property> <property name="default_height">480</property> <signal name="destroy" handler="on_window_main_destroy" swapped="no"/> <child> <placeholder/> </child> </object> </interface>
All new Glade files added to the project are to be put into the glade directory.
Building the GTK+ 3 Glade C Programming Template Project
Open a terminal window and change to the project directory. To build the project, enter make in the terminal window. This assumes that the correct software and libraries have been installed.
Build the project:
make
Clean the project — delete object and executable files:
make clean
If an error message appears when you try to build the project using make, open the make file in a text editor and be sure to replace the spaces that are used to indent text in the file with tab characters by using the Tab key. A typical error message is:
makefile:26: *** missing separator. Stop.
This indicates that the following indented line in the make file listing is indented with spaces instead of a tab character:
all: $(OBJS) $(LD) -o $(TARGET) $(OBJS) $(LDFLAGS)
These notes have been very helpful. I did a lot of searching and only found older tutorials that did not apply anymore. “… deprecated” was the most familiar word I would see. Thank you for reconnecting me to Linux development.
Glad to hear that it helped 🙂
Excellent tutorial, I’m just getting started with GTK after years of Visual Studio and the transition is not easy, this just gave me a real jump start, thanks for your help.
Thanks BillH. Good to hear that you found the tutorial useful.
Thanks a lot!
Bro you have explained it very beautifully.
it was like a piece of cake.
Well done, good job.
Please continue to do in future.
Please can you make tutorial on simple app which use some input and output for ex. add two numbers and display result tnx
Thanks to this tutorial, I was finally able to use Glade with GTK+ 3 and not just with GTK+ 2. Thank you very much. I am very grateful for the help.
Awesome! Thanks for your comment.
I still get a Gtk-CRITICAL **: IA__gtk_widget_show: assertion ‘GTK_IS_WIDGET (widget)’ failed
error with an exact copy, paste of the code.
Putting some error checking into it spits out a warning
“required gtk+ version 3.10, current version is 3.4”
Normally you assume the requirement is 3.1 OR HIGHER but in this case if I simply remove
from the .glade file the window pops up and everything works
I had the same issue and mine was the versioning. The file, as direct copy and paste, wants to use 3.10. When you open it up in glade edit the properties and change the version.
THIS WAS THE KICKER FOR ME…fml…
Save. Close Glade. Reopen Glade.
im getting missing separator error, any sugestion?
I got the same error on line 26 and 29. Remove the leading spaces and replace them with a tab.
I got this error:
make: *** No rule to make target ‘Â Â ‘, needed by ‘all’. Stop.
How should I do now ?
“error:XDG_RUNTIME_DIR not set in the environment
(template_app:19644): Gtk-WARNING **:cannot open display:”
Do you know a way to fix it ?
I have created a template with multiple directories followed off your model and have posted it to stackoverflow. Thank you for the great tutorial!
https://stackoverflow.com/questions/52188654/gtk3-and-glade-makefile-for-a-c-application-on-linux-with-multiple-directories
Something seems to be wrong with you link. I’m getting “Page Not Found”.
when I run the make file I get the error:
makefile:26: *** missing separator. Stop.
Do you know how to fix this?
Never mind, I found it.
“This mostly happens if you copy paste the code from Internet. Remove all the spaces from the indented lines by using the delete key. And then press the tab key, only once per line.
Save it and try running the file again. It should work now. This worked for me.”
Thanks
had a lot of fun learning a little gtk
and more thanks
Thank you very much!!
Was struggling to get my first GTK+ hello world compiled with no success for weeks now!!
I came across this while searching on google and gave it a try.
I ran ‘make’ then
makefile:26: *** missing separator. Stop.
error was shown.
and I was like , here I go again!!
I read further and you already had it solved in this article!!
I was able to do it within minutes!!
You are my superhero!!
First: Thanks!
I tried the solution for “missing seperator”-error but it did not work until I find out that using the Tab-key may not always produce a tab…!
In the TextEditor “Pluma” i had to set the Preferences to “DONT Insert spaces instead of tabs” first.
Different editors (like the simple text editor in Linux Mint) treat the tab key differently. In CodeBlocks, a tab is actually a tab.
By the way, this is a simple yet clear and functioning tutorial. Great work!
This helped a lot for me.
For those of you coming behind me, here’s a list of the DLLs you need to run a GTK app (in my experience):
– libatk-1.0-0.dll
– libbz2-1.dll
– libcairo-2.dll
– libcairo-gobject-2.dll
– libdatrie-1.dll
– libepoxy-0.dll
– libexpat-1.dll
– libffi-6.dll
– libfontconfig-1.dll
– libfreetype-6.dll
– libfribidi-0.dll
– libgcc_s_seh-1.dll
– libgdk-3-0.dll
– libgdk_pixbuf-2.0-0.dll
– libgio-2.0-0.dll
– libglib-2.0-0.dll
– libgmodule-2.0-0.dll
– libgobject-2.0-0.dll
– libgraphite2.dll
– libgtk-3-0.dll
– libharfbuzz-0.dll
– libiconv-2.dll
– libintl-8.dll
– libpango-1.0-0.dll
– libpangocairo-1.0-0.dll
– libpangoft2-1.0-0.dll
– libpangowin32-1.0-0.dll
– libpcre-1.dll
– libpixman-1-0.dll
– libpng16-16.dll
– libstdc++-6.dll
– libthai-0.dll
– libwinpthread-1.dll
– zlib1.dll
Thanks a lot.
I was linux programmer many years ago. But, because of job I have been programming in W for many years and missing this environment.
I have been trying eclipse and netbeans but couldnt work.
Now I can start again to do something thanks to your explanations.
Thanks thanks thanks
First Thanks for great GTK3 Linux tutorial. I was finally able to use Glade with GTK+ 3 im my test projects. There have been no updated tutorials for a long time.