Création d’une application Etch A Sketch à l’aide de Python et Turtle
et histoire de la tablette Etch-a-Sketch
La tablette Etch-a-Sketch était l’une des créations de jouets les plus intéressantes de la fin des années 1950. Etch-a-Sketch est essentiellement un sosie de tablette ; le cadre rouge contient un écran et deux boutons. Ces boutons contrôlent les mouvements horizontaux et verticaux d’un stylet derrière l’écran. Ce produit est rapidement devenu un énorme succès, avec plus d’un million d’unités vendues dès la première année. C’était l’une des inventions qui permettraient aux enfants de faire des dessins et de s’amuser, tout en favorisant le développement cognitif en améliorant la motricité fine, la coordination œil-main et la conscience spatiale grâce au dessin contrôlé par bouton. Il est devenu si populaire qu’il a même été présenté dans des films comme Histoire de jouets.
Comprendre le projet
Dans cet article, nous utiliserons le module Python Turtle pour développer notre propre version numérique d’Etch-a-Sketch. Il s’agit d’un didacticiel de niveau débutant à intermédiaire, qui nécessiterait une compréhension de base des principes fondamentaux de Python tels que les fonctions Python, les boucles, etc. Grâce au codage de ce projet, nous apprendrons la gestion des événements Python, les coordonnées et les mouvements, les fonctions et les boucles, ainsi que le retour visuel qui en résulte. De plus, nous comprendrons également la notion d’instances en programmation orientée objet. Il s’agit d’une implémentation intéressante du concept de base de Python et d’une façon amusante d’apprendre la programmation à travers un projet visuel. Commençons !
Module Turtle de Python pour le codage visuel
Afin de créer une application Etch-a-Sketch, nous aurons besoin d’une représentation visuelle de notre code. C’est là que le module Turtle de Python entre en jeu. Le module tortue fait partie de la bibliothèque standard Python et permet de dessiner sur un système de coordonnées 2D via des commandes simples. Le module prend également en charge la saisie au clavier, se comportant comme un stylo numérique et le rendant ainsi idéal pour simuler une Etch-a-Sketch.
Le module tortue est basé sur une tortue robotique, qui reçoit certaines commandes qu’elle suit et produit des dessins en conséquence. Pour utiliser cette fonctionnalité, il suffit d’importer le module dans notre code puis d’utiliser les fonctions définies, qui peuvent être explorées à partir de la documentation officielle ici.
Voici quelques lignes de code qui importent le module et utilisent la fonction la plus utile pour dessiner à l’écran :
import turtle
turtle.forward(100)
turtle.right(90)
turtle.forward(100)
turtle.right(45)
turtle.forward(100)
turtle.exitonclick()
Le forward La fonction permet d’avancer le curseur et prend la distance comme argument, alors que la fonction right La fonction tourne la tête de la tortue vers la droite de l’angle donné en argument. Plus de détails sur chaque fonction sont accessibles via la documentation officielle.
Le module Turtle possède également des capacités de programmation orientée objet, ce qui signifie que nous pouvons créer des objets à partir d’un plan donné. Le Turtle et Screen La classe peut être utilisée pour créer des instances d’objet à utiliser dans notre code. Créons-les :
my_pen= Turtle()
my_pen.width(3)
my_pen.speed(0)
screen = Screen()
screen.title("Etch A Sketch")Voyez comment nous avons créé un objet tortue et l’avons appelé my_pen de la classe Turtle qui fait partie du module Python Turtle. Nous avons également créé l’objet écran, qui nous permettra de visualiser le mouvement du stylet ainsi que de le personnaliser selon nos besoins. Nous avons également personnalisé la largeur et la vitesse du stylet, ainsi que nommé l’écran.
Définir les fonctions de mouvement
Il s’agit ensuite de définir les fonctions de mouvement de notre stylo. Tout comme la tablette physique Etch-a-Sketch, qui dispose de 2 boutons, un pour le mouvement vertical de haut en bas, et le second pour le mouvement horizontal de gauche à droite, nous définirons un total de 4 fonctions :
- Avancer : cela déplacera le stylet vers le haut, synonyme du mouvement vers le haut dans la tablette d’origine.
- Reculer : cela déplacera le stylet vers le bas, synonyme du mouvement vers le bas dans la tablette d’origine.
- Tourner à gauche : cela déplacera le stylo vers la gauche d’un certain angle.
- Tourner à droite : cela déplacera le stylo vers la droite d’un certain angle.
Codons ce qui précède sous forme de fonctions :
def move_forwards():
my_pen.forward(50)
def move_backwards():
my_pen.backward(50)
def turn_left():
new_heading = my_pen.heading() + 10
my_pen.setheading(new_heading)
def turn_rigth():
new_heading = my_pen.heading() - 10
my_pen.setheading(new_heading)Dans les deux premières fonctions, nous avons simplement utilisé les fonctions de tortue avant et arrière. Dans les fonctions de déplacement horizontal, turn_left et turn_rightnous avons défini une nouvelle variable new_heading qui est essentiellement l’angle selon lequel le stylo va tourner. Le new_heading prend le cap du stylo qui est l’angle actuel et ajoute 10 degrés en cas de virage à gauche et soustrait 10 degrés en cas de virage à droite. Cet angle sera stocké comme new_heading qui servira d’argument à la fonction setheading qui définit l’orientation du stylo par l’angle donné en argument.
Nous définirons également une fonction qui effacera l’écran. Cette fonction utilise la tortue clear fonction qui supprime le dessin de la tortue de l’écran sans affecter l’état et la position de la tortue. Il ramènera également la position du stylet à son point d’origine, en utilisant le penup, home et pendown fonctions :
def clear_screen():
my_pen.clear()
my_pen.penup()
my_pen.home()
my_pen.pendown()Écoute d’écran
L’une des capacités du module tortue est qu’il s’adapte aux événements d’écoute d’écran. En programmation, l’écoute d’événements est un concept qui détecte et répond aux actions des utilisateurs. Dans notre cas, l’action de l’utilisateur se fera via le clavier, en utilisant les touches WASD pour le mouvement du stylet. Nous utiliserons cette fonctionnalité dans notre code. Ceci peut être accompli en utilisant le listen et onkey méthode pour l’objet écran. Le listen La méthode est utilisée pour collecter les événements clés, et la onkey La méthode définit la fonction à appeler en fonction de la touche particulière qui a été enfoncée.
screen.listen()
screen.onkey(move_forwards, "w")
screen.onkey(move_backwards, "s")
screen.onkey(turn_left, "a")
screen.onkey(turn_rigth, "d")
screen.onkey(clear_screen, "c")Enfin, puisque nous souhaitons conserver l’écran, nous utiliserons le exitonclick méthode d’écran qui garderait l’écran là jusqu’à ce que nous cliquions dessus.
screen.exitonclick()Gravure et croquis !
Maintenant que notre code est terminé, nous allons exécuter le programme. Un écran apparaîtra devant nous et le restera jusqu’à ce que nous cliquions n’importe où dessus.
Nous utiliserons les touches « W », « A », « S » et « D » pour créer un dessin et « C » pour effacer l’écran. Traçons un cercle à travers le clavier !
Vous pouvez également dessiner un cercle simplement en avançant avec « W », puis en tournant deux fois la touche gauche « A », et en continuant ainsi jusqu’à ce que le stylo atteigne sa position de départ. Nous pouvons également nous entraîner à dessiner des formes et comprendre la géométrie tout en jouant avec ce programme.
Améliorer le projet
Maintenant que notre programme de base est créé, nous pouvons ajouter de nombreuses autres fonctionnalités qui permettraient de personnaliser et d’améliorer davantage notre création, telles que :
- Ajout de touches et fonctions correspondantes pour les mouvements diagonaux
- Changer la couleur du stylo
- Enregistrer les dessins et exporter la toile sous forme d’image
Conclusion
Nous avons utilisé avec succès nos connaissances de base de Python et du module Turtle pour créer un programme numérique Etch-a-Sketch. C’est une façon amusante d’apprendre la programmation ainsi que de comprendre les coordonnées, car tout est affiché visuellement. Cela permet également de signaler facilement les erreurs commises dans le code et de déboguer en temps opportun. Bien que simple dans son code, ce type de programme constitue la base de programmes graphiques et de logiciels complexes à venir. Une compréhension de base de l’interface graphique est donc cruciale pour comprendre les fondements du graphisme numérique.
