Algoid - Tutoriel 1.2

Avant de lire ce tutoriel, il est important d'avoir lu  :  1.1 - Qu'est-ce qu'un programme  ?

Qu'est-ce qu'une bibliothèque ?
Tous les langages de programmation sont divisés en deux parties principales :

• les primitives, qui seront expliquées dans les prochains tutoriels ;
• les bibliothèques.

Les bibliothèques sont un ensemble d'outils utilisés pour exécuter des travaux plus complexes.
Dans le cas d'AL, tous ces outils sont contenus dans des fonctions qui sont elles-mêmes contenues dans des objets.
AL possède plusieurs objets comme Math (pour exécuter des calculs arithmétiques), Util, UI… et Algo.
L'objet Algo contient tout ce dont nous avons besoin pour dessiner avec la tortue et bien plus encore.

Dans le tutoriel 1.1, nous avons vu ensemble comment avancer en dessinant une ligne avec l'instruction algo.go().
Il est possible d'aller dans la même direction sans dessiner quoi que ce soit avec l'instruction algo.jump().
Observons ce que le code suivant fait :

algo.go (70);
algo.jump (70);
algo.go (70);

L'objet Algo fournit deux propriétés pour changer la couleur.
La couleur du prochain trait avec algo.setColor() .
La couleur du fond avec la propriété algo.setBgColor() .
Les propriétés de couleur utilisent toutes deux la même table de nombres dont chaque nombre correspond à une couleur:

Un exemple de manipulation de couleurs :

algo.setBgColor (11); // cyan foncé
algo.setColor(3); // cyan
// our square
algo.go (100);
algo.turnRight (90);
algo.go (100);
algo.turnRight (90);
algo.go (100);
algo.turnRight (90);
algo.go (100);
algo.turnRight (90);

Il est possible de cacher et de montrer la tortue en utilisant : algo.hide()  et  algo.show() .

Pour changer la taille du futur trait à dessiner, utilisons la propriété  algo.setStroke() .
Les nombres supérieurs à 1 seront plus épais que la taille par défaut.
Les nombres inférieurs à 1 (par exemple 0.2, 0.5) seront plus fins.

algo.setStroke (0.2); // fin
algo.go (25);
algo.setStroke (1); // épais
algo.go (25);
algo.setStroke (2); // plus épais
algo.go (25);
algo.setStroke (3); // ....
algo.go (25);
algo.setStroke (4); // ....
algo.go (25);
algo.setStroke (5); // ....
algo.go (25);
algo.hide ();

VII-A. Cercle▲

Dessinons un cercle avec un diamètre particulier.

cercle

Sélectionnez

algo.circle (200);

VII-B. Disque▲

Le même cercle, mais plein.

disque

Sélectionnez

algo.disc (200);

VII-C. Ovale▲

Dessinons un ovale avec les diamètres x et y particuliers.

Ovale

Sélectionnez

algo.oval (400, 200);

VII-D. Platter▲

Le même ovale, mais plein.

platter

Sélectionnez

algo.platter (400, 200);

VII-E. Rectangle▲

Dessinons un rectangle avec les dimensions hauteur et largeur.

rectangle

Sélectionnez

algo.rect (400, 200);

VII-F. Surface plane▲

Le même que rectangle, mais plein.

plane

Sélectionnez

algo.plane (400, 200);

VII-G. Texte▲

Dessinons une ligne de texte.

text

Sélectionnez

algo.text ("hello algoid !");
algo.jump (-100);

VIII-A. Ex. 1 : modifions notre carré▲

En modifiant le code source suivant (notre carré), essayons d'obtenir le dessin suivant :

carré

Sélectionnez

// gauche
algo.go (100);
algo.turnRight (90);
// haut
algo.go (100);
algo.turnRight (90);
// droite
algo.go (100);
algo.turnRight (90);
// bas
algo.go (100);
algo.turnRight (90);

solution

Cacher/Afficher le codeSélectionnez

// gauche
algo.go (100);
algo.turnRight (90);
// haut
algo.jump (100); // modifions ici
algo.turnRight (90);
// droite
algo.go (100);
algo.turnRight (90);
// bas
algo.jump (100); // et ici et ce sera tout
algo.turnRight (90);

VIII-B. Ex. 2 : Cible▲

Essayons de dessiner la figure suivante :

solution

Cacher/Afficher le codeSélectionnez

algo.disc (400);
algo.setColor (0); // sombre
algo.disc (300);
algo.setColor (7); // lumineux
algo.disc (200);
algo.setColor (0); // sombre
algo.disc (100);

Essayons avec l'ovale :

solution

Cacher/Afficher le codeSélectionnez

algo.platter (400, 300);
algo.setColor (0); // sombre
algo.platter (300, 200);
algo.setColor (7); // lumineux
algo.platter (200, 100);

Et le rectangle :

solution

Cacher/Afficher le codeSélectionnez

algo.plane (400, 300);
algo.setColor (0); // sombre
algo.plane (300, 200);
algo.setColor (7); // lumineux
algo.plane (200, 100);

VIII-C. Ex. 3 : Cercles▲

Essayons de dessiner la figure suivante :

solution

Cacher/Afficher le codeSélectionnez

algo.circle (100);
algo.jump (50);
algo.circle (200);
algo.jump (100);
algo.circle (400);
algo.jump (200);
algo.circle (800);
algo.jump (400);
algo.circle (1600);

VIII-D. Ex. 4 : Définition d'un triangle▲

avec un script, dessinons la figure suivante :

Indice : l'angle d'un triangle est de 360 ° divisé par 3 = 120 °

solution

Cacher/Afficher le codeSélectionnez

// initialisation de la position de la tortue
algo.turnLeft (90);
// le début du côté du bas
algo.go (50);
algo.circle (200);
algo.turnRight (120); // 360 / 3
// côté 2
algo.go (100);
algo.circle (200);
algo.turnRight (120);
// côté 3
algo.go (100);
algo.circle (200);
algo.turnRight (120);
// fin du côté du bas
algo.go (50);
algo.hide ();

IX-A. Connaissances▲

IX-B. Fonctions utilisées :▲

IX-C. Colophon▲