Aller au menu - Aller au contenu

Icône Le texte avec les labels

Avatar
Avatar
Avatar
Avatar
Mise à jour : 12/07/2009
1 945 visites depuis 7 jours, dont 182 sur ce chapitre classé 71/786
Dans le chapitre précédent, nous avons vu comment faire une fenêtre. Le problème est qu'une fenêtre vide sert à rien. C'est pourquoi, dans ce chapitre, nous allons découvrir comment afficher du texte dans nos fenêtres. Pour cela nous allons utiliser des labels. Pour ceux qui ne parlent pas anglais, label veut dire étiquette. Nous allons donc "accrocher" des étiquettes sur nos widgets :p .
lais signifiant étiquette.
Sommaire du chapitre :
Icône du chapitre
Chapitre précédent Sommaire Chapitre suivant

Les GtkLabels

Créer un label



Tout d'abord, nous allons déclarer un nouvel objet GtkLabel de type GtkWidget. Vous pouvez l'appeler comme vous le voudrez.
Je rappelle qu'il est indispensable de déclarer un widget avant de l'utiliser.


Code : C
1
GtkWidget* label = NULL;


Maintenant que notre widget est déclaré, nous allons l'initialiser avec la fonction suivante:

Code : C
1
GtkWidget* gtk_label_new (const gchar *str);


Le paramètre :
  • str : Le texte de notre label entre guillemets.

Voilà, notre GtkLabel est créé. Nous allons maintenant le rajouter dans la fenêtre avec la fonction suivante :


Code : C
1
void gtk_container_add (GtkContainer *container, GtkWidget *widget);


Les paramètres :
  • container : Le nom du widget qui contiendra notre label. Dans notre cas, c'est la fenêtre.
  • widget : Le nom du widget à ajouter. Ici, nous rajouterons notre label

Attention, container est de type GtkContainer. Pour que notre fonction marche nous allons utiliser une macro comme pour les fenêtres: GTK_CONTAINER().

N'oubliez pas d'afficher la fenêtre et le label, pour ce faire utilisez la fonction gtk_widget_show_all ! ;)

Les deux dernières fonctions sont très très importantes, elles vous serviront dans tous vos programmes. La première sert à ajouter un widget dans la fenêtre (ou dans un autre container) et la deuxième sert à afficher cette fenêtre. Dans la suite de ce tutorial, je ne vais pas répéter qu'il faut utiliser ces fonctions à chaque fois. C'est logique, sans ces fonctions, rien ne s'affiche.


Récupérer et modifier un label



Récupérer un label



Dans certains programmes, il est parfois nécessaire de récupérer le contenu d'un label. Là aussi, une fonction très simple :

Code : C
1
const gchar* gtk_label_get_label (GtkLabel *label);


Le paramètre :
  • label : Le nom de notre label que l'on veut récupérer.

Attention, label est de type GtkLabel. Comme pour container, nous allons utiliser la macro GTK_LABEL().
De plus, faites bien attetion, la fonction renvoie un pointeur const.
Cette fonction retourne le texte de notre label (avec son formatage, voir plus bas) dans une variable. Faites attention si vous lisez la doc de GTK, il existe une fonction semblable, mais qui ne prend pas en compte le formatage.



Modifier un label



Sur le principe de la dernière fonction, gtk_label_set_label () permet de modifier un label.

Code : C
1
void gtk_label_set_label (GtkLabel *label, const gchar *str);


Les paramètres :
  • label : Le nom du label que l'on veut modifier.
  • str : Le nouveau texte que l'on veut mettre dans le label.

Les Accents

Il y a un bug avec GTK ! Quand j'écris Je suis un zéro, il coupe le texte au niveau de l'accent, ou m'affiche des caractères bizarres !!!
Bonne remarque ! Les textes accentués ne s'affichent pas bien, et ce n'est pas un bug.

Pango, l'indispensable

Pour afficher un texte, GTK utilise Pango (Pan du grec qui veut dire "tous" et go du japonais qui veut dire "langage": tous les langages). C'est une bibliothèque qui est chargée du rendu des caractères et de l'affichage de texte internationalisé. Pour les spécialistes, cette bibliothèque utilise l'Unicode (pour l'encodage des caractères).
Pourquoi alors votre texte ne s'affiche pas comme vous le souhaitez? La raison est que votre système d'exploitation n'utilise pas forcement le même jeu de caractère que notre bibliothèque. Nous allons trés rapidement contourner ce problème en utilisant la fonction ci-dessous qui va convertir notre texte : Code : C
gchar* g_locale_to_utf8 (const gchar *opsysstring, gssize len, gsize *bytes_read, gsize *bytes_written, GError **error);
Les paramètres :
  • opsysstring : Ici, nous mettons le texte que nous voulons convertir.
  • len : C'est la longueur de notre chaîne de caractère (notre texte). Vous pouvez vous embêter à compter, mais personnellement je laisse GTK calculer cela tout seul, en mettant -1 comme valeur.
  • bytes_read : C'est un paramètre utile pour les erreurs, il donne le nombre de bytes qui ont été convertis avec succès.
  • bytes_written : C'est un paramètre utile aussi pour les erreurs, il donne le nombre de bytes qui ont été écrit dans la nouvelle chaîne de caractères.
  • error : C'est ici que se trouvent les codes d'erreurs (s'il y en a une ^^ ). Ils sont :
    • G_CONVERT_ERROR_NO_CONVERSION -> La conversion de cette chaîne de caractère n'est pas supportée.
    • G_CONVERT_ERROR_ILLEGAL_SEQUENCE -> L'ordre des bytes n'est pas compatible.
    • G_CONVERT_ERROR_FAILED -> Conversion échouée par une raison inconnue.
    • G_CONVERT_ERROR_PARTIAL_INPUT -> La chaine de caractères est incomplète à la fin de l'entrée.
    • G_CONVERT_ERROR_BAD_URI -> L'URI est invalide.
    • G_CONVERT_ERROR_NOT_ABSOLUTE_PATH -> Le nom n'est pas un chemin absolu.
  • Nous mettons les trois derniers paramètres à NULL pour que ça marche.
Cette fonction converti la chaine, mais ne la modifie pas : elle alloue de la mémoire pour stocker la conversion et retourne un pointeur vers celle-ci. N'oubliez donc pas de libérer cette chaine avec g_free.

Voir aussi

Si cela vous embête d'avoir à convertir toutes vos chaines accentuées, il existe une solution toute simple. Voir les astuces dans les annexes

Changer le style d'un label

C'est génial d'afficher du texte, mais j'aimerais le centrer et le mettre en gras. Tu n'a pas une fonction qui pourrait faire ça?

GTK, n'est pas un traitement de texte... :lol: , mais ses créateurs nous ont prévu ce genre de fonction.



L'alignement



Le texte est pour le moment aligné à gauche, mais moi je préfèrerais qu'il soit centré, pas vous?
Pour modifier l'alignement de notre label, la fonction gtk_label_set_justify () est tout à fait appropriée, tout simplement par ce qu'elle ne sait faire que ça. :p

Code : C
1
void gtk_label_set_justify (GtkLabel *label, GtkJustification jtype);


Les paramètres :
  • label : Le nom de notre label que l'on veut modifier
  • jtype : Le type d'alignement que l'on veut appliquer à notre label. Il peut prendre une de ces quatre valeurs:
    • GTK_JUSTIFY_LEFT -> Aligne le texte à gauche (par défaut).
    • GTK_JUSTIFY_CENTER -> Aligne le texte au centre.
    • GTK_JUSTIFY_RIGHT -> Aligne le texte à droite.
    • GTK_JUSTIFY_FILL -> Aligne le texte à droite et à gauche à la fois. Le texte est alors justifié.



Le formatage du texte avec les balises



Pour mettre un texte en forme, Pango utilise des balises (comme pour le Zcode).

Avec les balises "simples" ou "courtes"



Les balises ci-dessous vous permettent de personnaliser un texte simplement.
  • <b> -> Mets le texte en gras
  • <i> -> Mets le texte en italique
  • <u> -> Souligne le texte
  • <s> -> Barre le texte
  • <sub> -> Mets le texte en indice
  • <big> -> Rend la police relativement plus grande (+1)
  • <small> -> Rend la police relativement plus petite (-1)
  • <tt> -> Met le texte en télétype



Avec Span



La balise <span class="bleugris">span</span> est différente des dernières. Elle a des attributs qui lui permettent de modifier la police, la taille, la couleur des caractères.
Elle s'utilise comme ceci :
<span attribut1="valeur" attribut2="valeur">...</span>
  • font_family -> Nom de la police de caractère
  • face -> C'est un autre attribut qui définit la police
  • size -> C'est la taille de la police. On peut aussi utiliser 'xx-small', 'x-small', 'small', 'medium', 'large', 'x-large', 'xx-large' ou une valeur numérique.
  • style -> Définit le style des caractères : 'normal', 'oblique' ou 'italic'
  • weight -> Définit le ton du gras du caractère : 'ultralight', 'light', 'normal', 'bold', 'ultrabold', 'heavy' ou une valeur numérique.
  • variant -> Met le texte en petites majuscules (smallcaps) ou en normal (normal, valeur par défaut).
  • stretch -> définit l'espacement des lettres: 'ultracondensed', 'extracondensed', 'condensed', 'semicondensed', 'normal', 'semiexpanded', 'expanded', 'extraexpanded' ou 'ultraexpanded'.
  • foreground -> Définit la couleur du texte en valeur hexadécimale
  • background -> Définit la couleur du fond texte en valeur hexadécimale
  • underline -> Définit le soulignement du texte: 'single', 'double', 'low' ou 'none'.
  • underline_color -> Définit la couleur du soulignement en valeur hexadécimale
  • rise -> Définit l'élévation du texte (en indice ou exposant) en valeur décimal (les valeurs négatives sont possibles, pour mettre notamment notre texte en indice)
  • strikethrough -> Pour barrer son texte. La valeur doit être soit TRUE ou FALSE
  • strikethrough_color -> Définit la couleur de la ligne qui barre le texte en valeur hexadécimale
  • fallback -> Si votre caractère n'est pas disponible dans le police choisie, alors une police qui contient ce caractère sera choisi. Elle est activée par défaut.
  • lang -> Définit la langue du texte

Maintenant, il y a une chose primordiale à ne pas oublier: il faut dire que l'on utilise les balises de pango.
Pour cela nous avons deux choix, soit on intègre ces balises directement dans notre fonction de convertion, soit nous utiliserons une fonction spécifique.



On intègre nos balises à notre fonction de convertion



Cette fonction très pratique permet de convertir à la fois le texte et les balises. Il vous suffit d'écrire vos balises avec votre texte dans g_locale_to_utf8 puis de rajouter la fonction ci-dessous après la convertion :

Code : C
1
void gtk_label_set_use_markup (GtkLabel *label, gboolean setting);


Les paramètres :
  • label : Le label à qui on veut appliquer les balises.
  • setting : On met TRUE pour que ça marche.



On utilise pas notre fonction de conversion



Si vous n'avez pas de caractères spéciaux à convertir, l'utilisation de cette fonction sera plus adaptée.

Code : C
1
void gtk_label_set_markup (GtkLabel *label, const gchar *str);


Les paramètres :
  • label : Le label à qui on veut appliquer les balises.
  • str : On met ici le texte avec les balises que l'on souhaite afficher

C'est fini, il ne reste plus qu'à afficher le label.

Exemple

Je vous propose un petit exemple qui reprend les fonctions vues dans ce chapitre ! :)

Code : C
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
#include <stdlib.h>
#include <gtk/gtk.h>

int main(int argc,char **argv)
{
    GtkWidget* Fenetre = NULL;
    GtkWidget* Label = NULL;
    gchar* TexteConverti = NULL;

    gtk_init(&argc, &argv);

    Fenetre = gtk_window_new(GTK_WINDOW_TOPLEVEL);  // Définition de la fenêtre
    gtk_window_set_title(GTK_WINDOW(Fenetre), "Le texte avec les labels"); // Titre de la fenêtre
    gtk_window_set_default_size(GTK_WINDOW(Fenetre), 300, 100); // Taille de la fenêtre
    
    TexteConverti = g_locale_to_utf8("<span face=\"Verdana\" foreground=\"#73b5ff\" size=\"xx-large\"><b>Le site du Zéro</b></span>\n <span face=\"Verdana\" foreground=\"#39b500\" size=\"x-large\">Le tuto GTK</span>\n", -1, NULL, NULL, NULL);  //Convertion du texte avec les balises
    Label=gtk_label_new(TexteConverti); // Application de la convertion à notre label
    g_free(TexteConverti); // Libération de la mémoire

    gtk_label_set_use_markup(GTK_LABEL(Label), TRUE); // On dit que l'on utilise les balises pango

    gtk_label_set_justify(GTK_LABEL(Label), GTK_JUSTIFY_CENTER); // On centre notre texte

    gtk_container_add(GTK_CONTAINER(Fenetre), Label);  // On ajoute le label a l'interieur de 'Fenetre'

    gtk_widget_show_all(Fenetre); // On affiche 'Fenetre' et tout ce qu'il contient

    g_signal_connect(G_OBJECT(Fenetre), "delete-event", G_CALLBACK(gtk_main_quit), NULL); // Je ne commente pas cette fonction, vous la verrez dans le chapitre suivant.

    gtk_main();

    return EXIT_SUCCESS;
}


Et voici le résultat :
Gtk Label


Maintenant c'est a vous de bosser... ^^

Q.C.M.

Pourquoi, quand j'écris "GTK est un Big Tuto sur le site du Zéro", il ne m'affiche pas mon texte entièrement ?
Que défini l'attribut foreground ?
A quoi sert la fonction gtk_label_set_use_markup() ?

Statistiques de réponses au QCM

Ce chapitre est fondamental (comme tout les chapitre de cette partie :p ), vous allez vous servir des labels partout où vous voudrez afficher du texte.

Dans le chapitre suivant, vous allez découvrir le fonctionnement des évènements. Là aussi, ce chapitre est primordial.
Je le qualifierais même comme le chapitre le plus important. Sans lui, vous ne saurez rien faire avec GTK. Si si, c'est vrai !

Chapitre précédent Sommaire Chapitre suivant

Partager

24 commentaires pour "Le texte avec les labels"
Note moyenne : 3.14 / 4 (29 votes)
Pseudo Commentaire
Hors ligne lothar59 # Posté le 13/01/2008 à 13:16:42

Très bon tutorial merci. Par contre faudrait changer les "" pour le span en \"\" ou ' ' parce que sinon ça marche pas comme écrit précédement. Les plus petites choses sont aussi les plus difficiles à trouver. Sinon merci encore pour le tutoriel.
Hors ligne Xavierh # Posté le 16/08/2008 à 17:53:49

Je ne met que 15 à ce tutoriel car certe il apprend beaucoup de choses, mais vous donnez tout d'un coup.
Vous devriez mettre plus de petits exemple que un gros à la fin.
De plus, je crois que vous devriez mettre par exemple un TP corrigé. Ce serait vraiment bien.

Et en effet il faut corriger l'erreur des " " " soit par des " ' " soit par des " " "
Hors ligne MR4 # Posté le 17/10/2008 à 12:42:38

L'erreur sur les attributs de span m'a fait chercher un peu :-( ...
Pour les attributs de span, il faut utiliser ' au lieu de " sinon le compilateur prend ça pour la fin de g_locale_to_utf8 et on se fait jeter à la compilation ! ( \" fonctionne aussi mais ' est plus simple).
Sinon tuto très intéressant, au moins pour les béotiens en la matière :-) ... comme moi...
Hors ligne artur56 # Posté le 10/06/2009 à 18:19:38

Super tuto, un peu rapide c'est vrai, mais il est super!!

par contre la fonction
Code : C
1
void gtk_label_set_justify (GtkLabel *label, GtkJustification jtype);

ne fonctionne pas chez moi, elle n'empêche pas le fonctionnement du programme mais ne sert à rien.
De plus le texte est centré par défaut chez moi.

J'ai eu quelques problèmes avec span avant les "" qu'il faut remplacer par ''.

Sinon
Secret (cliquez pour afficher)
18/20

Citation : Pas de titre
Chuck Norris a déjà compter jusqu'à l'infini... deux fois !!!

 
Hors ligne Cisla # Posté le 06/02/2011 à 14:12:10
Avatar

Idem que Arthur pour le gtk_label_set_justify. :(

Autrement très bon tuto, merci à vous ! :D

Voir tous les commentaires