Vous êtes sur la page 1sur 8

Cours GTK 2 http://gtk.developpez.com/cours/gtk2/?

page=page_4

Forums Tutoriels Magazine FAQs Blogs Chat Newsletter tudes Emploi Club
Contacts
p
u
Vos offres d'emploi informatique U I
b
T li
T
Dveloppeurs, chefs de projets, ingnieurs, informaticiens GRA c
i
Postez gratuitement vos offres d'emploi ici visible par 4 000 000 visiteurs uniques par mois t

emploi.developpez.com

Accueil ALM Java .NET Dv. Web EDI Programmation SGBD Office Solutions d'entreprise Applications Mobiles Systmes

Accueil C Forums C FAQ C Tutoriels C Livres C Compilateurs et outils C Sources C Bibliothques C GTK+

ACCUEIL GTK+ FORUM GTK+ FAQ GTK+ TUTORIELS GTK+ SOURCES GTK+ BIBLIOTHEQUES LIVRES GTK+ OUTILS GTK+

Cours GTK 2

Table des matires

IV. Les labels


IV-A. Cration et affichage d'un
label.
IV-A-1. Cration d'un
label.
IV-A-2. Insrer le texte
dans la fentre.
IV-A-3. Programme
exemple
IV-B. Les caractres accentus
IV-B-1. Application test
IV-B-2. Comment a
marche ?
IV-B-3. Solution
IV-B-4. Programme
exemple
IV-C. Formatage du texte
IV-C-1. Dfinition du
format
IV-C-2. Les balises
rapides
IV-C-3. La balise <span>
IV-C-4. Alignement du
texte
IV-C-5. Programme
exemple
IV-D. En savoir plus
IV-D-1. Fonctions
documentes
IV-D-2. Fonctions non
documentes

IV. Les labels


Maintenant que nous savons crer une fentre, nous allons crer l'incontournable
Hello World ! . Pour cela, nous allons utiliser le widget GtkLabel qui nous permet
d'afficher du texte.

IV-A. Cration et affichage d'un label.

Nous allons maintenant voir comment crer un label, et comment l'insrer dans la
fentre principale.

IV-A-1. Cration d'un label.

On cre un pointeur vers la structure GtkWidget.

Dans un premier temps, il faut dclarer le pointeur sur l'objet GtkLabel :

Slectionnez
GtkWidget *pLabel;

Ensuite il faut initialiser cet objet. Pour cela, il n'existe qu'une seule fonction :

Slectionnez

1 sur 8 05/08/2015 05:18


Cours GTK 2 http://gtk.developpez.com/cours/gtk2/?page=page_4

GtkWidget* gtk_label_new(const char* str);

Le paramtre str n'est autre que la chane de caractres qu'il faudra afficher.

Pour notre exemple, la ligne de code sera :

Slectionnez
pLabel = gtk_label_new("Hello World!");

IV-A-2. Insrer le texte dans la fentre.

Pour pouvoir afficher le texte, il faut insrer le widget pLabel dans la fentre principale
(widget pWindow). Pour cela, nous allons utiliser le fait que le widget GtkWindow
drive du widget GtkContainer. L'atout principal d'un GtkContainer est, comme son
nom le laisse entendre, qu'il peut contenir et afficher un autre widget. Les widgets de
ce type sont appels des conteneurs. Il faudra donc diffrencier deux types d'objets :

Le widget conteneur (aussi appel widget parent) ;


Le widget contenu (aussi appel widget enfant) qui pourra par la suite devenir
lui-mme un conteneur s'il possde les proprits de GtkContainer.

tudions donc maintenant la fonction qui nous servira insrer un widget dans un
widget conteneur :

Slectionnez
void gtk_container_add(GtkContainer *container, GtkWidget *widget);

Le premier paramtre, container, est le widget conteneur dans lequel on veut insrer
le widget widget qui lui est pass en deuxime paramtre. Le premier paramtre de
cette fonction est de type GtkContainer, alors que les widgets conteneurs seront tous
de type GtkWidget. Il faudra donc nouveau utiliser une macro de conversion qui
cette fois est GTK_CONTAINER().

Pour notre exemple, la ligne de code sera :

Slectionnez
gtk_container_add(GTK_CONTAINER(pWindow), pLabel);

IV-A-3. Programme exemple

Slectionnez
#include <stdlib.h>
#include <gtk/gtk.h>

int main(int argc,char **argv)


{
GtkWidget* pWindow;
GtkWidget* pLabel;

gtk_init(&argc,&argv);

pWindow = gtk_window_new(GTK_WINDOW_TOPLEVEL);
gtk_window_set_title(GTK_WINDOW(pWindow), "Les labels");
gtk_window_set_default_size(GTK_WINDOW(pWindow), 320, 200);

/* Creation du label */
pLabel=gtk_label_new("Hello World!");

/* On ajoute le label a l'intrieur de la fentre */


gtk_container_add(GTK_CONTAINER(pWindow), pLabel);

/* Affichage de la fentr et de tout ce qu'il contient */


gtk_widget_show_all(pWindow);

/* Connexion du signal
/* On appelle directement la fonction de sortie de boucle */
g_signal_connect(G_OBJECT(pWindow), "destroy", G_CALLBACK(gtk_main_quit), NULL);

gtk_main();

return EXIT_SUCCESS;
}

Rsultat :

2 sur 8 05/08/2015 05:18


Cours GTK 2 http://gtk.developpez.com/cours/gtk2/?page=page_4

IV-B. Les caractres accentus

Vous avez peut-tre dj essay d'afficher du texte contenant des caractres tel que
, , , , et lors de l'excution, votre texte ne s'affiche compltement. Nous
allons maintenant voir le pourquoi du comment.

IV-B-1. Application test

Pour vous montrer tout cela, nous allons reprendre l'exemple prcdent en remplaant
Hello Word par Texte afficher , et cela ne marche pas! En effet vous obtenez
cela :

Et en plus sur la console, vous avez le message d'erreur suivant :

** (Label2.exe) : WARNING **: Invalid UTF8 string passed to


pango_layout_set_text()

IV-B-2. Comment a marche ?

Pour afficher du texte, Gtk utilise la librairie Pango qui s'occupe du rendu et de
l'affichage du texte. Le but de Pango est de permettre l'internationalisation des
applications, et pour cela Pango utilise l'encodage UTF8. Ce charset est code sur 16
bits, ce qui offre la possibilit d'afficher plus 65000 caractres, permettant ainsi
d'afficher des caractres accentus et bien plus (ex : pour le grec, le chinois).

Puisque Pango sait faire tout cela, pourquoi le test n'a-t-il pas fonctionn? Et bien, tout
simplement parce que votre systme d'exploitation n'utilise pas ce charset. Lorsque
vous souhaitez afficher Texte afficher , Pango va avant tout vrifier l'encodage
d'un caractre et si l'un de ces caractres n'est pas correct, Pango va arrter son
processus de rendu et envoyer un message d'erreur.

Le moyen le plus simple pour voir les effets d'une erreur d'encodage est de changer
celui de votre navigateur. Modifiez les options de votre navigateur afin d'utiliser
l'encodage UNICODE. Cette page web utilisant le charset iso-8859-1, les caractres
accentus deviendront des carrs ou autre chose.

IV-B-3. Solution

Une seule chose s'impose nous : il faut convertir notre chane de caractre en UTF8.
Pour cela, il faut utiliser une fonction de Glib qui est :

Slectionnez
gchar* g_locale_to_utf8(const gchar *opsysstring, gsize len, gsize *bytes_read, gsize

La valeur de retour est le pointeur sur la chane de caractre frachement convertie. Si


une erreur est survenue lors de la conversion, g_locale_to_utf8 renvoie NULL. Il
faudra tout de mme librer le mmoire alloue par cette fonction lorsque la variable
ne sera plus utile.

Le premier paramtre opsysstring est la chane de caractre convertir et le second


paramtre len correspond la longueur de la chane. Ce paramtre sera en gnral
gal -1 (on laisse la bibliothque calculer la longueur toute seule).

Les trois derniers paramtres sont utiles en cas d'erreur lors de la conversion. Tout

3 sur 8 05/08/2015 05:18


Cours GTK 2 http://gtk.developpez.com/cours/gtk2/?page=page_4

d'abord bytes_read est le nombre d'octet qui ont t lus dans le texte convertir, et
bytes_writen le nombre d'octet qui ont t cris dans la nouvelle chane de caractres.

Le dernier paramtre error, donne plus de prcision en cas d'erreur. Voici la liste des
messages d'erreur possibles :

G_CONVERT_ERROR_NO_CONVERSION ;
G_CONVERT_ERROR_ILLEGAL_SEQUENCE ;
G_CONVERT_ERROR_FAILED ;
G_CONVERT_ERROR_PARTIAL_INPUT ;
G_CONVERT_ERROR_BAD_URI ;
G_CONVERT_ERROR_NOT_ABSOLUTE_PATH.

Pour notre exemple, nous n'allons pas utiliser les trois derniers paramtres. En cas
d'erreur, il n'y aura donc aucun moyen d'avoir plus de prcision sur l'erreur survenue.

IV-B-4. Programme exemple

Slectionnez
#include <stdlib.h>
#include <gtk/gtk.h>

int main(int argc,char **argv)


{
GtkWidget* pWindow;
GtkWidget* pLabel;
gchar* sUtf8;

gtk_init(&argc, &argv);

pWindow = gtk_window_new(GTK_WINDOW_TOPLEVEL);
gtk_window_set_title(GTK_WINDOW(pWindow), "Les labels II");
gtk_window_set_default_size(GTK_WINDOW(pWindow), 320, 200);

/* Creation du label avec g_locale_to_utf8 */


sUtf8 = g_locale_to_utf8("Texte afficher", -1, NULL, NULL, NULL);
pLabel=gtk_label_new(sUtf8);
g_free(sUtf8);

/* On ajoute le label a l'intrieur de la fentre */


gtk_container_add(GTK_CONTAINER(pWindow), pLabel);

/* Affichage de la fentre et de tout ce qu'il contient */


gtk_widget_show_all(pWindow);

/* Connexion du signal
/* On appelle directement la fonction de sortie de boucle */
g_signal_connect(G_OBJECT(pWindow), "destroy", G_CALLBACK(gtk_main_quit), NULL);

gtk_main();

return EXIT_SUCCESS;
}

Rsultat :

IV-C. Formatage du texte

Nous allons maintenant voir comment modifier l'apparence de notre texte (police,
couleur).
Pour notre application test, nous allons afficher une ligne en Courier gras taille 10, une
ligne en Times New Roman italique bleu taille 12, et une ligne en Verdana soulign
taille 16. Et tout cela centr (bien sr).

IV-C-1. Dfinition du format

Une fois encore, nous allons utiliser les proprits de Pango (mme si nous n'allons
pas utiliser les fonctions de Pango directement).

Pour dfinir le format du texte, il suffit d'insrer des balises l'intrieur mme de
notre texte. Pango s'occupe ensuite de rechercher les balises puis de formater le texte
notre convenance.

IV-C-2. Les balises rapides

4 sur 8 05/08/2015 05:18


Cours GTK 2 http://gtk.developpez.com/cours/gtk2/?page=page_4

Les balises rapides servent mettre le texte en gras, italique ou autre de manire trs
simple. Voici l'intgralit de ces balises :

Balise Action Exemple


<b> Met le texte en gras texte
Augment lgrement la taille
<big>
du texte
texte
<i> Met le texte en italique texte
<s> Barre le texte texte
<sub> Met le texte en indice texte

<sup> Met le texte en exposant texte

Diminue lgrement la taille


<small> texte
du texte
<tt> Met le texte en tltype texte
<u> Souligne le texte texte

Pour utiliser ces balises, il suffit d'encadrer le texte modifier des balises de
formatage. Par exemple, pour mettre le texte en gras, il faudra entrer : Normal vs
<b>Gras</b> .

Mais cela ne suffit pas, il faut aussi dire que le texte utilise les balises Pango, ce qui
est possible avec la fonction suivante :

Slectionnez
void gtk_label_set_use_markup(GtkLabel *label, gboolean setting);

Il faut mettre le paramtre setting TRUE, et le texte sera alors format en


consquence.

Un autre moyen de spcifier l'utilisation des balises, est d'utiliser cette fonction :

Slectionnez
void gtk_label_set_markup(GtkLabel *label, const gchar *str);

Cette fonction dit Pango qu'il faut utiliser les balises, mais elle modifie aussi le label
en affichant la chane de caractres str (deuxime paramtre).

IV-C-3. La balise <span>

Cette fois-ci, nous allons tudier la balise <span> en dtail. Avec celle-ci, nous allons
pouvoir changer la police de caractres, la couleur du texte et bien d'autres choses.

Cette balise s'utilise comme les prcdentes si ce n'est qu'elle accepte des
paramtres. Le tableau ci-dessous prsente tous les paramtres et les effets sur le
texte.

Paramtre Utilisation Exemple


Pour dfinir la police
utiliser. Si la valeur
donne ce paramtre
est incorrecte, la police
par dfaut (Sans Serif)
font_family
sera utilise.
Exemple : <span
font_family=\"Courier
New\">Courier
New</span>
Identique font_family
Exemple : <span
face face=\"Times New
Roman\">Times New
Roman</span>
Pour dfinir la taille du
texte (par dfaut 10).
size Exemple : <span
size=\"12\">Taille
12</span>
Pour dfinir le style du
texte. Trois valeurs
possibles : normal,
style oblique, italic.
Exemple : <span
style=\"oblique
\">Oblique</span>

5 sur 8 05/08/2015 05:18


Cours GTK 2 http://gtk.developpez.com/cours/gtk2/?page=page_4

Permet de combiner les


paramtres prcdents
en un seul.
font_desc Exemple : <span
font_desc=\"Courier
New italic 12\">Courier
New italic 12</span>
Permet de dfinir
l'paisseur des lettres.
Les valeurs peuvent tre
ultralight, light, normal,
bold, utrabold, heavy ou
encore une valeur
weight numrique. (Vous
remarquerez qu'il n'y a
que peu ou pas de
diffrence).
Exemple : <span
weight=\"bold
\">Bold</span>
Pour dfinir si l'on veut
du texte normal
(normal) ou en petite
majuscule (smallcaps).
Exemple : <span
variant
variant=\"smallcaps
\">Smallcaps</span>
Afin de pourvoir
l'utiliser, il faut avoir la
police : nom smallcaps
Permet d'tirer le texte.
La valeur de ce
paramtre peut tre :
ultracondensed,
extracondensed,
condensed,
semicondensed, normal,
stretch semiexpanded,
expanded,
extraexpanded,
ultraexpanded.
Afin de pourvoir
l'utiliser, il faut avoir la
police : nom condensed
(ou autre).
Pour dfinir la couleur du
texte. Il faut donner la
valeur hexadcimale de
la palette RVB.
foreground
Exemple : <span
foreground=\"#FF0000
\">Couleur
Texte</span>
Pour dfinir la couleur du
fond. Il faut donner la
valeur hexadcimale de
la palette RVB.
background
Exemple : <span
background=\"#FF0000
\">Couleur
Texte</span>

Pour souligner le texte.


Exemple : <span
underline
underline=\"double
\">Double</span>

Pour dplacer le texte


rise
verticalement.
Pour barrer le texte.
Exemple : <span
strikethrough strikethrough=\"true
\">Striketrough = "true"
</span>
Pour indiquer la langue
lang
du texte.

Tous ces paramtres peuvent tre mis l'intrieur d'une seule balise <span>.

IV-C-4. Alignement du texte

6 sur 8 05/08/2015 05:18


Cours GTK 2 http://gtk.developpez.com/cours/gtk2/?page=page_4

Maintenant, nous allons voir comment aligner notre texte, lorsque celui-ci comporte
plusieurs lignes. Comme d'habitude, GTK+ nous fourni une fonction trs simple
d'utilisation :

Slectionnez
void gtk_label_set_justify(GtkLabel *label, GtkJustification jtype);

Le paramtre jtype correspond l'alignement du texte et peut prendre une de ces


valeurs :

GTK_JUSTIFY_LEFT pour aligner le texte gauche (par dfaut) ;


GTK_JUSTIFY_RIGHT pour aligner le texte droite ;
GTK_JUSTIFY_CENTER pour centrer le texte ;
GTK_JUSTIFY_FILL pour justifier le texte.

Au contraire, pour obtenir l'alignement du texte, la fonction est :

Slectionnez
GtkJustification gtk_label_get_justify(GtkLabel *label);

IV-C-5. Programme exemple

Slectionnez
#include <stdlib.h>
#include <gtk/gtk.h>

int main(int argc,char **argv)


{
GtkWidget* pWindow;
GtkWidget* pLabel;
gchar* sUtf8;

gtk_init(&argc,&argv);

pWindow = gtk_window_new(GTK_WINDOW_TOPLEVEL);
gtk_window_set_title(GTK_WINDOW(pWindow),"Les labels III");
gtk_window_set_default_size(GTK_WINDOW(pWindow),320,200);

/* Creation du label avec g_locale_to_utf8 */


pLabel=gtk_label_new(NULL);

/* On utilise les balises */


sUtf8 = g_locale_to_utf8("<span face=\"Courier New\"><b>Courier New 10 Gras</b></span>\n
"<span font_desc=\"Times New Roman italic 12\" foreground=\"#0000FF\">Times
"<span face=\"Sans\" size=\"16\"><u>Sans 16 Soulign</u></span>",
-1, NULL, NULL, NULL);
gtk_label_set_markup(GTK_LABEL(pLabel), sUtf8);
g_free(sUtf8);

/* On centre le texte */
gtk_label_set_justify(GTK_LABEL(pLabel), GTK_JUSTIFY_CENTER);

/* On ajoute le label a l'interieur de la fenetre */


gtk_container_add(GTK_CONTAINER(pWindow),pLabel);

/* Affichage de la fenetre et de tout ce qu'il contient */


gtk_widget_show_all(pWindow);

/* Connexion du signal
/* On appelle directement la fonction de sortie de boucle */
g_signal_connect(G_OBJECT(pWindow),"destroy",G_CALLBACK(gtk_main_quit),0);

gtk_main();

return EXIT_SUCCESS;
}

Rsultat :

IV-D. En savoir plus

IV-D-1. Fonctions documentes

7 sur 8 05/08/2015 05:18


Cours GTK 2 http://gtk.developpez.com/cours/gtk2/?page=page_4

Slectionnez
void gtk_label_set_text(GtkLabel* label, const char* str)
void gtk_label_set_label(GtkLabel* label, const gchar* str)

Ces deux fonctions permettent de changer le texte d'un GtkLabel.

Entre(s) :

label : objet GtkLabel.


str : nouveau texte.
Sortie : rien.

Slectionnez
G_CONST_RETURN gchar* gtk_label_get_text(GtkLabel* label)
G_CONST_RETURN gchar* gtk_label_get_label(GtkLabel* label)

Permet de recevoir l'adresse de la chane de caractre affiche par le label.

Entre(s) :

label : objet GtkLabel.


Sortie : const gchar*.

Slectionnez
gboolean gtk_label_get_use_markup(GtkLabel *label);

Permet de savoir si un label utilise les balises de formatages Pango.

Entre(s) :

label : objet GtkLabel.


Sortie : gboolean, si oui TRUE, sinon FALSE.

IV-D-2. Fonctions non documentes

Slectionnez
void gtk_label_set_attributes(GtkLabel *label, PangoAttrList *attrs);
void gtk_label_set_markup_with_mnemonic(GtkLabel *label, const gchar *str);
void gtk_label_set_pattern(GtkLabel *label, const gchar *pattern);
guint gtk_label_parse_uline(GtkLabel *label, const gchar *string);
void gtk_label_set_line_wrap(GtkLabel *label, gboolean wrap);
void gtk_label_get_layout_offsets(GtkLabel *label, gint *x, gint *y);
guint gtk_label_get_mnemonic_keyval(GtkLabel *label);
gboolean gtk_label_get_selectable(GtkLabel *label);
GtkWidget* gtk_label_new_with_mnemonic(const char *str);
void gtk_label_select_region(GtkLabel *label, gint start_offset, gint end_offset);
void gtk_label_set_mnemonic_widget(GtkLabel *label, GtkWidget *widget);
void gtk_label_set_selectable(GtkLabel *label, gboolean setting);
void gtk_label_set_text_with_mnemonic(GtkLabel *label, const gchar *str);
PangoAttrList* gtk_label_get_attributes(GtkLabel *label);
PangoLayout* gtk_label_get_layout(GtkLabel *label);
gboolean gtk_label_get_line_wrap(GtkLabel *label);
GtkWidget* gtk_label_get_mnemonic_widget(GtkLabel *label);
gboolean gtk_label_get_selection_bounds(GtkLabel *label, gint *start, gint *end);
gboolean gtk_label_get_use_underline(GtkLabel *label);
void gtk_label_set_use_underline(GtkLabel *label, gboolean setting);

Les sources prsentes sur cette page sont libres de droits et vous pouvez les utiliser votre
convenance. Par contre, la page de prsentation constitue une uvre intellectuelle protge
par les droits d'auteur. Copyright 2013 developpez. Aucune reproduction, mme partielle,
ne peut tre faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc.
sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu' trois ans de
prison et jusqu' 300 000 de dommages et intrts.

Responsable bnvole de la rubrique GTK+ : Francis Walter - Contacter par email

Nous contacter Participez Hbergement Informations lgales Partenaire : Hbergement Web


Copyright 2000-2015 - www.developpez.com

8 sur 8 05/08/2015 05:18