keyevents
Deutsch   English   Français   

12. ÉVÉNEMENTS CLAVIER

 

 

TU APPRENDS ICI...

 

comment influencer le déroulement d’un programme en appuyant sur des touches du clavier. Comme pour les événements de souris, tu définis dans une fonction callback ce qui doit se passer lorsqu’une touche est pressée. La fonction callback n’est pas appelée par le programme lui-même, mais automatiquement par le système lorsqu’une touche est appuyée.

 

 

EXEMPLES

 

Example 1: En appuyant sur la touche r, un cercle rouge est dessiné, avec la touche b un cercle bleu et avec la touche g un cercle vert.

Tu définis une fonction callback onKeyPressed(key) .

Celle-ci renvoie le nom ou le code numérique de la touche pressée. Avec cette entrée clavier, tu peux définir la couleur en rouge, bleu ou vert. Ensuite, un cercle rempli est dessiné dans la couleur choisie. La fonction callback est enregistrée grâce à un paramètre de makeGPanel() . Ainsi, tu indiques au système qu’il doit appeler cette fonction à chaque pression d’une touche. 		 

Après le démarrage du programme, tu dois d’abord cliquer avec la souris dans la fenêtre graphique, sinon les frappes clavier seront exécutées dans la fenêtre de l’éditeur.

Programme:     

#Gp12a.py
from gpanel import *

def onKeyPressed(key):
    print(key)
    if key == 'r' or key == 82:
        setColor("red")
    elif key == 'b' or key == 66:
        setColor("blue")
    elif key == 'g' or key == 71:
        setColor("lime")    
    fillCircle(3)

makeGPanel(-10, 10, -10, 10, keyPressed = onKeyPressed)
print("Use key r, g, or b.")
►Copy to clipboard

 

 

Example 2:Changer la direction avec les touches du curseur.
Ton programme réagit à l’appui des touches du curseur UP, DOWN, LEFT et RIGHT. Dans la fonction callback onKeyPressed(key), tu définis dans une structure if-elif comment les coordonnées doivent être modifiées lorsqu’une de ces touches est pressée. Avec WebTigerPython, tu utilises le nom de la touche , avec WebTigerJython, le code numérique.
Le programme attend dans une boucle infinie, qu’une touche soit pressée et dessineune courte ligne dans la direction correspondante.

  

Comme la valeur des variables x et y est modifiée dans une fonction, ces variables doivent être déclarées comme global..

Programme:     

#Gp12b.py
from gpanel import * 
 
def onKeyPressed(key):
    global x, y
    if key == 'ArrowUp' or key == 38:
        y += 2 
    elif key == 'ArrowDown' or key == 40:
        y -= 2
    elif key == 'ArrowLeft' or key == 37:
        x -= 2
    elif key == 'ArrowRight' or key == 39:
        x += 2  

makeGPanel(-100, 100, -100, 100, keyPressed = onKeyPressed)
x = 0
y = 0
setColor("lime")
lineWidth(5)
print("Use cursor keys to move the cursor!")

while True:
    draw(x, y)
►Copy to clipboard

 

Example 3: Contrôler un curseur de dessin en mouvement

Dans les jeux vidéo, le clavier est souvent utilisé pour contrôler le déroulement du jeu. Ton exemple est une première version d’un jeu Snake. Lors du premier appui sur la touche UP, le serpent commence à se déplacer. En appuyant ensuite sur l’une des 4 touches du curseur, tu peux changer sa direction. Cet exemple convient bien à ce qu’on appelle une programmation par états. Lorsqu’on appuie sur la première touche du curseur, le serpent est placé dans un état et reste dans cet état jusqu’à ce qu’il soit placé dans un nouvel état par l’appui sur une autre touche du curseur. 		 

Dans la fonction callback, tu définis uniquement l’état .Les nouvelles coordonnées sont calculées dans la fonction setMove(). La vitesse du mouvement peut être réglée avec la commande delay().

Programme:     

#Gp12c.py
from gpanel import *
 
def onKeyPressed(key):
    global state
    if key == 'ArrowUp' or key == 38:
        state = 'UP'
    elif key == 'ArrowDown' or key == 40:
        state = 'DOWN'
    elif key == 'ArrowLeft' or key == 37:    
        state = 'LEFT'
    elif key == 'ArrowRight' or key == 39:    
        state = 'RIGHT'

def setMove():
    global x, y
    if state == 'UP':
        y += 2 
    elif state == 'DOWN':
        y -= 2
    elif state == 'LEFT':
        x -= 2
    elif state == 'RIGHT':
        x += 2

makeGPanel(-100, 100, -100, 100, keyPressed = onKeyPressed)
x = 0
y = 0
setColor("lime")
lineWidth(5)
state = ''

while True:
    setMove()
    draw(x, y)
    delay(100)
►Copy to clipboard

 

Example 4: Arrêter une animation avec la touche Escape

Les applications en cours d’exécution peuvent souvent être arrêtées avec la touche Escape. Dans ton exemple, tu peux interrompre une animation simple avec la touche Escape et la démarrer avec la touche Enter. Tu peux répéter ce processus autant de fois que tu le souhaites. Dans cet exemple également, seul l’état est défini dans la fonction callback et le déroulement du programme est défini dans une seconde fonction setMove(). Ici aussi, tu dois d’abord cliquer dans la fenêtre graphique avant d’utiliser les touches Enter et Escape. 		 

Programme:     

#Gp12d.py
from gpanel import *

def onKeyPressed(key):
    global state
    if key == 'Escape' or key == 27:
        state = 'stop'
    elif key == 'Enter' or key == 13:
        state = 'go'

def setMove():
    global x, dx
    if state == 'go':
        x = x + dx    
        if x > 80 or x < -80:
            dx = -dx
    elif state == 'stop':
        return  

makeGPanel(-100, 100, -100, 100, keyPressed = onKeyPressed)
x = 0
y = 0
dx = 1
state = ''

while True:
    setMove()
    pos(x, y)
    setColor("red")
    fillCircle(5)
    delay(10)
    setColor("white")
    fillCircle(5.2)
►Copy to clipboard

 

 

À RETENIR...
 

La fonction callback onKeyPressed(key wn’est pas appelée par ton programme, mais par le système lorsque tu as appuyé sur une touche. Le nom des touches, en particulier des touches spéciales, peut être affiché dans la fenêtre de sortie avec print(key) . La fonction callback est enregistrée comme paramètre de makeGPanel(). En principe, la fonction callback ne doit pas contenir de longs blocs de programme.

 

 

À FAIRE PAR TOI-MÊME

 

1.


Le carré a au départ une longueur de côté de 20. À chaque pression de la touche UP, le carré doit être agrandi, et à chaque pression de la touche DOWN, il doit être réduit. Pour que la réduction du carré soit visible, tu dois effacer le carré plus grand précédemment dessiné (en le recouvrant avec la couleur blanche).

 

  


2.
Complète le programme de l’exemple 3 afin que le jeu se termine lorsque le serpent touche le bord de la fenêtre. Le texte "Game Over" doit alors apparaître dans la fenêtre de sortie.  

3.
Dessine un feu de circulation. Avec les touches r, y et g, une lampe rouge, jaune ou verte doit être allumée. Les deux autres lampes doivent être dans l’état "off" et affichées en gris foncé.  

4.
Complète le programme ci-dessous pour une course d’obstacles. Ton programme dessine d’abord l’obstacle : un carré gris. Avec les touches du curseur, on doit pouvoir déplacer l’obstacle vers la gauche ou vers la droite. Après le démarrage du programme, l’obstacle est d’abord déplacé à la position souhaitée. Ensuite, la course d’obstacles est démarrée avec la touche s. La ligne de points rouges doit alors contourner l’obstacle. 
from gpanel import *

KEY_LEFT = 37 
KEY_RIGHT = 39
KEY_s = 83

makeGPanel(-50, 50, -50, 50) 
xH = 0 
y = 0
text(-50,47,"Start with key s")
setColor("grey") 
fillRectangle(xH-3,-3, xH+3, 3)

while True: 
    key = getKeyCodeWait()
    if key == KEY_s:
        setColor("red")  
        for x in range(-49,50,2):
            move(x,y) 
            fillCircle(1) 
            delay(100)
Lorsque tu déplaces le carré, tu utilises une astuce simple : tu recouvres d’abord la figure à son ancienne position avec la couleur blanche, puis tu la redessines en gris à la nouvelle position (par exemple xH = xH + 2).