Posts Tagged ‘gtk+’

Giving Glade a fair shake

October 14, 2008 Leave a comment

As soon as I mentioned XAML and XUL, somebody pointed out to me that Gnome on Linux also allows you to define your user interface declaratively using XML with Glade. The v3 release of Glade uses XML to define the properties and layout of GTK widgets in a way very similar to WPF and XAML. Since XAML is only supported on Windows right now and Mono is probably a long way from any WPF support, I thought I’d give Glade a try. If it works well enough, loose XAML pages could be just an XSL transform away from Glade XML for creating GTK apps.

Since Ubuntu is the “Red Hat of the future” for bringing Linux to the mainstream desktop, I decided to do this on Ubuntu and found that getting a usable application together is pretty simple. To avoid trashing an existing PC, I installed Sun’s VirtualBox to create an Ubuntu installation there.

Once Ubuntu is up, go to Applications | Add/Remove Programs, and search for “Glade”. Add “Glade Interface Designer” (if you see more than 1, choose the more popular one just like you’re building the perfect kickball team). At this point, you can go through this tutorial to learn the basics of Glade.

Once you have a basic UI defined in Glade’s XML, this is fairly analogous to your XAML file in WPF, and you’ll need to write some code to load up the application and handle UI events (signals). This is all defined in the tutorial, but what the tutorial doesn’t cover is how to set up your development environment, so I’ll go through that here.

Ubuntu doesn’t come with all the development tools or GTK header files installed, so you need to download those. For C/C++, you need to execute apt-get at a terminal to download and install the development tools you’ll need:

sudo apt-get install build-essential
sudo apt-get install libgtk2.0-dev
sudo apt-get install libgtk2.0-doc
sudo apt-get install libglib2.0-doc

If you go through all the forums, you’ll find that everybody wants you to use GEdit and make for writing your code. I tried that first, and aside from the fact that you have to do command line debugging, it works pretty well. But if you like an IDE with an integrated debugger, Eclipse is the best (and still open source so hopefully I don’t get attacked for recommending it). However, Eclipse will flip out if you don’t configure it correctly, so follow these steps.

You can get Eclipse using the same Add/Remove Programs in Ubuntu, but you need to switch “Show:” to “All Open Source applications” or “All available applications” and search for “eclipse”.

Once Eclipse is installed, you need to get the tools for C/C++ development, run it, and from the Help menu, choose “Software Updates” –> “Find and Install…” Select “Search for new features to install”, click “Next”, check “Callisto Discovery Site”, click “Finish”, choose the nearest mirror site. When you get back the “Search Results” screen, expand “Callisto Discovery Site” and check “C and C++ Development Tools.” Click Next to continue through the installation process. When prompted, go ahead and restart Eclipse.

When Ecplise starts back up, go to the File menu, click New | New Project, and then expand the C or C++ node to get to a Managed Make C or C++ project (whichever you want). Once you get the project up, you can create a “main.c” for creating the code per the Glade and GTK+ tutorial I mentioned above. When it starts complaining about not being able to find gtk.h, whatever you do, don’t start trying to add Includes and Link Libraries . This is not the Linux way. Instead, right click on your new project and go to Properties, then go to the settings for C/C++ Build.

Under the GCC C Compiler (or GCC C++ Compiler if you’re build .cpp files), go to Miscellaneous. At the end of the “Other flags” text box, add the following, which will execute pkg-config to get the correct includes for your system:

`pkg-config --cflags gtk+-2.0`

Also, under the GCC C++ Linker, Miscellaneous, “Other flags”, add the following, which will get the correct libraries and tell the linker to export any signal handlers you add to widgets in Glade:

`pkg-config --libs gtk+-2.0 gmodule-export-2.0`

Now you should be able to build and run your code directly from Eclipse. If you get warnings on the Eclipse console about “Could not find signal handler”, either you are missing the “gmodule-export-2.0” or your method signature for your signal handler doesn’t match what is specified in the XML file created by Glade Interface Designer.

One last thing – in the Glade and GTK+ tutorial, they use gtk-builder-convert to convert the file from libglade format to GtkBuilder format. It makes sense to do this in a pre-build step, which you can also do from the project properties. Under C/C++ Build, click the Build Steps tab, and under the Pre-build step Command, enter something like this:

gtk-builder-convert ~/workspace/MyGladeProject/ ~/workspace/MyGladeProject/GladeUI.xml 

That way any changes you make in Glade Interface Designer will make it over into the file you’re loading in your GtkBuilder calls. It would be nice if there were an Eclipse plugin for Glade Interface Designer that would load the application within Eclipse and provide a fully integrated environment, but until that happens, the Pre-Build step saves a lot of headache.

All this took me about a day to figure out, mostly spent messing with different Ecplise options before I decided to stop trying to configure the Includes and Libraries and just use Miscellaneous to make the call to pkg-config. Hopefully this saves someone else a lot of time.

As far as my XAML to Glade/GTK+ XML comparison, they are actually very comparable for the most part, but the one major thing missing from GTK+ in general is declarative data binding. You still end up writing a lot of code just to get and set data in your UI. This guy seems to agree, and there is a Gtk-Databind project for GTK#, but unfortunately it doesn’t seem to be getting much attention by the core GTK development group.