• Etude de la page d'accueil de CodeSkulptor :
  Ouvrez le site https://py3.codeskulptor.org dans une nouvelle fenêtre.
  Sans effacer la page de gauche que nous allons étudier.
  Quelles sont les nouveautés ?
  • ligne 13 : définition de la fonction "click()" qui change le contenu de la variable message.
    remarque : ligne 14 : global message signifie que nous utilisons la variable message définie à la logne 10
    sans cette déclaration, une variable "message" locale à la fonction click() serait créée inutilement.
    et on ne modifierait pas la variable de la ligne 10.
  • ligne 18 : définition de la fonction "draw()" qui a comme argument "canvas" : un objet de type canvas.
    automatiquement fourni lors de son appel par le gestionnaire de dessin.
    cette fonction appelle draw_text() avec 4 arguments :
    • message : le texte à dessiner
    • [50,112] : la position où commence le texte
    • 48 : la taille du texte
    • "Red" : la couleur du texte
  • ligne 23 : on appelle la fonction frame.add_button() avec 2 arguments :
    la fonction add_button() n'est connue que par les objets comme "frame" de type Frame.
    Un bouton "Click me" est ajouté dans la zone de contrôle (blanche) du cadre.
    • "Click me" : Le texte à écrire sur le bouton
    • click : la fonction à appeler quand le bouton est cliqué.
      Le bouton seul ne fait rien : c'est la fonction qu'il appelle qui fait une action.
  • ligne 24 : on appelle la fonction frame.set_draw_handler() avec un seul argument :
    • draw : la fonction à appeler pour peindre la toile.
      Cette fonction va être appelée en permanence (environ 50 fois par seconde) :
      Quand le contenu de la variable "message" change, le dessin affiche le nouveau texte.
• Associer des fonctions (click et draw) aux "gestionnaires d'évènements" (button et canvas)
  se dit en anglais : "assign callbacks to event handlers"

import simplegui

# Handler to draw on canvas
# draw_text( texte, position, taille, couleur )
# la position [0, 0] est en haut à gauche de la fenêtre
# la position [x, 0] est à x pixels vers la droite
# la position [0, y] est à y pixels vers le bas
def draw(canvas):
    texte = "Welcome!"
    position = [50,112]
    taille = 48
    couleur = "Red"
    canvas.draw_text(texte, position, taille, couleur)

# Create a frame and assign callbacks to event handlers
frame = simplegui.create_frame("Home", 300, 200)
frame.set_draw_handler(draw)

# Start the frame animation
frame.start()

La fonction "set_draw_handler( )" appliquée à un objet de type "Frame" associe une fonction "draw" qui va dessiner en permanence dans la partie "canvas" à partir de start( ).
Si l'on dessine toujours la même image, on ne s'en aperçoit pas. Mais on peut décaler l'image d'un pixel à chaque appel pour voir que cette fonction est appelée sans interruption:
on sort : position = [50,112] de la fonction "draw"
et on la remplace par l'instruction :
position[0] = ( position[0] + 1 ) % 300
qui ajoute 1 dans la direction x et calcule le reste de la division par 300 pour ramener l'image dans le cadre quand sa position dépasse 300

import simplegui

# Handler to draw on canvas
# draw_text( texte, position, taille, couleur )
# la position [0, 0] est en haut à gauche de la fenêtre
# la position [x, 0] est à x pixels vers la droite
# la position [0, y] est à y pixels vers le bas
position = [50,112]
def draw(canvas):
    global position
    texte = "Welcome!"
    position[0] = (position[0] + 1) % 300
    taille = 48
    couleur = "Red"
    canvas.draw_text(texte, position, taille, couleur)

# Create a frame and assign callbacks to event handlers
frame = simplegui.create_frame("Home", 300, 200)
frame.set_draw_handler(draw)

# Start the frame animation
frame.start()

Comment faire pour que la fin du texte qui disparaît sur la droite réapparaisse tout de suite à gauche?
Dessiner un deuxième texte décalé de 300 vers la gauche
Si vous ne trouvez pas : solution