Ce TP est destiné à vous "montrer" la notion de séquentialité. C'est une notion simple une fois doit exécuter plusieurs lignes d'instructions : un programme. Le programme du cours vous permettra de réaliser ceci :
Nous parlerons donc également de rendu des couleurs sur un ordinateur.
Cette partie est destinée à être réalisée ensemble en classe.
A° Réaliser les actions suivantes :
Placer le programme ci-dessous dans la zone de programmation.
Sauvegarder le programme en le plaçant dans un répertoire SNTPYTHON sous le nom axes.py
Important : n'utilisez jamais un nom correspondant à l'un des modules importés, sinon vous ne pourrez plus importer le module turtle, math ou autre. Donc, pas de math.py, turtle.py...
Lancer le programme (à l'aide de la flèche verte dans Thonny, ou du bouton exécuter dans Basthon).
Visualiser le résultat dans la nouvelle fenêtre qui a dû apparaître (Thonny : voir la barre des tâches, Basthon : voir le bouton Image qui est devenu jaune, en bas à droite).
Sur quelle ligne demande-t-on d'afficher "Origine" ? Quelle fonction utilise-t-on ?
Sur quelle ligne demande-t-on d'afficher "y positif" ? Quelle fonction utilise-t-on ?
Pourquoi les deux messages ne sont-ils pas au même endroit ?
...CORRECTION...
Ligne 2, avec write()
Ligne 4, avec write()
En ligne 3, on modifie la localisation du crayon et les affichages qui auront lieu sur les lignes 4+ utiliseront donc ces coordonnées.
W (sur Windows uniquemnet)° Aller dans le répertoire qui contient votre fichier Python. Dans le sous-menu AFFICHAGE de l'explorateur, vérifier que vous avez bien cocher la case permettant de visualiser les extensions de fichiers.
B° Modifier le programme en supprimant les lignes précédentes pour les remplacer par celles-ci. Relancer le programme pour visualiser le résultat.
L'affichage de "y négatif" est demandé en ligne 6. On doit donc regarder la dernière position du crayon avant cette ligne 6. On la trouve en ligne 5, en (0, -100), c'est à dire x=0 et y=-100.
L'affichage de "x positif" est demandé en ligne 8. On doit donc regarder la dernière position du crayon avant cette ligne 8. On la trouve en ligne 7, en (200, 0), c'est à dire x=200 et y=0.
Voici le résultat attendu du programme précédent :
Les axes dans Turtle
On voit ainsi que l'interpréteur exécute les instructions UNE par UNE en commençant par celle de la ligne 1. Il ne lance pas le programme d'un bloc en tentant d'en deviner le sens, comme un humain pourrait le faire.
Pour programmer, il faut donc avoir la capacité de se mettre "à la place" de l'interpréteur pour comprendre comment il va réagir. Pas d'intuition humaine, juste de la logique et de la syntaxe pure et dure.
Quatre remarques importantes pour éviter de perdre du temps : savoir identifier une erreur de programmation.
D° Voici un programme qui correspond au précédent mais avec un ordre aléatoire dans les lignes fournies.
Questions
Provoque-t-il le même affichage ?
Un développeur peut-il concevoir son programme sans se demander comment l'interpréteur va réagir ?
Traceback (most recent call last): File "/home/rv/axes.py", line 1, in <module>:
write("Origine", font=('Arial', 28, 'normal'))
NameError: name 'write' is not defined
...CORRECTION...
L'interpréteur signale qu'il y a un problème en ligne 1 : il ne connait pas le nom write.
C'est normal puisque ce nom de fonction est inclu dans le module turtle qui n'est importé qu'à partir de la ligne 4.
F° Ce programme provoque une erreur. L'interpréteur ne comprend pas ce qu'on lui demande.
Traceback (most recent call last): File "/home/rv/axes.py", line 8, in <module>:
write(x > 0, font=('Arial', 28, 'normal'))
NameError: name 'x' is not defined
...CORRECTION...
Le problème vient du fait qu'on doit transmettre un string et qu'on a "oublié" de placer les guillemets autour du texte à afficher.
Remarquez bien qu'il a exécuté le programme sur les lignes 1 à 7. Il stoppe à la 8.
G° Ce programme provoque une erreur. L'interpréteur ne comprend pas ce qu'on lui demande.
Traceback (most recent call last): File "/home/rv/axes.py", line 3, in <module>:
goto(0, 100}
^
SyntaxError: closing parenthesis '}' does not match opening parenthesis '('
...CORRECTION...
Le problème vient du fait qu'on veut fermer les informations transmises à la fonction avec un accolade. Or, on doit utiliser une parenthèse. L'interpréteur Python signale donc qu'il ne comprend rien à ce qu'on désire. Par contre, il a exécuté le programme sur les lignes 1 et 2.
Bilan de ce que nous venons de voir sur le module turtle.
2.1 - Turtle : afficher du texte avec write()
Ouverture d'un écran Turtle
Pour importer les fonctions du module Turtle, il suffit de taper ceci :
-
fromturtleimport*
Ecriture avec write()
On peut écrire à l'endroit où se trouve la tortue en tapant write("bonjour").
Le texte à afficher doit être transmis sous forme de string.
-
write("bonjour")
Mais on peut faire mieux : on peut écrire avec une taille de police plus grande par exemple.
-
write("bonjour",font=('Arial',28,'normal'))
2.2 - Turtle : déplacement absolu avec goto()
Système d'axes choisi pour Turtle
Le module utilise le système cartésien habituel.
Le point (0,0) est au centre de l'écran.
L'axe Ox est l'axe des abscisses, vers la droite.
L'axe Oy est l'axe des ordonnées, vers le haut.
Les axes dans Turtle
Déplacement avec goto()
On peut déplacer le curseur à l'écran et utilisant goto(x,y).
On choisit d'abord la couleur rouge et on trace un point de 200 pixels.
On choisit ensuite la couleur magenta et on trace un point plus petit.
On peut demander des couleurs prédéfinies en utilisant leurs noms en anglais ("red", "yellow"...) mais parfois on veut un réglage plus fin. Comment faire ?
Couleurs RGB
Dans la partie Photographie Numérique, nous verrons précisement comment fonctionne les couleurs RGB.
RGB veut dire Red Green Blue : on fournit l'intensité rouge, l'intensité verte et l'intensité bleue émises. Notre oeil reçoit les 3 radiations et notre cerveau perçoit alors une couleur particulière.
On peut donner ces intensités lumineuses en utilisant une notation dite hexadécimale dont voici le résumé :
Aucune intensité se dit 00.
Des intensités de plus en plus intenses sont 11, 22, 33, 44, 55, 66, 77, 88, 99, AA, BB, CC, DD, EE.
L'intensité maximale (à "fond") se note FF.
Il suffit de fournir un string commençant par # (ALT-GR et 3) suivi par la valeur de rouge/red (R), de vert/green (G) et de bleu/blue (B).
Quelques exemples
Les 3 couleurs de base :
"red" ou "#FF0000" code le rouge (uniquement le rouge à fond).
"green" ou "#00FF00" code le vert (uniquement le vert à fond).
"blue" ou "#0000FF" code le vert (uniquement le bleu à fond).
Les 3 compositions :
"yellow" ou "#FFFF00" code le jaune (rouge et vert à fond).
"magenta" ou "#FF00FF" code le jaune (rouge et bleu à fond).
"cyan" ou "#00FFFF" code le jaune (vert et bleu à fond).
Du noir jusqu'au blanc
"black" ou "#000000" code le noir (aucune couleur).
"dimgrey" ou #666666" code du gris (même intensité faible pour les trois).
"grey" ou #888888" code du gris (même intensité moyenne pour les trois).
"lightgrey" ou #DDDDDD" code du gris (même intensité forte pour les trois).
"white" ou #FFFFFF" code du blanc (intensité maximale pour les trois).
Et toutes les autres couleurs, comme
"orange" ou #FFAA00" code du orange (rouge à fond, pas mal de vert et pas de bleu).
Modifier la couleur avec pencolor() en hexadécimal
Voici un exemple d'affichage et le code correspondant :
⚙ 03 (exercice)° Utiliser maintenant ce programme qui vous permettra d'obtenir le début de l'image voulue :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
fromturtleimport*bgcolor("black")goto(-100,-50)# on part en x=-100 et y=-50pencolor("#FF0000")dot(50)goto(-50,0)# on part en x=-50 et y=0pencolor("#FFFF00")dot(25)goto(0,50)# on part en x=0 et y=50pencolor("#00FF00")dot(50)
Voilà le résulat que vous devriez avoir :
Questions
Où demande-t-on d'obtenir un fond noir ?
De quelle valeur varie x entre chaque demande d'affichage ?
De quelle valeur varie y entre chaque demande d'affichage ?
...CORRECTION...
Le fond est obtenu en utilisant la fonction bgcolor(), le bg voulant bien entendu signifié background.
3
bgcolor("black")
Pour x et y, on peut constater qu'on les augmente l'un et l'autre de 50 à chaque fois.
x passe de -100 à -50 puis 0.
y passe de -50 à 0 puis 50.
✌ 04° Compléter maintenant le programme pour qu'il affiche ceci (texte y compris) :
4 - Lever et abaisser le stylo avec penup() et pendown()
Lever le stylo avec penup()
Lorsqu'on veut déplacer le crayon sans avoir le trace du stylo, il faut "lever" le stylo avec la fonction penup(), sans argument.
1
2
3
4
5
6
7
8
9
10
11
fromturtleimport*goto(0,0)pencolor("#0000AA")dot(50)# on dessine le point bleu en (0, 0)goto(100,0)# vers (100, 0) pointe baissée donc traitpenup()# on lève la pointe à partir de cette lignegoto(200,0)# et ce déplacement ne provoque donc pas de trait
Plus de trait sur les lignes qui suivront la ligne 9.
Abaisser le stylo avec pendown()
Pour réactiver la fonction traçage, il suffit de placer pendown(). Sur les lignes qui suivront, les traits vont réapparaitre lors des déplacements.
A titre d'exemple, voici comment faire des pointillés.
5.1 - Turtle : déplacement relatif avec forward(), left(), right()
Orientation de la tortue
Si vous regardez l'écran de turtle, vous pourrez constater qu'on y voit une sorte de flèche : elle indique la direction vers laquelle pointe la tortue.
Initialement, la tortue pointe vers la droite (angle 0°).
Avancer avec forward()
Cette fonction permet de faire avancer la tortue dans la direction qu'elle regarde en partant de sa position actuelle.
On doit lui transmettre la distance en pixels.
1
2
3
4
5
6
fromturtleimport*dot(15)forward(50)# veut dire d’avancer de 50 pixels.dot(15)forward(100)# veut dire d’avancer de 100 pixels.
Tourner avec left()
Cette fonction permet de faire tourner la tortue sur place en fournissant un angle en degrés. Elle tourne sur elle-même vers la gauche, en sens anti-horaire donc.
1
2
3
4
5
6
7
fromturtleimport*dot(15)forward(50)# veut dire d’avancer de 50 pixels.dot(15)left(90)# rotation à angle droitforward(100)# veut dire d’avancer de 100 pixels.
Tourner avec right()
Cette fonction permet de faire tourner la tortue sur place en fournissant un angle en degrés. Elle tourne sur elle-même vers la droite, en sens horaire donc.
1
2
3
4
5
6
7
fromturtleimport*dot(15)forward(50)# veut dire d’avancer de 50 pixels.dot(15)right(90)# rotation à angle droitforward(100)# veut dire d’avancer de 100 pixels.
5.2 - Turtle : taille du crayon avec pensize()
Cette fonction permet de faire modifier la taille du trait OU de récupérer la taille du trait.
5.3 - Turtle : tracer un arc de cercle avec circle()
Tracer un cercle complet
La fonction circle() trace un cercle dont on doit fournir le rayon. La position actuelle correspond au point de départ sur le périmètre du cercle.
1
2
3
4
fromturtleimport*circle(100)circle(50)
Tracer un arc de cercle
On peut envoyer deux arguments à la fonction circle() : le premier est le rayon, le deuxième est l'angle vers lequel le crayon va s'arrêter lors du tracé. Pas facile à utiliser.
360° de rotation sur soi-même en suivant la trajectoire du cercle : facile, ça fait un cercle.
180° de rotation sur soi-même en suivant la trajectoire du cercle imaginaire : facile, ça fait un demi-cercle.
90° de rotation sur soi-même en suivant la trajectoire du cercle imaginaire : facile, ça fait un quart de cercle.
5.4 - Turtle : choisir l'orientation absolue avec setheading()
left() permet de modifier l'orientation relative du crayon (par rapport à son orientation actuelle). Voyons comment le faire pointer vers une orientation absolue : vers la droite, la gauche, le haut ou le bas.
Les angles
Voici un descriptif visuel des différents angles :
Les différents angles absolus d'orientation
Modifier l'orientation du crayon
La fonction setheading() permet d'imposer la direction absolue vers lequel le crayon est orienté.
Ou attendre l'activité Python que nous allons faire qui en parle.
Mes programmes turtle ne fonctionnent pas sous Basthon !
C'est sans doute car vous ne saviez pas qu'il faut faire une légère modification à vos programmes : il faut rajouter une instruction finale pour lancer la demande d'affichage : done().
Voici un exemple avec un petit programme :
Activité publiée le 01 12 2023
Dernière modification : 01 12 2023
Auteur : ows. h.
