Glade3 e Gtk… un primo programmino in C++

Questa vuole essere una piccola introduzione allo sviluppo in C++ utilizzando Glade3, per la creazione dell’interfaccia utente, e le librerie Gtk

Per questo programmino, ci faremo aiutare dagli autotools, quindi creiamo una directory, ad esempio “ex1″:
mkdir ex1
ed al suo interno creiamo un file configure.ac come il seguente:
AC_INIT(src/main.cc)
AM_INIT_AUTOMAKE(ex1,0.1)
AC_CONFIG_HEADER(config.h)
AC_PROG_CC
AC_PROG_CXX
AC_PROG_INSTALL
AC_PROG_LIBTOOL
PKG_CHECK_MODULES([GTKMM], [gtkmm-2.4 >= 2.8.0])
PKG_CHECK_MODULES([GLADEMM], [libglademm-2.4])
AC_SUBST(GTKMM_CFLAGS)
AC_SUBST(GTKMM_LIBS)
AC_SUBST(GLADEMM_CFLAGS)
AC_SUBST(GLADEMM_LIBS)
AC_OUTPUT(Makefile src/Makefile)

sempre in questa cartella, creiamo il file Makefile.am, al cui interno mettiamo:
SUBDIRS = src
così da avere il codice separato dagli altri files e quindi creiamola:
mkdir src
cd src
e dentro inseriamo il file Makefile.am
bin_PROGRAMS=ex1
ex1_SOURCES=main.cc wmain.h wmain.cc
EXTRA_DIST = wmain.glade
INCLUDES = $(GTKMM_CFLAGS) $(GLADEMM_CFLAGS)
LIBS = $(GTKMM_LIBS) $(GLADEMM_LIBS)

Siamo quindi pronti a scrivere il codice, iniziamo dal main.cc:

#include <iostream>
#include "wmain.h"

int main(int argc, char *argv[])
{
    Gtk::Main kit(argc, argv);

        Glib::RefPtr<Gnome::Glade::Xml> refXml;
        try    {
                refXml = Gnome::Glade::Xml::create("wmain.glade");
        }
        catch(const Gnome::Glade::XmlError& ex)        {
                std::cerr << ex.what() << std::endl;
                return 1;
        }

        wMain* W = 0;
        refXml->get_widget_derived("wMain", W);
        if(W)  {
                kit.run(*W);
        }

        delete W;

    return 0;
}

questo provvederà a caricare il file .glade (vediamo dopo come crearlo), estrarre il widget wMain, “associarlo” ad una nostra classe ed a lanciare l’applicazione
Vediamo come creare la nostra classe, iniziamo dall’header wmain.h:

#ifndef WMAIN_H
#define WMAIN_H

#include <gtkmm.h>
#include <gtkmm/button.h>
#include <libglademm.h>
#include <iostream>

using namespace std;

class wMain : public Gtk::Window {
public:
        wMain(BaseObjectType* cobject, const Glib::RefPtr<Gnome::Glade::Xml>& refGlade);
        virtual ~wMain();
        virtual void btnEsci();
        virtual void btnOk();
private:
        Gtk::Entry *txtNome;
};

#endif

Quindi passiamo al wmain.cc:

#include "wmain.h"

wMain::wMain(BaseObjectType* cobject, const Glib::RefPtr<Gnome::Glade::Xml>& refGlade) : Gtk::Window(cobject) {
        Gtk::Button *btn;

        /** btnEsci */
        refGlade->get_widget("btnEsci", btn);
        if (btn) {
                btn->signal_clicked().connect( sigc::mem_fun(*this, &wMain::btnEsci) );
        } else {
                cerr << "btnEsci non trovato!" << endl;
        }

        /** btnOk */
        refGlade->get_widget("btnOk", btn);
        if (btn) {
                btn->signal_clicked().connect( sigc::mem_fun(*this, &wMain::btnOk) );
        } else {
                cerr << "btnOk non trovato!" << endl;
        }

        refGlade->get_widget("txtNome", txtNome);

}

wMain::~wMain() {
}

void wMain::btnEsci() {
        cout << "Esci" << endl;
        Gtk::Main::instance()->quit();
}

void wMain::btnOk() {
        Glib::ustring txt;
        txt="Testo ["+txtNome->get_text()+"]";
        Gtk::MessageDialog dlg(*this, txt, false, Gtk::MESSAGE_INFO,
                               Gtk::BUTTONS_OK, true);
        dlg.run();
}

praticamente abbiamo definito la classe wMain derivata dalla Gtk::Window, nel costruttore abbiamo quindi “cercato” i due tasti “btnEsci” e “btnOk”, collegando l’evento “clicked” ai nostri metodi wMain::btnEsci e wMain::btnOk, e abbiamo memorizzato il puntatore alla GtkEntry txtNome.
Nel metodo wMain::btnOk, andiamo ad estrarre il valore inserito nella entry e visualizzarlo tramite un message box, mentre in wMain::btnEsci lanciamo il Gtk::Main::instance()->quit() che termina l’applicazione.
Ora possiamo creare l’interfaccia grafica usando Glade3, quindi da terminale e dentro la cartella src lanciamo:
glade-3
Quello che ci comparirà sarà:

dalla tavolozza (dock a sinistra), premiamo il tastino “Finestra”

sempre dalla tavolozza, selezioniamo il contenitore “Casella verticale” ed impostamo il numero di elementi a 2

per ogni elemento (il box creato) inseriamo una “Casella orizzontale” di 2 elementi

Nel box in alto a sinistra inseriamo una GtkLabel selezionando dalla tavolozza, nel riquadro “Controlli e visualizzazione” il tastino “Etichetta”
Nel box in alto a destra invece inseriamo una GtkEntry (tastino “Entrata testo” sempre in “Controlli e visualizzazione”)
Nei box sotto inseriamo due GtkButton (tastino “Pulsante”)

impostando nelle proprietà la tipologia come “Stock” (vedi barra evidenziata)

la prima con “Pulsante stock” in “Applica”, l’altra con “Chiudi”

Ora non resta che assegnare i nomi come nella seguente figura

Salviamo quindi il file nella cartella “src” col nome “wmain.glade” e, tornando nella cartella principale del progetto diamo i comandi:
touch NEWS README AUTHORS ChangeLog
touch stamp-h
aclocal
autoheader
libtoolize -f
automake -ac --foreign
autoconf

Se tutto è andato bene, diamo un
./configure
make
e per lanciare il nostro programmino
cd src
./ex1
Buon divertimento!

Pacchetti da installare
Ci sono una serie di pacchetti che occorre avere prima di procedere con lo sviluppo:
sudo apt-get install build-essential automake1.9 pkg-config libglademm-2.4-dev libgtkmm-2.4-dev
potrebbero mancarne alcuni, in quel caso fatemi sapere cosa mi sono dimenticato

Link utili
Sicuramente vi saranno di aiuto
http://www.gtkmm.org/docs/gtkmm-2.4/docs/tutorial/html/index.html
http://sourceware.org/autobook/autobook/autobook_toc.html