Structure pour un programme Windows 2/4

Ce tutoriel a été écrit par Klaus.

Structure pour un programme Windows
Leçon 2

Dans cette leçon, nous allons reprendre le programme réalisé dans la leçon précédente (1/4) et le faire évoluer. Nous allons lui ajouter de nouvelles fonctionnalités, par un affichage supplémentaire et deux nouveaux événements.

Pour cela, nous allons ajouter l'affichage d'une liste des mots traités, et des boutons pour trier cette liste en ordre ascendant ou descendant, ainsi qu'un bouton d'effacement de la liste.

Nous allons procéder étape par étape, avec des explications détaillées à chaque niveau, et un code source Panoramic évoluant en conséquence, jusqu'au programme complet.

Pour mémoire, voici le programme réalisé dans la léçon précédente (1/4). Il permettait de saisir un mot, et le clic sur un bouton affichait le nombre de lettres contenues dans ce mot. Dans la foulée, nous allons rapprocher la colonne de droite (champ de saisie, affichage de résultat et bouton de commande) de la colonne de gauche, pour améliorer la présentation visuelle:

Code:

' Tutoriel sur la structure pour un programme Windows

' tous les labels du programme
label analyser_mot          : ' déclarer la routine événement:

' toutes les variables du programme
dim longueur%, mot_a_analyser$

' toutes les initialisations

' champ de saisie
edit 10                  : ' champ de saisie
top 10,20 : left 10,120  : ' position du coin en haut à gauche du champ dans la fenêtre

' affichage du nombre de caractères
ALPHA 20                  : ' zone d'affichage
top 20,80 : left 20,120  : ' position du coin en haut à gauche de la zone d'affichage dans la fenêtre
font_size 20,12          : ' pour avoir une taille lisible facilement

' libellés des champs affichés
alpha 1 : top 1,20 : left 1,10 : caption 1,"Mot à analyser:"
alpha 2 : top 2,80 : left 2,10 : caption 2,"Nombre de lettres:"

' bouton déclenchant l'analyse
button 30                  : ' bouton déclenchant l'analyse
top 30,50 : left 30,120    : ' position du coin en haut à gauche du bouton
caption 30,"Analyse"      : ' libellé du bouton
ON_CLICK 30,analyser_mot  : ' placé après la création de l'objet 30 pour informer Panoramic

end

' traitement des événements
analyser_mot:
mot_a_analyser$ = text$(10)      : ' récupérer le mot saisi
' et afficher le résultat dans l'objet 20
longueur% = len(mot_a_analyser$)
caption 20,"Ce mot a "+str$(longueur%)+" lettres."
return

Commençons par l'affichage des noms traités. Plusieurs solutions sont possibles; ici, nous utiliserons l'objet LIST pour cela:

Code:

' liste d'affichage des mots traités
list 40                    : ' zone d'affichage
top 40,10 : left 40,300    : ' position du coin en haut à gauche de la liste

Maintenant, nous allons placer les éléments pour effectuer le tri des mots traités. Nous pourrions mettre en place deux boutons indépendants, un pour le tri ascendant, l'autre pour le tri descendant. Ici, nous allons faire un autre choix: l'objet OPTION nous permettra de prédéterminer le mode de tri, et nous aurons alors un seul bouton de tri tenant compte de cette information:

Code:

' détermination de la direction du tri
option 50                  : ' option pour tri ascendant
top 50,10 : left 50,450    : ' placement à l'écran
caption 50,"Tri ascendant"
option 51                  : ' option pour tri ascendant
top 51,30 : left 51,450    : ' placement à l'écran
caption 51,"Tri descendant"

Aucun événement n'est nécessaire ici: le bouton de tri va simplement utiliser le contenu de ces objets OPTION pour déterminer le sens du tri. Or, par défaut, aucune option n'est cochée. Il faut donc s'assurer que l'objet 50 soit coché par défaut:

Code:

MARK_ON 50                : ' cocher l'option tri ascendant par défaut

Maintenant , il faut le bouton déclenchant le tri. Selon le modèle du bouton "Analyser", c'est maintenant simple:

Code:

' bouton déclenchant le tri
button 60                  : ' bouton déclenchant l'analyse
top 60,50 : left 60,450    : ' position du coin en haut à gauche du bouton
caption 60,"Tri"          : ' libellé du bouton
ON_CLICK 60,trier_liste    : ' placé après la création de l'objet 60 pour informer Panoramic

Nous constatons que la commande ON_CLICK 60,trier_liste déclare une routine événement qui va effectuer le travail. Il faut donc dès maintenant, insérer la définition du label et l'amorce de la routine événement:

Code:

label trier_liste          : ' déclencher le tri des mots traités
    ou
label analyser_mot, trier_liste          : ' routines événements


    et en fin de programme:

trier_liste:

return

Il manque encore un bouton pour effacer la liste. C'est maintenant simple:

Code:

' bouton effaçant la liste
button 70                  : ' bouton déclenchant l'analyse
top 70,80 : left 70,450    : ' position du coin en haut à gauche du bouton
caption 70,"Effacer"      : ' libellé du bouton
ON_CLICK 70,effacer_liste  : ' placé après la création de l'objet 70 pour informer Panoramic

sans oublier la commande LABEL et l'amorce de la routine effacer_liste:

Code:

label effacer_liste          : ' déclencher le tri des mots traités
    ou
label analyser_mot, trier_liste, effacer_liste          : ' routines événements


    et en fin de programme:

effacer_liste:

return

Il suffit maintenant d'ajouter le mot traité par le bouton "Analyser" dans la liste des mots traités. La commande ITEM_ADD accomplit cela:

Code:

item_add 40,mot_a_analyser$  : ' ajouter le mot traité à la liste

Ainsi, nous obtenons la situation suivante:

Code:

                  ' Tutoriel sur la structure pour un programme Windows

' tous les labels du programme
label analyser_mot        : ' déclarer la routine événement:
label trier_liste          : ' déclencher le tri des mots traités
label effacer_liste        : ' effacer la liste des mots traités

' toutes les variables du programme
dim longueur%, mot_a_analyser$

' toutes les initialisations

' champ de saisie
edit 10                    : ' champ de saisie
top 10,20 : left 10,120    : ' position du coin en haut à gauche du champ dans la fenêtre

' affichage du nombre de caractères
ALPHA 20                  : ' zone d'affichage
top 20,80 : left 20,120    : ' position du coin en haut à gauche de la zone d'affichage dans la fenêtre
font_size 20,12            : ' pour avoir une taille lisible facilement

' libellés des champs affichés
alpha 1 : top 1,20 : left 1,10 : caption 1,"Mot à analyser:"
alpha 2 : top 2,80 : left 2,10 : caption 2,"Nombre de lettres:"

' bouton déclenchant l'analyse
button 30                  : ' bouton déclenchant l'analyse
top 30,50 : left 30,120    : ' position du coin en haut à gauche du bouton
caption 30,"Analyse"      : ' libellé du bouton
ON_CLICK 30,analyser_mot  : ' placé après la création de l'objet 30 pour informer Panoramic

' liste d'affichage des mots traités
list 40                    : ' zone d'affichage
top 40,10 : left 40,300    : ' position du coin en haut à gauche de la liste

' détermination de la direction du tri
option 50                  : ' option pour tri ascendant
top 50,10 : left 50,450    : ' placement à l'écran
caption 50,"Tri ascendant"
option 51                  : ' option pour tri ascendant
top 51,30  : left 51,450  : ' placement à l'écran
caption 51,"Tri descendant"
MARK_ON 50                : ' cocher l'option tri ascendant par défaut

' bouton déclenchant le tri
button 60                  : ' bouton déclenchant l'analyse
top 60,50 : left 60,450    : ' position du coin en haut à gauche du bouton
caption 60,"Tri"          : ' libellé du bouton
ON_CLICK 60,trier_liste    : ' placé après la création de l'objet 60 pour informer Panoramic

' bouton effaçant la liste
button 70                  : ' bouton déclenchant l'analyse
top 70,80 : left 70,450    : ' position du coin en haut à gauche du bouton
caption 70,"Effacer"      : ' libellé du bouton
ON_CLICK 70,effacer_liste  : ' placé après la création de l'objet 70 pour informer Panoramic

end

' traitement des événements
analyser_mot:
mot_a_analyser$ = text$(10)  : ' récupérer le mot saisi
' et afficher le résultat dans l'objet 20
longueur% = len(mot_a_analyser$)
caption 20,"Ce mot a "+str$(longueur%)+" lettres."
return

trier_liste:

return

effacer_liste:

return

Ce programme est déjà exécutable et nous pouvons constater l'aspect visuel, mais il n'y a pas encore les traitements associés aux boutons, mais les mots traités apparaissent déjà dans la liste, dans l'ordre chronologique de leur saisie. Et la cerise sur le gateau, c'est l'apparition automatique de l'ascenseur lorsque la zone d'affichage de la liste est remplie.

Cependant, avant de s'attaquer à ces traitements, nous allons considérer un problème important qui se pose souvent dans un environnement où le programme ne peut pas déterminer dans quel ordre arrivent les événements. En effet, l'utilisateur pourrait saisir des mots et les traiter sans les trier, il pourrait aussi effacer la liste puis trier alors que la liste est vide, etc. Il faut donc considérer quel bouton pourra être utilisé dans quelle situation.

Pour cela, nous allons convenir de plusieurs règles d'exploitation du programme. Tout d'abord, nous allons effacer le champ de saisie dès qu'on a cliqué sur "Analyser". Pour cela, il suffit de placer une seule commande dans la routine analyser_mot:

Code:

text 10,""                : ' effacer le champ de saisie

Ensuite, nous allons décider que les boutons "Trier" et "Effacer" ne sont autorisés que si la liste contient au moins un mot et si le champ de saisie est vide. Il y a plusieurs moyens pour résoudre ce problème. Dans les routines "trier_liste" et "Effacer-liste", on pourrait tester ces conditions et effectuer la commande RETURN si les conditions ne sont pas remplies:

Code:

if count(40)=0 then return    : ' est-ce que la liste est vide ?
if text$(10)<>"" then return  : ' est-ce que le champ de saisi n'est pas vide ?

Mais nous avons souvent constaté que dans des programmes Windows, certains boutons sont quelque fois grisés et inactifs, suivant la situation. Nous allons provoquer cela dans notre programme. En Panoramic, les commandes ACTIVE et INACTIVE servent à cela, mais on pourrait aussi utiliser les commandes SHOW et HIDE pour afficher ou cacher les boutons suivant la situation.

Au démarrage, la liste est forcément vide. Les boutons "Trier" et "Effacer" doivent donc être inactifs au début. Cela se fait par les commandes suivantes dès la création des boutons:

Code:

inactive 60                : ' bouton inactif par défaut
    et
inactive 70                : ' bouton inactif par défaut

C'est très joli, mais comment ces boutons peuvent-ils devenir actifs lorsque la liste se remplit ? Par des commandes ACTIVE placés dans la routine "analyser_mot":

Code:

active 60                  : ' bouton actif
active 70                  : ' bouton actif

Et de la même manière, nous allons désactiver ces boutons lorque la liste est effacée, par des commandes INACTIVE placées dans la routine "effacer_liste":

Code:

inactive 60                : ' bouton inactif
inactive 70                : ' bouton inactif

Il ne reste plus qu'à bloquer ces boutons lorsqu'on est en cours de saisie d'un mot. Pour cela, nous allons utiliser un nouvel événement qui se déclenche dès qu'on effectue un changement quelconque dans un champ. C'est l'événement ON_CHANGE que nous allons déclarer pour le champ de saisie, comme l'événement on_click pour les boutons:

Code:

on_change 10,saisie_mot    : ' placé après la création de l'objet 30 pour informer Panoramic

et bien sûr la commande LABEL et l'amorce de la routine événement:

Code:

label saisie_mot          : ' saisie du mot en cours
    et en fin de programme
saisie_mot:

return

Et c'est dans cette routine que nous allons gérer dynamiquement l'activation des boutons:

Code:

' activation conditonnelle des boutons
if text$(10)=""
    active 60
    active 70
else
    inactive 60
    inactive 70
end_if

A ce niveau, nous avons toute la logique, sauf les traitements spécifiques de tri et d'effacement:

Code:

                  ' Tutoriel sur la structure pour un programme Windows

' tous les labels du programme
label analyser_mot        : ' déclarer la routine événement:
label trier_liste          : ' déclencher le tri des mots traités
label effacer_liste        : ' effacer la liste des mots traités
label saisie_mot          : ' saisie du mot en cours

' toutes les variables du programme
dim longueur%, mot_a_analyser$

' toutes les initialisations

' champ de saisie
edit 10                    : ' champ de saisie
top 10,20 : left 10,120    : ' position du coin en haut à gauche du champ dans la fenêtre
on_change 10,saisie_mot    : ' placé après la création de l'objet 30 pour informer Panoramic

' affichage du nombre de caractères
ALPHA 20                  : ' zone d'affichage
top 20,80 : left 20,120    : ' position du coin en haut à gauche de la zone d'affichage dans la fenêtre
font_size 20,12            : ' pour avoir une taille lisible facilement

' libellés des champs affichés
alpha 1 : top 1,20 : left 1,10 : caption 1,"Mot à analyser:"
alpha 2 : top 2,80 : left 2,10 : caption 2,"Nombre de lettres:"

' bouton déclenchant l'analyse
button 30                  : ' bouton déclenchant l'analyse
top 30,50 : left 30,120    : ' position du coin en haut à gauche du bouton
caption 30,"Analyse"      : ' libellé du bouton
ON_CLICK 30,analyser_mot  : ' placé après la création de l'objet 30 pour informer Panoramic

' liste d'affichage des mots traités
list 40                    : ' zone d'affichage
top 40,10 : left 40,300    : ' position du coin en haut à gauche de la liste

' détermination de la direction du tri
option 50                  : ' option pour tri ascendant
top 50,10 : left 50,450    : ' placement à l'écran
caption 50,"Tri ascendant"
option 51                  : ' option pour tri ascendant
top 51,30  : left 51,450  : ' placement à l'écran
caption 51,"Tri descendant"
MARK_ON 50                : ' cocher l'option tri ascendant par défaut

' bouton déclenchant le tri
button 60                  : ' bouton déclenchant l'analyse
top 60,50 : left 60,450    : ' position du coin en haut à gauche du bouton
caption 60,"Tri"          : ' libellé du bouton
ON_CLICK 60,trier_liste    : ' placé après la création de l'objet 60 pour informer Panoramic
inactive 60                : ' bouton inactif par défaut

' bouton effaçant la liste
button 70                  : ' bouton déclenchant l'analyse
top 70,80 : left 70,450    : ' position du coin en haut à gauche du bouton
caption 70,"Effacer"      : ' libellé du bouton
ON_CLICK 70,effacer_liste  : ' placé après la création de l'objet 70 pour informer Panoramic
inactive 70                : ' bouton inactif par défaut

end

' traitement des événements
analyser_mot:
mot_a_analyser$ = text$(10)  : ' récupérer le mot saisi
item_add 40,mot_a_analyser$  : ' ajouter le mot traité à la liste
' et afficher le résultat dans l'objet 20
longueur% = len(mot_a_analyser$)
caption 20,"Ce mot a "+str$(longueur%)+" lettres."
text 10,""                : ' effacer le champ de saisie
active 60                  : ' bouton actif
active 70                  : ' bouton actif
return

trier_liste:

return

effacer_liste:

inactive 60                : ' bouton inactif
inactive 70                : ' bouton inactif
return

saisie_mot:
' activation conditonnelle des boutons
if text$(10)=""
    active 60
    active 70
else
    inactive 60
    inactive 70
end_if
return

Réalisons d'abord le traitement le plus simple: l'effacement de la liste. Il faut une seule commande pour cela, que nous placerons dans la routine "effacer_liste": la commande CLEAN:

Code:

clear 40                  : ' effacer la liste

Passons maintenant au tri. La commande SORT permet de trier notre liste en ordre ascendant. Mais Panoramic de donne pas de moyen intégré pour le tri descendant. Il faut donc, selon se sens du tri prédéterminé, utiliser, soit la commande SORT, soit recourir à une petite astuce pour réaliser le tri descendant. Commençons par déterminer le sens du tri et réaliser déjà le tri ascendant. Ce code sera placé dans la routine "trier_liste":

Code:

if checked(50)=1          : ' tri ascendant choisi ?
    SORT 40                    : ' alors trier normalement
else                      : ' ici, tri descendant choisi !

end_if

Maintenant le problème du tri descendant. Pour cela, nous allons utiliser une liste invisible (objet DLIST). Nous allons copier notre liste dans cet objet, trier cet objet par la commande SORT, effacer notre liste et recopier l'objet DLIST dans notre liste, mais en commençant par la fin. Commençons par la définition de la DLIST. Une seule commande suffit:

Code:

' liste invisible pour le tri descendant
dlist 80                  : ' liste invisible

Copier notre liste dans la DLIST, en ajoutant bien sûr i% dans la commande DIM:

Code:

clear 80                  : ' effacer la DLIST par précaution
for i%=1 to count(40)      : ' boucler sur le contenu de la liste
    item_add 80,item_read$(40,i%)    : ' et copier chaque élément
next i%

Maintenant, on va trier la DLIST:

Code:

sort 80

Et finalement, recopier la DLIST dans notre liste, mais à l'envers:

Code:

clear 40                  : ' effacer notre liste
for i%=count(80) to 1 step -1      : ' boucler sur le contenu de la DLIST
    item_add 40,item_read$(80,i%)    : ' et copier chaque élément
next i%

Il restent deux détails à ajuster. D'une part, après avoir analysé un mot, il serait souhaitable que le curseur revienne automatiquement dans le champ de saisie, sans avoir besoin d'y cliquer. Pour cela, nous allons utiliser la commande SET_FOCUS, à la fin de la routine "analyser_mot":

Code:

set_focus 10              : ' placer le curseur dans le champ de saisie

Et finalement, il serait utile de ne pas mettre un mot vide (pas de lettres) dans la liste des mots traités. Pour cela, nous allons conditionner la commande ITEM_ADD ainsi que les commandes ACTIVE de la routine "analyser_mot":

Code:

if mot_a_analyser$<>""
    item_add 40,mot_a_analyser$  : ' ajouter le mot traité à la liste
    active 60                  : ' bouton actif
    active 70                  : ' bouton actif
end_if

Voilà, c'est complet ! Le programme résultant est le suivant:

Code:

                  ' Tutoriel sur la structure pour un programme Windows

' tous les labels du programme
label analyser_mot        : ' déclarer la routine événement:
label trier_liste          : ' déclencher le tri des mots traités
label effacer_liste        : ' effacer la liste des mots traités
label saisie_mot          : ' saisie du mot en cours

' toutes les variables du programme
dim longueur%, mot_a_analyser$, i%

' toutes les initialisations

' champ de saisie
edit 10                    : ' champ de saisie
top 10,20 : left 10,120    : ' position du coin en haut à gauche du champ dans la fenêtre
on_change 10,saisie_mot    : ' placé après la création de l'objet 30 pour informer Panoramic

' affichage du nombre de caractères
ALPHA 20                  : ' zone d'affichage
top 20,80 : left 20,120    : ' position du coin en haut à gauche de la zone d'affichage dans la fenêtre
font_size 20,12            : ' pour avoir une taille lisible facilement

' libellés des champs affichés
alpha 1 : top 1,20 : left 1,10 : caption 1,"Mot à analyser:"
alpha 2 : top 2,80 : left 2,10 : caption 2,"Nombre de lettres:"

' bouton déclenchant l'analyse
button 30                  : ' bouton déclenchant l'analyse
top 30,50 : left 30,120    : ' position du coin en haut à gauche du bouton
caption 30,"Analyse"      : ' libellé du bouton
ON_CLICK 30,analyser_mot  : ' placé après la création de l'objet 30 pour informer Panoramic

' liste d'affichage des mots traités
list 40                    : ' zone d'affichage
top 40,10 : left 40,300    : ' position du coin en haut à gauche de la liste

' détermination de la direction du tri
option 50                  : ' option pour tri ascendant
top 50,10 : left 50,450    : ' placement à l'écran
caption 50,"Tri ascendant"
option 51                  : ' option pour tri ascendant
top 51,30  : left 51,450  : ' placement à l'écran
caption 51,"Tri descendant"
MARK_ON 50                : ' cocher l'option tri ascendant par défaut

' bouton déclenchant le tri
button 60                  : ' bouton déclenchant l'analyse
top 60,50 : left 60,450    : ' position du coin en haut à gauche du bouton
caption 60,"Tri"          : ' libellé du bouton
ON_CLICK 60,trier_liste    : ' placé après la création de l'objet 60 pour informer Panoramic
inactive 60                : ' bouton inactif par défaut

' bouton effaçant la liste
button 70                  : ' bouton déclenchant l'analyse
top 70,80 : left 70,450    : ' position du coin en haut à gauche du bouton
caption 70,"Effacer"      : ' libellé du bouton
ON_CLICK 70,effacer_liste  : ' placé après la création de l'objet 70 pour informer Panoramic
inactive 70                : ' bouton inactif par défaut

' liste invisible pour le tri descendant
dlist 80                  : ' liste invisible

end

' traitement des événements
analyser_mot:
mot_a_analyser$ = text$(10)  : ' récupérer le mot saisi
' et afficher le résultat dans l'objet 20
longueur% = len(mot_a_analyser$)
caption 20,"Ce mot a "+str$(longueur%)+" lettres."
text 10,""                : ' effacer le champ de saisie
if mot_a_analyser$<>""
    item_add 40,mot_a_analyser$  : ' ajouter le mot traité à la liste
    active 60                  : ' bouton actif
    active 70                  : ' bouton actif
end_if
set_focus 10              : ' placer le curseur dans le champ de saisie
return

trier_liste:
if checked(50)=1          : ' tri ascendant choisi ?
    SORT 40                    : ' alors trier normalement
else                      : ' ici, tri descendant choisi !
    clear 80                  : ' effacer la DLIST par précaution
    for i%=1 to count(40)      : ' boucler sur le contenu de la liste
        item_add 80,item_read$(40,i%)    : ' et copier chaque élément
    next i%
    sort 80
    clear 40                  : ' effacer notre liste
    for i%=count(80) to 1 step -1      : ' boucler sur le contenu de la DLIST
        item_add 40,item_read$(80,i%)    : ' et copier chaque élément
    next i%
end_if
return

effacer_liste:
clear 40                  : ' effacer la liste
inactive 60                : ' bouton inactif
inactive 70                : ' bouton inactif
return

saisie_mot:
' activation conditonnelle des boutons
if text$(10)=""
    active 60
    active 70
else
    inactive 60
    inactive 70
end_if
return

Récapitulons les éléments importants de ce tutoriel:
- gestion d'événements sur plusieurs objets
- gestion de plusieurs types d'événements
- gestion de dépendances des actions par rapport à une situation donnée
- utilisation de listes et de l'objet DLIST pour réaliser des tris ascendants et descendants

Dans le tutoriel suivant, nous allons reprendre ce programme pour l'étendre, ajouter d'autres événements, améliorer l'aspect visuel, ajouter un menu système.