Construire un projet
From OFSET Wiki
Contents |
[edit] Mobilité des objets - scripts conditionnels
Dans ce chapitre, nous allons nous occuper uniquement de déplacer des objets sur l'écran en utilisant une forme de programmation appelée programmation par Scripts, et répertorier quelques méthodes permettant de modifier leur déplacement quand ils rencontreront un obstacle.
La programmation par Script se fait en prenant et combinant, avec la souris, de petites briques prêtes à l'emploi que l'on trouve dans des répertoires spécialisés, ce qui ne nécessite pas l'intervention de l'écriture, et que l'on agence entr'elles à la façon d'un jeu de construction.
Les objets que nous allons faire bouger ont été, soit pris dans le tiroir des accessoires où ils sont proposés prêts à être utilisés, soit fabriqués sur l'espace Dessin.
Pour les programmer, il va falloir accéder aux différentes commandes qui les régissent et que nous proposent les visualiseurs de commandes des objets. Grâce à elles nous construirons des scripts de déplacement.
[edit] Le halo d'un objet
Chaque objet a un halo qui apparaît dès que l'on clique sur l'objet avec la souris en tenant la touche 'ALT' enfoncée.
[edit] Le visualiseur de commandes
En appuyant sur l'oeil bleu du Halo, on voit apparaître un tableau, le visualiseur de commandes, qui propose une suite de commandes classées par CATEGORIES.
Chaque catégorie contient des commandes spécialisées qui vont répondre aux multiples besoins de la programmation. Nous allons utiliser celles qui concernent le déplacement et le positionnement des objets et qui se trouvent dans la catégorie BASE.
[edit] Script de déplacement
Une commande se présente, dans le visualiseur, sous la forme d'une ligne groupant des blocs rattachés les uns aux autres et précédée d'un point d'exclamation, ou comme une suite en 2 parties dont l'une est fléchée.
1 - la commande en ligne continue se transforme instantanément en SCRIPT lorsqu'elle est tirée sur l'écran .
Dans le script ainsi créé la commande AVANCE de…, va provoquer le déplacement de l'objet d'un certain nombre de pixels vers le haut (avance de 20) ou vers le bas (avance de –20).
On modifie le nombre d'unités de la commande en utilisant la flèche verte verticale placée avant le chiffre.
- Activé, le script RECTANGLE BOUGE déclenche le déplacement du rectangle de 20 pixel en une seule fois, si c'est le point d'exclamation qui déclenche l'action.
- Il se déplacera pareillement mais de façon continue dans la même direction si c'est l'horloge ronde qui le met en route.
- la flèche de direction d'un objet détermine la direction qu'il prend. Elle est placée au centre géométrique de celui-ci et est normalement orientée vers le haut.
Elle peut être réorientée si on la déplace en la tenant par sa pointe triangulaire avec la souris.Ce qui implique que, à ce moment là, le trajet du rectangle se fera dans une autre de direction.
- pour rendre la flèche de direction visible, il faut faire apparaître le halo de l'objet, cliquer sur son MENU ROUGE, et cocher l'option 'FLECHE DE DIRECTION.
2 – la partie placée à droite d'une commande fractionnée, prise à partir de la flèche se transforme également en script quand elle est déposée sur l'écran.
Elle peut aussi être introduite, sous forme de nouvelle commande dans un script déjà constitué et contenant d'autres commandes, afin d'enrichir l'action du script.
Elle peut concerner la structure personnelle de l'objet (forme, couleur, taille etc.), sa situation dans l'espace (x,et y, cap…), les traces qu'il peut laisser sur l'écran…, tout un arsenal de précisions nécessaires au bon déroulement d'un projet et qui sont proposées dans les différentes catégories du visualiseur.
Le script activé exécute l'ensemble des ordres donnés.
Pour faciliter la compréhension de la programmation, il est utile de donner aux scripts, un nom décrivant ce qu'ils font. Appuyer sur le nom du script (ici sur Rectangle ) fait apparaître un menu.Il offre les moyens de nommer les scripts.
[edit] Les briques
La partie gauche des lignes de commande en 2 parties du visualiseur est appelée 'brique'. Elle contient elle-même 2 éléments :
- celui qui donne le nom de l'objet concerné
- celui qui désigne un de ses attributs ici | ellipse | et x | ce qui désigne la position en x de l'ellipse.
Prise à partir du nom de l'objet (le mot ellipse), cette entité double peut être déplacée.
- Posée telle quelle sur l'écran, elle devient une étiquette bleue portant le nom de l'objet accompagné d'une information concernant son attribut.
Rectangle | couleur... Rectangle | x = 132 Rectangle | cap = 0 Rectangle | crayon baissé vrai, etc.
- Transportée à l'intérieur d'un script et incrustée sur une commande dont l'emplacement adéquat se colore en vert plus sombre pour signifier une acceptation elle modifie les termes de la commande :
Ici, la position x du rectangle va devoir s'aligner sur la position x de l'ellipse.
Armés de ces rudiments de base concernant la construction des scripts, nous allons nous lancer dans la fabrication d'un PROJET qui va regrouper un ensemble de scripts régissant le comportement des objets qu'il contient.
Nous aurons besoin d'autres procédés de programmation, mais nous les décrirons au fur et à mesure que nous les utiliserons.
[edit] Projet Sarabande
ou autopsie de la programmation d'un projet
Ce projet déplace, de plusieurs façons, des pantins qui évoluent avec des bulles transparentes dans un ciel nocturne.
Certains cercles sont immobiles.
D'autres objets (pantins ou cercles) tournent en rond sans être confrontés à un obstacle.
D'autres se déplacent en ligne droite et se heurtent à un obstacle qui modifie leur parcours.
Nous allons programmer ces déplacements et proposer des réactions à cette confrontation avec un autre objet.
[edit] Placer les objets en situation de fonctionnement
Nous allons placer ces objets sur une SCENE, que nous trouverons dans le tiroir des accessoires. Cette scène est une réduction de l'écran Monde dont elle présente les différentes caractéristiques.
Ici, elle fait obstacle à la sortie des objets en dehors de ses limites (sa fonction 'barrière' que l'on trouve dans le menu rouge de la scène, est cochée, donc active).
Quand plusieurs objets sont en lice, ils ont chacun leur visualiseur de commandes et pourront donc avoir leurs propres scripts de déplacement.
Pour les démarrer ou les stopper tous en même temps, il va être nécessaire d'avoir un tableau de commandes qui gère l'ensemble des scripts.
Le tiroir des accessoires fournit une réglette à 3 boutons GO/STEP/STOP qui contrôle tous les scripts du projet quand ils ont été mis en PAUSE.
- En ouvrant la réglette avec le bouton bleu, sur la droite, on peut vérifier l'état des scripts gérés par la réglette.
- pour mettre en pause un script, voir le menu qui s'ouvre quand on appuie sur la case NORMAL de l'en-tête d'un script, à côté de l'horloge)
Nous allons maintenant placer les objets sur la scène (ballons et pantins) :
Deux rectangles amincis placés sur le bord latéral droit et la partie supérieure de la scène servent de butoirs (rectangle 1 rectangle2).
L'ensemble est REORGANISABLE à l'intérieur de la scène selon la volonté d'un éventuel utilisateur , par simple déplacement des objets avec la souris.
[edit] Programmer les objets et démarrer le projet
Les Scripts qui programment le déplacement des objets déterminent soit :
- des trajectoires circulaires simples.
- des changements dans la trajectoire de l'un d'eux quand il rencontre un certain objet.
- une de ces rencontre peut provoquer l'interruption de l'animation.
Il y a autant de scripts que d'actions à réaliser. Pour démarrer le projet il suffira d'appuyer sur le bouton GO
[edit] Le couple Marche/Arret
On place le pantin orange et bleu dans le bas de la scène et sous l'étoile qui, elle, est posée dans le haut et reste immobile.
Lorsque le pantin, qui se déplace en ligne droite, entre en contact avec cette dernière, l'ensemble de l'animation s'arrête.
Il faut créer 2 scripts pour le pantin pour arriver à ce résultat:
- le premier, PANTIN BOUGE, déplace le pantin à la verticale puisque sa flèche de direction n'a pas été réorientée .
- le second , PANTIN ARRIVEE, décrit les conditions qui amènent l'interruption de la totalité de l'animation, c'est donc un script conditionnel.
[edit] Le script conditionnel
Prendre la commande 'pantin script vide' dans la catégorie 'SCRIPTS' du visualiseur du pantin et la déposer sur l 'écran, nous avons un nouveau script mais entièrement vide.
Si l'on y dépose, avec la souris, le petit rectangle jaune placé en haut et à droite du script , il se transforme en une large plage prête à accueillir de nouvelles commande, c'est la STRUCTURE DE TEST.
- La première ligne, (TEST), attend la commande qui posera la condition d'un changement de comportement de l'objet.
- La seconde, (yes), décrit ce qui va se passer dans le cas où la condition se réalise
- La troisième, (no), ce qui peut advenir de DIFFERENT si la condition n'est pas réalisée.
Dans le script ci-dessus, cela pourrait se formuler de la façon suivante :
Si l'objet A (pantin) rencontre l'objet B (rond1)...
alors il se passera
ceci (yes)...
ou bien cela si la condition n'est pas réalisée (no).
La commande 'PANTIN INTERSECTION avec ROND1 n'existe pas libellée de cette façon, il va falloir la construire.
Dans le Visualiseur de commandes du pantin, nous allons ouvrir la catégorie TESTS
Cette catégorie contient un ensemble de propositions qui décrivent des situations dans lesquelles peut se trouver l'objet et qui pourraient provoquer des changements de son comportement. Nous choisirons :
PANTIN INTERSECTION AVEC PANTIN
et nous la déposerons à côté du mot TEST.
La commande présentant l'objet comme étant en intersection avec lui-même, il va falloir transformer la formule et dire avec quoi l'objet est en intersection, donc remplacer la deuxième entité 'Pantin' par le nom de l'objet qui doit entrer en contact avec lui.
Dans le cas qui nous occupe, c'est le cercle étoilé (rond1)
Nous ferons apparaître le halo de rond1 et nous extrairons, avec la souris, le petit rectangle d'identification situé juste en dessous de l'œil bleu et qui va porter le nom de cet objet. Nous le placerons au-dessus du 2eme nom de la commande 'Pantin Intersection avec Pantin' pour l'intégrer à la commande.
La situation circonstancielle étant décrite, il va falloir dire, en face de YES, ce qui va se passer :
Les possibilités sont très nombreuses et dépendent des objectifs du projet :
On peut partir dans une autre direction, revenir en arrière, changer de couleur, disparaître, changer d'aspect, émettre un son, etc …
Dans le cas qui nous occupe, il faut arrêter l'animation.
Or, cette animation globale est sous la dépendance de la réglette STOP/STEP/GO, et plus particulièrement du bouton STOP en ce qui concerne l'arrêt. Mais la réglette, ainsi que chacun de ses boutons, est aussi, dans le monde de Squeak, un objet ayant Halo et visualiseur de commandes .
Il va falloir isoler le bouton Stop en faisant apparaître successivement le halo de la réglette, puis les autres halos des objets du même bloc, jusqu'à l'obtention de celui de l'objet STOP.
Dans le visualiseur de commandes de celui-ci, nous chercherons celle qui va interrompre l'action et nous la trouverons dans la catégorie DIVERS :
C'est STOP BOUTON CLIQUE( cette commande activera le bouton STOP quand le pantin entrera en contact avec l'étoile)
Il ne nous reste plus qu'à intégrer cette commande dans le script en face de YES, et de mettre les 2 scripts (.AVANCE et ARRIVEE) en PAUSE pour que l'ensemble soit opérationnel quand on lancera l'action avec le bouton GO.
Les 2 objets peuvent être changés de place, mais pour continuer à assurer la fonction marche/arrêt de ce couple, il faudra réorienter le déplacement du pantin avec la flèche verte de son centre de direction en l' étirant avec la souris jusque sur sa cible.
Plusieurs objets de ce projet vont fonctionner sur ce schéma, mais , en face de YES, il sera proposé autre chose, n'interrompant pas l'animation mais changeant la nature du déplacement et que l'on pourra découvrir en explorant les différentes catégories du visualiseur de commandes
[edit] Le pantin vert
Celui-ci fonctionne avec 3 scripts, car à la différence des autres on ne peut le placer n'importe où.
Il a été décidé que son point de départ serait un endroit précis, sur la gauche de la scène , et identifié par ses coordonnées X et Y ( x 56 y 175 ).
Il a donc un premier script de positionnement PANTIN DEPART
Il se déplace à l'horizontale grâce au changement de cap de sa flèche de direction orientée à droite, (PANTIN BOUGE).
Son obstacle est le rectangle vertical de droite (rectangle2)et la rencontre des deux renvoie le mannequin à sa position de départ (pantin x, y).
L'action à mettre en face de YES se trouve donc dans la catégorie 'BASE' ou bien dans celle appelée 'GEOMETRIE'.
[edit] Le pantin dans le cercle bleu
La construction de ses 2 scripts ressemble à celles décrites pour le couple marche/arrêt, avec des nuances.
Le pantin est posé à l'intérieur d'une surface circulaire bleue transparente dont il est rendu solidaire par le procédé suivant :
En faisant apparaître le halo du pantin après l'avoir posé sur le cercle bleu, on sélectionne son MENU ROUGE et on l'ouvre. Parmi les nombreuses propositions qui apparaissent, on choisit la fonction inclu dans qui donne le choix de le rendre solidaire d'un des supports qui sont placés en dessous de lui (le fond MONDE, divers cercles). On sélectionne ROND2 qui est le cercle bleu qui lui est directement sous-jacent.
L'ensemble constitue, après cela, une unité indissociable ROND2 qui comprend un cercle et un pantin et se déplace à la verticale à une vitesse aléatoire HASARD (random).
La fonction HASARD fait se déplacer un objet au hasard entre l'unité 1 et un autre chiffre que l'on choisit, ici, HASARD 40.
La fonction 'HASARD se trouve dans le tiroir des accessoires où elle se présente comme une brique chiffrée à deux volets. Il suffit de la prendre avec la souris et de la déposer sur l'extrémité de la commande Avance, comme une brique ordinaire.
Ici elle est va faire avancer le pantin d'une dimension aléatoire entre 1 et 40 pixel à la fois.
ROND2 étant stoppé dans son avancée par le rectangle supérieur (rectangle1), dans le script conditionnel, la conséquence de la rencontre est de le renvoyer loin en arrière (-400) Ce pantin peut être placé n'importe où sur la surface du terrain de jeu.
Les formes restantes CERCLES ou PANTINS ont des constructions similaires à celles déjà détaillées.
Elles se déplacent à des vitesses plus ou moins grandes et peuvent tourner sur elles-mêmes.
[edit] Remarques
- Les cercles translucides (issus du tiroir des accessoires) qui se déplacent doivent le faire à la verticale s'ils veulent garder leur transparence. Orientés dans une autre direction avec la commande 'TOURNE DE.... qui les fait pivoter sur leur axe, ils noircissent. Cependant, si l'on déplace uniquement leur flèche de direction centrale, cela ne change pas leur orientation générale, seulement la direction de leur déplacement et ils gardent leur transparence.
- Changés de place, les différents objets construisent des ensembles de formes et de couleurs très divers et que l'on peut sans cesse restructurer en tenant compte des effets de couleurs ou de la qualité esthétique du regroupement.
- En plus de la diversité des positionnements bi-dimensionnels sur la surface du terrain de jeu, il est également possible d'introduire un effet tridimensionnel en plaçant les objets les uns par-dessus les autre, ce qui donne l'impression qu'ils sont les uns en avant ou en arrière des autres. Il est nécessaire, pour cela de manipuler en premier ceux qui seront destinés à donner l'illusion de l'arrière plan et de finir par celui que l'on désire placer au premier plan. Les déplacements programmés se feront dans les plans prévus
Le projet, à télécharger et étudier :
[edit] La sauvegarde
Notre projet terminé, on peut désirer le conserver ou le mettre en état d'être communiqué à quelqu'un d'autre.
En sélectionnant le NAVIGATEUR en bas de l'écran Squeak, on fait apparaître un certain nombre d'options.
En laissant appuyée la touche PUBLIER, on obtient les différentes façons de sauvegarder le projet.
En sélectionnant, de la même façon la touche CHERCHER, nous aurons la possibilité de le récupérer sur l'écran.
