Scheme

NOTIONS SUR LES INTERFACES GRAPHIQUES (GUI)

INTERFACES : FENÊTRES, BOUTONS

DANS LES SYSTÈMES ACTUELS (LINUX, MAC, WINDOWS), L'UTILISATEUR COMMUNIQUE AVEC L'ORDINATEUR PAR DES "OBJETS GRAPHIQUES" (FENÊTRES)

EXEMPLE :
FICHIER / NOUVEAU DOSSIER

=> CRÉE UN OBJET DE TYPE "DOSSIER" :

L'ICÔNE APPARAÎT À L'ÉCRAN,
ON L'OUVRE EN CLIQUANT DESSUS,
ON PEUT CHANGER LE TITRE, ETC.

COMME TOUS LES LANGAGES, DRSCHEME
PERMET DE DÉFINIR L'INTERFACE
UTILISATEUR <--> PROGAMME
SOUS FORME D'OBJETS GRAPHIQUES (FENÊTRES, BOUTONS)
--> GUI = "GRAPHICAL USER INTERFACE"

==> CLASSES PRÉDÉFINIES D'OBJETS (FENÊTRE, TEXTE, BOUTON) PARMI LESQUELLES ON CHOISIT LES COMPOSANTS DE L'INTERFACE

CLASSES ET OBJETS

"CLASSE" = MÉCANISME GÉNÉRAL POUR
PRODUIRE DES OBJETS SUR UN MODÈLE DONNÉ
(SORTE DE "MOULE À GATEAUX"...)

"INSTANCIATION"
= CRÉATION D'UN OBJET SUR LE MODÈLE D'UNE CLASSE
==> CET OBJET EST AUTOMATIQUEMENT
DOTÉ DES OUTILS, FONCTIONS, ... DE CETTE CLASSE

EXEMPLE : CLASSE "BOUTON"
--> CHAQUE FOIS QU'ON INSTANCIE UN OBJET "BOUTON", IL A AUTOMATIQUEMENT :

AFFICHAGE À L'ÉCRAN (FORME DE BOUTON)
POSSIBILITÉ DE RÉAGIR À LA SOURIS
ETC.

. . . SANS QUE LE PROGRAMMEUR S'EN OCCUPE !!!

LES FONCTIONS PROPRES À UNE CLASSE SONT APPELÉES DES "MÉTHODES"

LES PRIMITIVES MAKE-OBJECT ET SEND

(MAKE-OBJECT <CLASSE> <VAL1> <VAL2> ...)
--> INSTANCIE UN OBJET D'UNE CLASSE
EN DONNANT DES VALEURS AUX PARAMÈTRES D'INITIALISATION

(SEND <OBJET> <METHODE> <VAL1> <VAL2> . . .)
--> APPLIQUE UNE MÉTHODE DE LA CLASSE
D'UN OBJET EN DONNANT DES VALEURS AUX ARGUMENTS

GESTION DES ÉVÉNEMENTS

CLIQUER, OU ENFONCER UNE TOUCHE,
QUAND UN COMPOSANT DE L'INTERFACE EST SÉLECTIONNÉ,
CELA ENGENDRE UN "ÉVÉNEMENT"

À LA RECEPTION DE CET ÉVÉNEMENT,
CERTAINS COMPOSANTS DÉCLENCHENT UNE "ACTION"
==> . . . C'EST-À-DIRE L'ÉVALUATION D'UNE FONCTION !

RÈGLE D'ÉVALUATION POUR UNE ACTION

"ACTION" = FONCTION À DEUX ARGUMENTS :

UN OBJET (FENÊTRE, BOUTON, ETC.)
UN ÉVÉNEMENT (SOURIS, CLAVIER, ETC.)

L'ÉVALUATION DÉCLENCHÉE PAR L'ÉVÉNEMENT,
CRÉE UNE LIAISON DES ARGUMENTS :

OBJET = OBJET RECEVANT L'ÉVÉNEMENT
ÉVÉNEMENT = ÉVÉNEMENT DÉCLENCHEUR

ATTENTION : UNE ACTION A OBLIGATOIREMENT DEUX ARGUMENTS (OBJET, ÉVÉNEMENT)
... MÊME SI ON NE S'EN SERT PAS!

CLASSES GRAPHIQUES PRÉDÉFINIES

PRINCIPALES CLASSES DE DRSCHEME,
AVEC LEURS PARAMÈTRES D'INITIALISATION,
ET QUELQUES MÉTHODES ASSOCIÉES

FENÊTRE : FRAME%
(DEFINE W (MAKE-OBJECT FRAME% "Toto"))
--> CRÉE UNE FENÊTRE

UN SEUL PARAMÈTRE D'INITIALISATION : TITRE "Toto"

(SEND W SHOW #T)
--> AFFICHE LA FENÊTRE

BOUTON : BUTTON%
(DEFINE B
(MAKE-OBJECT BUTTON% "Cliquez!" W ACTION))
--> CRÉE UN BOUTON

AVEC UN TITRE "Cliquez!"
PLACÉE DANS LA FENÊTRE W
AVEC UNE ACTION

(SEND B GET-LABEL)
--> DONNE LE TITRE

TEXTE : TEXT-FIELD%

(DEFINE T
(MAKE-OBJECT TEXT-FIELD% "Texte:" W ACTION))
--> CRÉE UNE FENÊTRE DE TEXTE

AVEC UN TITRE "Texte:"
PLACÉE DANS LA FENÊTRE W
AVEC UNE ACTION

(SEND T GET-LABEL)
--> DONNE LE TITRE
(SEND T SET-VALUE "nouveau texte")
--> MODIFIE LE TEXTE
(SEND T GET-VALUE)
--> DONNE LE TEXTE
(SEND T FOCUS)
--> PLACE LE CURSEUR DANS LA FENÊTRE

ÉVÉNEMENT : CONTROL-EVENT%

(SEND E GET-EVENT-TYPE)
--> DONNE LE TYPE DE L'ÉVÉNEMENT

EXEMPLE 1 :
AFFICHE L'OBJET ET L'ÉVÉNEMENT ARGUMENTS D'UNE ACTION


(DEFINE FRAME (MAKE-OBJECT FRAME% "Exemple 1"))


(SEND FRAME SHOW #T) 


(DEFINE (ACTION O E)

  (DISPLAY (SEND O GET-LABEL)) (DISPLAY " ") 

  (DISPLAY (SEND E GET-EVENT-TYPE)) (DISPLAY " / "))


(MAKE-OBJECT BUTTON% "Toto" FRAME ACTION)

(MAKE-OBJECT TEXT-FIELD% "Titi" FRAME ACTION)

Exemples : programmes gui1.drs et gui2.drs

EXEMPLE 2 :
DÉTECTE LA TOUCHE "RETURN" DANS UNE FENÊTRE TEXTE



(DEFINE FRAME (MAKE-OBJECT FRAME% "Exemple 2"))


(SEND FRAME SHOW #T) 


(DEFINE (ACTION O E)

  (COND ((EQ? (SEND E GET-EVENT-TYPE) 'TEXT-FIELD-ENTER)

         (DISPLAY "STOP: ") (DISPLAY (SEND O GET-VALUE)) 

         (SEND O SET-VALUE ""))

        (ELSE (DISPLAY " LETTRE "))))


(MAKE-OBJECT TEXT-FIELD% "Toto" FRAME ACTION)

REMARQUE :
VOID --> ACTION "NE RIEN FAIRE"

(GET-TEXT-FROM-USER "Saisie" "Écris ton texte:")
--> OUVRE UNE FENÊTRE DE SAISIE
--> RENVOIE UNE CHAÎNE DE CARACTÈRES (TEXTE DE L'UTILISATEUR)

Documentation MrEd Graphical Toolbox Manual : http://www.cs.rice.edu/CS/PLT/packages/doc/mred/index.htm

APPLICATION : JEU DU MOT MYSTÉRIEUX

CHERCHER UN MOT DE 5 LETTRES EN 3 ESSAIS,
À CHAQUE ESSAI, LES LETTRES CORRECTES S'AFFICHENT

Exemples : programme mot.drs

L = LISTE DE MOTS ("CARTE" "CORDE" "TARTE" . . .)
--> MOT CACHÉ TIRÉ AU HASARD


(DEFINE (NTH N L) 

   (IF (= N 0) (CAR L) (NTH (- N 1) (CDR L))))


(DEFINE MOT-CACHE  (NTH (RANDOM (LENGTH L)) L))

COMPARAISON DES MOTS :
-> FONCTIONS DE CHAÎNES DE CARACTÈRES
STRING->LIST, LIST->STRING, STRING-APPEND




(DEFINE (DEVOILE LETTRE-CACHEE LETTRE) 

  (IF (EQ? LETTRE-CACHEE LETTRE) LETTRE #\*))



(DEFINE (COMPARE X1 X2)

  (LET ((L1 (STRING->LIST X1)) (L2 (STRING->LIST X2)))

    (LIST->STRING (LIST (DEVOILE (NTH 0 L1) (NTH 0 L2))

                        (DEVOILE (NTH 1 L1) (NTH 1 L2))

                        (DEVOILE (NTH 2 L1) (NTH 2 L2))

                        (DEVOILE (NTH 3 L1) (NTH 3 L2))

                        (DEVOILE (NTH 4 L1) (NTH 4 L2))))))

ACTION EFFECTUÉE À CHAQUE SAISIE :
(T ET TSUIVANT SONT DES OBJETS TEXT-FIELD%)



(DEFINE (SAISIE T TSUIVANT) 

  (LET* ((Z1 (SEND T GET-VALUE))

         (RES (COMPARE MOT-CACHE Z1)))

    (SEND M SET-VALUE RES)

    (FIN MOT-CACHE Z1 T TSUIVANT)))

INTERFACE :


(DEFINE W (MAKE-OBJECT FRAME% "le mot mysterieux")) 

(DEFINE M (MAKE-OBJECT TEXT-FIELD% "mot caché" W VOID))

(DEFINE T1 (MAKE-OBJECT TEXT-FIELD% " 1er essai:" W VOID)) 

(DEFINE (ACTION1 OB EV) (SAISIE T1 T2)) 

(DEFINE B1 (MAKE-OBJECT BUTTON% "OK" W ACTION1))

+ IDEM POUR LES 2 AUTRES ESSAIS :


T2, ACTION2, B2 

T3, ACTION3, B3

INITIALISATION DE L'INTERFACE :



(SEND W SHOW #T) 

(SEND M SET-VALUE "*****")

(SEND T1 FOCUS)

TEST DE FIN DE PARTIE :



(DEFINE (FIN MOT-CACHE Z1 T TSUIVANT)

  (COND ((EQUAL? MOT-CACHE Z1) 

         (SEND M SET-VALUE 

              (STRING-APPEND MOT-CACHE "         GAGNE!")))

        ((EQUAL? T T3) 

         (SEND M SET-VALUE 

              (STRING-APPEND MOT-CACHE "        PERDU!")))

        (ELSE (SEND TSUIVANT FOCUS))))

GÉOMÉTRIE DES OBJETS DE L'INTERFACE

PAR DÉFAUT, LES OBJETS D'UNE FENÊTRE,
SONT PLACÉS VERTICALEMENT,
LES UNS EN DESSOUS DES AUTRES

--> POUR UNE DISPOSITION DIFFÉRENTE,
ON LES PLACE DANS DES "PANNEAUX"
VERTICAUX ET HORIZONTAUX
EMBOÎTÉS LES UNS DANS LES AUTRES
==> EN LES COMBINANT, TOUTES LES DISPOSITIONS SONT POSSIBLES

PANNEAU

PANNEAU

VERTICAL

HORIZONTAL

PANNEAU HORIZONTAL : HORIZONTAL-PANEL%
(DEFINE H (MAKE-OBJECT HORIZONTAL-PANEL% O))
--> CRÉE UN PANNEAU HORIZONTAL DANS O

UN SEUL PARAMÈTRE D'INITIALISATION : O = W, H, V (FENÊTRE, PANNEAU HORIZONTAL OU VERTICAL)

PANNEAU VERTICAL : VERTICAL-PANEL%
(DEFINE V (MAKE-OBJECT VERTICAL-PANEL% O))
--> CRÉE UN PANNEAU VERTICAL DANS O

UN SEUL PARAMÈTRE D'INITIALISATION : O = W, H, V (FENÊTRE, PANNEAU HORIZONTAL OU VERTICAL)

Scheme

NOTIONS SUR LES INTERFACES GRAPHIQUES (GUI)

INTERFACES : FENÊTRES, BOUTONS

CLASSES ET OBJETS

LES PRIMITIVES MAKE-OBJECT ET SEND

GESTION DES ÉVÉNEMENTS

CLASSES GRAPHIQUES PRÉDÉFINIES

APPLICATION : JEU DU MOT MYSTÉRIEUX

GÉOMÉTRIE DES OBJETS DE L'INTERFACE