Gnome Programming: Using LibGlade with Anjuta/Glade
April 22nd, 2005Note: This tutorial is no longer current. A new, more up-to-date and in-depth tutorial has been written: Tutorial: Simple Gnome Application Using libglade and C/GTK+
Introduction
So, after writing Gnome Programming Tutorial 1 - Getting Started with Anjuta/Glade, I recieved a lot of wonderful feedback from the good folks in the gtk-list mailing list. Probably the biggest discussion was on the use of libglade. So, I read into what exactly libglade is and does, and will share what I've found with you.
In the last tutorial, when we clicked 'Save' in Glade while creating our GUI, an XML file was generated for our project (hello.glade). Then, when we clicked 'Build' in Glade, actual C/GTK+ code was generated (and sent back to Anjuta) to build our interface. (remember interface.c, callbacks.c, interface.h, callbacks.h, ... ?) What libglade does, is rather than allowing Glade to generate the C/GTK+ code for us, we're going to utilize the libglade library to build the interface at runtime using the XML file. One particular message in the gtk-list archives from January of 2003 specifically struck my fancy. Some questions regarding Gnome, libglade, and the Anjuta/Glade generated autoconf files are answered by Havoc Pennington. You should check it out. Now, there is nothing wrong with allowing Glade to generate the codefor your GUI, especially for small scale projects (such as ours). However, The reason experienced Gnome and GTK+ developers are advocating the use of libglade is because you do not need to re-create code and recomplie every time you make changes to the interface, thus reducing the possibility of inducing errors into the code for a change in the interface.
So, there are certainly circumstances where you would need to use or maybe even not want to use libglade. However, for basic Gnome desktop application, libglade is ideal. Therefore, in this tutorial we will be starting a new project as a libglade project and not a Gnome project (don't worry, it's still a Gnome application).
Prerequisites
Programming Knowledge:
Before working out any of these tutorials on Gnome programming with Anjuta and Glade, you should be familiar with C programming at LEAST a beginner/intermediate level in addition to being familiar with general programming concepts such as object oriented programming, data structures, variables and scope, functions, pointers, etc. Although I will start analyzing some of the code in this tutorial, I will not be teaching you C programming.
Anjuta/Glade Eperience:
This tutorial makes some assumptions about your previous knowledge, some of which is covered in my first tutorial on the subject: Gnome Programming Tutorial 1 - Getting Started with Anjuta/Glade. That tutorial covers the following prerequisites for this tutorial:
- You should feel comfortable with creating a new project in Anjuta using the New Project Wizard.
- You should feel comfortable editing code in Anjuta and building/executing your program.
- You should know how to start Glade from within Anjuta and be familiar with Glades 'Main', 'Pallette', and 'Properties' window.
- You should know how to delete a widget (such as the default window1 GtkWindow widget) and create a new Gnome Appliction Window in Glade.
LibGlade library:
In addition to Anjuta and Glade (obviously GTK), you will need to have libglade installed. For me, this was as simple as issuing the command:
yum install libglade
However, depending on your distribution and yum configuration (if you use yum), that may not work for you. You can download libglade from the libglade website. Although I have not personally researched it, I would imagine that there are packages for just about all the major distos.
Reference Material:
And finally, we're going to start paying attention to what our code is actually doing. Now, what I've done for myself is downloaded the reference documentation (tarballs) that pertains to the code I'm writing and created bookmarks in FireFox to them (see image below). You may want to do the same, or just bookmark this page as your documentaion reference.
Creating a New libglade Project in Anjuta
Before creating our new project, we're going to change one of Anjuta's settings. Although I am far from knowledgable on the GNU coding standards nor the Gnome coding standards, I have been browsing them. By the time I am an efficient Gnome/GTK+ applications developer, I intend to adhere to the coding standards and practices used by the community. Regardless of the standards, writing clean, readable, "self-documenting" code is a good practice and a marketable skill. So, based on my reading of the Gnome coding standards, we're going to change Anjuta's tab size to the Linux kernel indentation style of 8-space tabs for indentation. So, in Anjuta, choose the menu item Settings -> Preferences and change 'Tab size in spaces' to 8 in the 'Indentation' screen.
To save space on my server, reduce load time on this page, and save myself some precious time, I'm not going to show you each step of Anjuta's New Project Wizard again. You can see those in Gnome Programming Tutorial 1 - Getting Started with Anjuta/Glade. Choose 'New Project' from Anjuta's 'File' menu and create a new project as follows:
| Project Type: | LibGlade 2.0 Project |
| Project Name: | basicgnome |
| Project Version: | 0.1 |
| Project Author: | Micah Carrick |
| Project Target: | basicgnome |
| Programming Language: | C |
| Target Type: | Executable Target |
| Description: | A Basic Gnome Application |
| Include GNU Copyright: | Yes |
| Enable Gettext Support: | Yes |
| Entry Name: | Basic Gnome App |
| Comment: | Basic Gnome App |
| Group: | Applications |
Note: If you get an error about having to manually run autogen.sh, see my explanation of this error in Gnome Programming Tutorial 1 - Getting Started with Anjuta/Glade.
Once that code has been generated and you have the "Auto Generation completed..............successful" message in Anjuta's Build output window at the bottom of the IDE, we're ready to create our interface.
Creating (Not Building) our Interface in Glade
We are going to build our interface much like we did in Gnome Programming Tutorial 1 - Getting Started with Anjuta/Glade with a couple of differences. So, press ALT+G to start the Glade interface designer from Anjuta. Just like before, we're going to delete 'window1', which is a GtkWindow widget and add a GnomeApp widget (which is under the 'Gnome' section in the 'Pallette' window of Glade). This new GnomeApp widget will be called app1 by default. Personally, I hate naming any objects generically: window1, window2, window3 doesn't suit my fancy. I prefer: app_window, options_window, confirmation_dialog, etc. This, I feel, makes the code more readable. Now, I'm not entierly sure what the naming convention is for objects/widgets in Gnome, but I'm going to use the function convention of using lowercase with underscores separating words, as in app_window.
To rename the widget, click to select 'app1' in Glade's main window, and change the 'Name:' property in Glade's 'Properties' window to 'app_window'. Also change the 'Title' property in Glade's 'Properties' window to 'Basic Gnome App'. This should look like the screenshot below:
Now we're ready. Here's the important part. Do not build this glade project. You can, however, the files that are built are not going to be used! All we need to do is click 'Save' to save our XML file; basicgnome.glade. Once you click save, you can exit Glade. That's it. We're done with the interface (not really, but for now at least).
Editing main.c in Anjuta
Before our application will compile and run successfully (semi-successfully), we need to make some modifications to main.c in Anjuta. So open up main.c (in the 'source - scr' folder of the Project Explorer). So, the first thing we need to do is make some changes to the code that was automatically generated. Since the project was generated with a GtkWindow widget named 'window1', that's what is referenced in the main() function. We changed this to a GnomeApp widget named 'app_window', and need to make the appropriate changes.
First, in the function main(), the first line declares a GtkWidget named 'window1'. If you recall, I hate names like this. And since it is going to be referencing the GnomeApp widget named 'app_window', let's rename it to 'app_window':
| original code: |
<span style="color: #990000">GtkWidget</span> *window1; |
| modified code: |
<span style="color: #990000">GtkWidget</span> *app_window; |
Next, down towards the bottom of main(), the libglade code (which we'll go over in the next tutorial) needs to be modified. I'm also adding 2 signal callbacks (again, we'll go over this in the next tutorial):
| original code: |
glade_xml_signal_autoconnect (xml); window1 = glade_xml_get_widget (xml, <span style="color: #666666">"window1"</span>); gtk_widget_show (window1); |
| modified code: |
window1 = glade_xml_get_widget (xml, <span style="color: #666666">"app_window"</span>); <span style="color: #006600">/* Connect signals for termination of application */</span> g_signal_connect(G_OBJECT(app_window), <span style="color: #666666">"delete_event"</span>, G_CALLBACK(delete_event_cb), <span style="color: #000099">NULL</span>); g_signal_connect(G_OBJECT(app_window), <span style="color: #666666">"destroy"</span>, G_CALLBACK(destroy_cb), <span style="color: #000099">NULL</span>); gtk_widget_show (app_window); |
Note that I completely removed the libglade autoconnect function:
glade_xml_signal_autoconnect (xml);
Okay, so that's all well and good, however, we now need to define the callback functions we added in main() and also include those functions. So, first let's define those functions. At the top of the main.c file, right after the #include statements but before the main() function, add the following 3 lines:
<span style="color: #006600">/* Define callback functions */ </span><span style="color: #000099">static</span> <span style="color: #990000">gint</span> delete_event_cb(<span style="color: #990000">GtkWidget</span>* w, GdkEventAny* e, <span style="color: #990000">gpointer</span> data); <span style="color: #000099">static</span> <span style="color: #990000">gint</span> destroy_cb(<span style="color: #990000">GtkWidget</span>* w, GdkEventAny* e, <span style="color: #990000">gpointer</span> data);
At now towards the bottom of main.c, below the main() function, add the following functions:
<span style="color: #000099">static</span> <span style="color: #990000">gint</span> delete_event_cb(<span style="color: #990000">GtkWidget</span>* w, GdkEventAny* e, <span style="color: #990000">gpointer</span> data)
{
<span style="color: #006600">/* Callback for "delete_event" signal */</span>
<span style="color: #006600"> /* TODO: Add code to confim if the user wants to quit */
</span> g_print(<span style="color: #666666">"delete_event_cbn"</span>);
<span style="color: #000099">return</span> <span style="color: #cc6600">0</span>;
}
<span style="color: #000099">static</span> <span style="color: #990000">gint</span> destroy_cb(<span style="color: #990000">GtkWidget</span>* w, GdkEventAny* e, <span style="color: #990000">gpointer</span> data)
{
<span style="color: #006600">/* Callback for "destroy" signal */</span>
g_print(<span style="color: #666666">"destroy_event_cbn"</span>);
gtk_main_quit();
<span style="color: #000099">return</span> <span style="color: #cc6600">0</span>;
}
Your code should now look like this main.c.
Now we can press F11 to build the application (check for errors) and then F3 to execute the application. If you click the 'x' in the title bar of our little application, the program should exit successfully with error code 0. That's the important part right now, which we will be discussing next.

Categories
Popular Posts
RSS Feeds
Archives

