<!DOCTYPE html PUBLIC "-//w3c//dtd html 4.0 transitional//tr">
<html>
<head>
<meta name="generator" content="HTML Tidy, see www.w3.org">
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-9">
<!-- this stylesheet will later on be added by lfparser automatically: -->
<style type="text/css">
<!--
pre { font-family:monospace,Courier }
pre.code { font-family:monospace,Courier;background-color:#aedbe8; }
p.code { width:80%; alignment:center; background-color:#aedbe8; border-style:none; border-width:medium; border-color:#aedbe8; padding:0.1cm ; text-align:left }
-->
</style>
<title></title>
</head>
<body>
<h1>Programmer des interfaces graphiques avec GTK</h1>
<h4>ArticleCategory:</h4>
SoftwareDevelopment
<h4>AuthorImage:</h4>
<img src="../../common/images/OzcanGungor.jpg"
alt="Ozcan Gungor" width="114" height="147">
<h4>TranslationInfo:</h4>
<p>original in tr <a href="mailto:ozcangungor@netscape.net">Özcan Güngör</a>
<p>tr to en <a href="mailto:ozcangungor@netscape.net">Özcan Güngör</a></p>
<p>en to fr <a href="mailto:frederic.nourry@29laposte.net">Frederic Nourry</a></p>
<h4>AboutTheAuthor</h4>
J'utilise Linux depuis 1997. Liberté, flexibilité et opensource.
Ce sont les propriétés que je préfère.
<h4>Abstract</h4>
<p>Dans cette série d'articles, nous allons voir comment écrire des programmes
avec interfaces graphiques utilisateur (GUI) grâce à GTK. Je n'ai aucune
idée du nombre d'articles qu'il faudra. Pour bien comprendre ces articles,
vous devez posséder les notions suivantes de programmation en langage
C:</p>
<ul>
<li>Variables</li>
<li>Fonctions</li>
<li>Pointeurs</li>
</ul>
<br>
<h4>ArticleIllustration:</h4>
<img src="../../common/images/illustration295.jpg" alt="GTK"
width="195" height="172">
<h4>ArticleBody:</h4>
<h2>Qu'est-ce que GTK?</h2>
<p>GTK (GIMP Toolkit) est une bibliothèque pour créer des interfaces graphique
utilisateur (Graphical User Interfaces ou GUI). Elle est disponible sous licence
GPL. Grâce a cette bibliothèque, vous pouvez créer des programmes open-source,
gratuits ou commerciaux.</p>
<p>La bibliothèque s'appelle GIMP toolkit (GTK) car elle a été créée à l'origine
pour le developpement de GIMP (General Image Manipilation Program).
Les auteurs de GTK sont:</p>
<ul>
<li><a href="mailto:petm%28at%29xcf.berkley.edu">Peter Mattis</a></li>
<li><a href="mailto:spencer%28at%29xcf.berkley.edu">Spencer Kimball</a></li>
<li><a href="mailto:jmacd%28at%29xcf.berkley.edu">Josh MacDonald</a></li>
</ul>
<p>GTK est une bibliothèque orientée objet . Bien qu'écrite en C, elle utilise
les notions de classes et de fontions callback.</p>
<h2>Complilation</h2>
<p>Afin de compiler des programmes GTK, vous devez dire au compilateur
gcc ce que sont les bibliothèques GTK et où elles se trouvent. La commande <i>gtk-config</i>
permet d'obtenir ces informations.</p>
# gtk-config --cflags --libs
<p>Elle doit vous donner en sortie quelque chose du genre (selon votre système):</p>
-I/opt/gnome/include/gtk-1.2 -I/opt/gnome/include/glib-1.2
-I/opt/gnome/lib/glib /include -I/usr/X11R6/include
-L/opt/gnome/lib -L/usr/X11R6/lib -lgtk -lgdk -rdynamic
-lgmodule -lglib -ldl -l Xext -lX11 -lm
<p>Explication de ces paramètres:</p>
-l library: Cherche une bibliothèque de la forme lib<i>library</i>.a
dans les chemins définis. <br>
-L path: Ajoute un chemin de recherche de bibliothèques. <br>
-I path: Ajoute un chemin de recherche de fichiers d'entête utilisés
par le programme. <br>
<p>Pour compiler un programme GTK nommé 'hello.c', utilisez la commande suivante:</p>
<p class="code">gcc -o hello hello.c `gtk-config --cflags --libs`</p>
<p>Le paramètre après le '-o' est le nom du programme compilé.</p>
<h2>Notre premier programme</h2>
<p>Nous supposons que GTK est installé sur votre machine. La dernière
version de GTK peut être obtenue à <a href="ftp://ftp.gtk.org">ftp.gtk.org</a>.</p>
<p>Ecrivons notre premier programme. Il va créer une simple fenêtre vide
de 200x200 pixels.</p>
<pre class="code">
#include <gtk/gtk.h>
int main( int argc,
char *argv[] )
{
GtkWidget *window;
gtk_init (&argc, &argv);
window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
gtk_widget_show (window);
gtk_main ();
return(0);
}
</pre>
<p>Le GtkWidget est un type de variable servant à déclarer divers composants graphiques comme
une fenêtre, un bouton, une étiquette... Dans cet exemple, une fenêtre
est déclarée par:</p>
GtkWidget *window;
<p>void gtk_init(int *argc,char ***argv) initialise le toolkit et récupère les
paramètres entrés sur la ligne de commande. Cette fonction doit être utilisée
après avoir déclaré les composants graphiques.</p>
<p>GtkWidget *gtk_window_new(GtkWindowType windowtype) crée une nouvelle
fenêtre. Le type de fenêtre peut être:</p>
<ul>
<li>GTK_WINDOW_TOPLEVEL</li>
<li>GTK_WINDOW_DIALOG</li>
<li>GTK_WINDOW_POPUP</li>
</ul>
<p>void gtk_widget_show(GtkWidget *widget) est utilisé pour faire apparaître
un composant graphique dans la fenêtre. Apres avoir défini un composant et
modifié ses attributs, cette fonction doit être utilisée.</p>
<p>void gtk_main(void) prépare les fenêtres et tous les composants à apparaître
à l'écran. Cette fonction doit être appelée à la fin des programmes GTK.
</p>
<p>Utilisons quelques propriétés de fenêtres comme le titre, la taille,
la position...</p>
<p>void gtk_window_set_title(GtkWindow *window,const gchar *title) est
utilisé pour définir ou changer le nom de <i>window</i>. Le premier paramètre
de cette fonction se trouve dans le type GtkWindow, mais la variable <i>window</i>
se trouve dans le type GtkWidget.
Pendant la compilation, nous en serons avertis. Même si le programme compilé
fonctionne correctement, il est préférable de le modifier par
GTK_WINDOW(GtkWidget *widget). Le second paramètre <i>title</i>
est de type gchar, défini dans la bibliothèque glib et il est équivalent
au type char.</p>
<p>void gtk_window_set_default_size(GtkWindow *window, gint width, gint
height) définit les dimensions de <i>window</i>. Comme gchar, gint est
défini dans glib, et il est équivalent au type int.</p>
La fonction
<p class="code">void gtk_window_set_position(GtkWindow *window,
GtkWindowPosition position)</p>
définit la position de <i>window</i>. La valeur de <i>position</i>
peut être:
<ul>
<li>GTK_WIN_POS_NONE</li>
<li>GTK_WIN_POS_CENTER</li>
<li>GTK_WIN_POS_MOUSE</li>
<li>GTK_WIN_POS_CENTER_ALWAYS</li>
</ul>
<p>Voici un exemple:</p>
<pre class="code">
#include <gtk/gtk.h>
int main( int argc,
char *argv[] )
{
GtkWidget *window;
gtk_init (&argc, &argv);
window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
gtk_window_set_title(GTK_WINDOW(window),"Ýlk Program");
gtk_window_set_position(GTK_WINDOW(window),GTK_WIN_POS_CENTER);
gtk_window_set_default_size(GTK_WINDOW(window),300,300);
gtk_widget_show (window);
gtk_main ();
return(0);
}
</pre>
<h2>Signaux et événements</h2>
<p>Avec les "GUI", vous devez utiliser la souris et le clavier, c'est-à-dire
que vous pouvez cliquer sur un bouton. Pour ce faire, on utilise la
fonction GTK suivante :</p>
<p class="code">guint gtk_signal_connect_object(GtkObject
*object,const gchar *name,GtkSignalFunc func,GtkObject
*slot_object);</p>
<p><i>object</i> est le composant graphique qui émet les signaux. Par
exemple, vous voulez savoir si on a cliqué sur un bouton, <i>object</i>
sera ce bouton. <i>name</i> est le nom de l'événement qui peut être : </p>
<ul>
<li>event</li>
<li>button_press_event</li>
<li>button_release_event</li>
<li>motion_notify_event</li>
<li>delete_event</li>
<li>destroy_event</li>
<li>expose_event</li>
<li>key_press_event</li>
<li>key_release_event</li>
<li>enter_notify_event</li>
<li>leave_notify_event</li>
<li>configure_event</li>
<li>focus_in_event</li>
<li>focus_out_event</li>
<li>map_event</li>
<li>unmap_event</li>
<li>property_notify_event</li>
<li>selection_clear_event</li>
<li>selection_request_event</li>
<li>selection_notify_event</li>
<li>proximity_in_event</li>
<li>proximity_out_event</li>
<li>drag_begin_event</li>
<li>drag_request_event</li>
<li>drag_end_event</li>
<li>drop_enter_event</li>
<li>drop_leave_event</li>
<li>drop_data_available_event</li>
<li>other_event</li>
</ul>
<p><i>func</i> est le nom de la fonction qui sera appelée lorsque l'événement
aura lieu. Voici un exemple:</p>
<pre class="code">
#include <gtk/gtk.h>
void close( GtkWidget *widget,gpointer *data)
{
gtk_main_quit();
}
int main( int argc,char *argv[] )
{
GtkWidget *window;
gtk_init (&argc, &argv);
window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
gtk_signal_connect (GTK_OBJECT (window), "destroy",
GTK_SIGNAL_FUNC (close), NULL);
gtk_widget_show (window);
gtk_main ();
return(0);
}
</pre>
La fonction
<p class="code">gtk_signal_connect (GTK_OBJECT (window),
"destroy",GTK_SIGNAL_FUNC (close), NULL)</p>
attend l'événement "destroy" lié à la fenêtre. Lorsqu'on tente
de fermer la fenêtre, la fonction <i>close</i> est appelée. Elle appelle
gtk_main_quit() et le programme s'arrête.<br>
<br>
<p>Les détails sur les signaux et les événement seront abordés plus tard...</p>
<h2>Un bouton simple</h2>
<p>Les boutons normaux sont utilisés en général pour faire certaines choses
quand on clique dessus. Avec la bibliothèque GTK, il y a deux façons de
créer des boutons :</p>
<ol>
<li>GtkWidget* gtk_button_new (void);</li>
<li>GtkWidget* gtk_button_new_with_label (const gchar
*label);</li>
</ol>
<p>La première fonction crée un bouton sans étiquette (pas de texte écrit sur le
bouton). La deuxième crée un bouton avec une étiquette (<i>label</i> est écrit
sur le bouton).</p>
<p>Ici, nous allons utiliser une nouvelle fonction:</p>
<p class="code">void gtk_container_add(GtkContainer
*container,GtkWidget *widget)</p>
<p>Avec cette fonction, il est possible d'ajouter un bouton (ou un composant
graphique) dans une fenêtre (habituellement dans un conteneur).
Dans le prochain exemple, le conteneur est une fenêtre
et le composant à ajouter est un bouton. Nous verrons d'autres conteneurs
plus tard.</p>
<p>La chose la plus importante pour un bouton est de savoir si on clique
dessus ou non. Une nouvelle fois, on utilise la fonction gtk_signal_connect
dans ce but. Grâce à cette fonction, une autre fonction pourra être
appelée et exécutera le code associé au bouton. Voici un exemple:</p>
<pre class="code">
#include <gtk/gtk.h>
void close( GtkWidget *widget,gpointer *data)
{
gtk_main_quit();
}
void clicked(GtkWidget *widget,gpointer *data)
g_print("Button Clicked\n");
}
int main( int argc,char *argv[] )
GtkWidget *window,*button;
gtk_init (&argc, &argv);
window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
gtk_signal_connect (GTK_OBJECT (window), "destroy",
GTK_SIGNAL_FUNC (close), NULL);
button=gtk_button_new_with_label("Button");
gtk_container_add(GTK_CONTAINER(window),button);
gtk_signal_connect(GTK_OBJECT(button),"clicked",
GTK_SIGNAL_FUNC(clicked),NULL);
gtk_widget_show(button);
gtk_widget_show(window);
gtk_main ();
return(0);
}
</pre>
</body>
</html>