Discussion :

[mika34770]

Bonjour à tous ! je me présente: Diane-Zoé en terminale qui doit réaliser un petit programme sur interface tkinter de type flappy bird avec les "moyens du bord" comme on dit ^^
Mon idée est la suivante : le petit avion à gauche qui ne peut que monter ou descendre doit éviter des nuages qui arrivent de la droite
(par vague de 3 pour l'instant mais de position et de vitesse aléatoire )
On va faire au plus simple pour le score le but étant de tenir le plus longtemps dans la durée. ( avec mémorisation du meilleur score par exemple )
Mon programme doit vous piquer les yeux certainement car je débute et je ne dois mon salut qu'aux exemples pris de ci de la sur la toile et les cours en ligne ( et un peu mon prof quand même ! )
Mais pour l'instant je suis assez fière de moi car : j'ai réussi a afficher l'avion et lui permettre de monter et descendre youhouuu ( quoiqu'il y ai une latence entre les deux déplacements qui n'est pas agréable... )
j'ai réussi à afficher trois nuages qui arrivent de la droite vers la gauche youpiii mais .... là je bloque un peu car je n'ai qu'une seule vague et c'est fini...
j'aimerai que cette séquence se répète par exemple toutes les 3 secondes ( et par la suite que je puisse accélérer un peu avec le temps )

Voici mon code merci de me dire comment arriver à ce résultat ou de me donner la voie si vous ne voulez pas mâcher le morceau ^^
Si vous trouvez des choses a améliorer je suis preneuse !

ps: il me reste une semaine pour y arriver :p

Encore merci à tous !

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
 
from tkinter import *
from random import *
 
fenetre = Tk()
fenetre.title('Flappy Bird')
 
#Creation du canvas:
canvas=Canvas(fenetre,width = 1400, height = 600 , bd=0, bg='skyblue')
canvas.pack(padx=10,pady=10)
 
#deplacement des nuages avec randomisation de vitesse        
def deplacement():
    canvas.move(Nuage_1,-(randint(3,20)),0)
    canvas.move(Nuage_2,-(randint(5,10)),0)
    canvas.move(Nuage_3,-(randint(4,30)),0)
 
    #On repete cette fonction
    fenetre.after(50,deplacement)
 
#chemin d'acces a l'image:
imgfile1 = 'nuage1.gif'
imgfile2 = 'nuage2.gif'
imgfile3 = 'nuage3.gif'
# Utilisation d'un dictionnaire pour conserver une référence:
gifsdict={}
 
#Creation des images:
img1 = PhotoImage(file = imgfile1)
gifsdict[imgfile1] = img1
img2 = PhotoImage(file = imgfile2)
gifsdict[imgfile2] = img2
img3 = PhotoImage(file = imgfile3)
gifsdict[imgfile3] = img3
 
#creation de l'avion
fichierImage=PhotoImage(file='avion29.gif')
 
#fonctions de déplacement de l'avion
def haut(event):
    canvas.move(image,0,-10)
def bas(event):
    canvas.move(image,0,10)
 
 
#reduction de l'image initiale par 2:
img_2 = fichierImage.subsample(2, 2)
image=canvas.create_image(20,0,anchor=NW,image=img_2)
 
canvas.focus_set()
 
canvas.bind('<Up>',haut)
canvas.bind('<Down>',bas)
 
 
 
#On cree les Widget images dans le canvas:
#NW=Nord West, le coin haut gauche de l'image sera positionne a (1400,random):
Nuage_1=canvas.create_image(1400,(randint(0,600)),anchor=NE,image=img1)
Nuage_2=canvas.create_image(1400,(randint(0,600)),anchor=NE,image=img2)
Nuage_3=canvas.create_image(1400,(randint(0,600)),anchor=NE,image=img3)
 
#tentative de fonction recursive pour afficher les nuages en continu avec une temporisation de 3 secondes ( d'ou les 3000 ms ).
#pour info la fonction animation suivante ne fait strictement rien à l'écran....
def animation():
    deplacement()
 
    #On repete cette fonction
    canvas.after(3000, animation)
deplacement()
animation()
 
 
 
fenetre.mainloop()

[wiztricks]

Salut,

Voici mon code merci de me dire comment arriver à ce résultat ou de me donner la voie si vous ne voulez pas mâcher le morceau ^^

Vous pourriez écrire cela en vous inspirant de ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
import tkinter as tk
from random import randint
 
 
SIZE = 500
COUNT = 3
 
canvas = tk.Canvas(width=SIZE, height=SIZE, highlightthickness=0)
canvas.pack()
 
nuages = []
nuages_delayed = []
 
for i in range(COUNT):
    d = randint(15, 50)
    y = randint(d, SIZE-d)
    iid = canvas.create_oval(SIZE, y, SIZE+d, y+d, tag='nuage', fill='grey')
    nuages.append(iid)
 
def cancel_delayed(iid):
    nuages_delayed.remove(iid)
    nuages.append(iid)
 
def nuages_move(delay=50):
 
    for iid in nuages[:]:
        x0, y0, x1, y1 = canvas.bbox(iid)
        if x1 <= 0:
            nuages.remove(iid)
            nuages_delayed.append(iid)
            d = x1 - x0
            y = randint(d, SIZE-d)
            canvas.coords(iid, SIZE, y, SIZE+d, y+d)
            canvas.after(1000, lambda iid=iid: cancel_delayed(iid))
        else:
            canvas.move(iid, -10, 0)
    canvas.after(delay, nuages_move)
 
nuages_move()
tk.mainloop()

ou mieux utiliser des tags.

- W

[mika34770]

Merci beaucoup pour votre réponse et pour cet exemple de code qui semble écrit spécialement pour mon cas c'est parfait !
même si je ne maîtrise pas toutes les fonctions utilisées je vais les étudier et m'en inspirer pour ce qui est des tags je vais m'empresser de regarder ce qu'il en est
Encore merci Wiztricks

[mika34770]

Alors voila je me suis bien inspiré de votre programme qu'il m'a fallu analyser, décortiquer et adapter car j'affiche des images GIF. j'ai du supprimer toute la partie de variation des diamètres de vos objets ne sachant si je pouvais l'appliquer à une image.
Grâce à votre variable COUNT il me sera possible de déterminer le nombre de nuages en déplacement.
j'ai réussi à faire afficher des visuels de nuages différents.
pour plus de réalisme j'ai conservé la randomisation en y et j'en ai ajouté une en x pour éviter l'alignement vertical.
Comme il y avait une latence d'une seconde environ a l'écran à la réapparition des nuages j'ai du les faire afficher au delà du canevas .

Après l'ajout d'un fond sonore via le module pygame et d'un timer j'en suis désormais à la gestion des collisions.

le but de mon avion est d éviter les nuages donc je dois gérer toute collision avec eux.

Mon souci est que sur l'affichage de plusieurs nuages mon avion n'entre en collision qu'avec un seul sur la vague et pas les autres.
comme si les autres nuages n'avaient pas d'objet.
ma méthode find.overlapping est t'elle la bonne ? comment la rendre efficace sur tous les nuages affichés ?

voici à nouveau mon code et cette fois ci entre des balises

je vous remercie par avance de l'aide que vous pourrez m'apporter.

Code python :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
from tkinter import *
import tkinter as tk
from random import randint
 
import pygame
import time
 
from timeit import default_timer
 
 
# horloge
def updateTime():
    now = default_timer() - start
    minutes, seconds = divmod(now, 60)
    hours, minutes = divmod(minutes, 60)
    str_time = "%d:%02d:%02d" % (hours, minutes, seconds)
    canvas.itemconfigure(text_clock, text=str_time)
    canvas.after(1000, updateTime)
 
# nombre de nuages à déterminer ici
COUNT = 2
# module sonore faudra mettre en boucle...
pygame.mixer.init()
 
mon_audio=pygame.mixer.Sound("son3.wav")
mon_audio.set_volume(1)
mon_audio.play()
 
canvas = tk.Canvas(width=1000, height=600, bd=0, bg='skyblue')
canvas.pack()
#canvas.resisable(width=False,height=False)
#en attente car impossible a activer.
 
# mise a zero du compteur et affichage.
start = default_timer()
text_clock = canvas.create_text(930, 20,font="Arial 30 italic", fill="red",)
 
# création de listes
 
nuages = []
nuages_differe = []
 
# création des images
 
imgfile1 = 'nuage1.gif'
imgfile2 = 'nuage2.gif'
imgfile3 = 'nuage3.gif'
imgfile4 = 'nuage4.gif'
imgfile5 = 'nuage5.gif'
 
# Utilisation d'un dictionnaire pour conserver une référence:
gifsdict={}
 
#Creation des images:
 
img1 = PhotoImage(file = imgfile1)
gifsdict[imgfile1] = img1
img2 = PhotoImage(file = imgfile2)
gifsdict[imgfile2] = img2
img3 = PhotoImage(file = imgfile3)
gifsdict[imgfile3] = img3
img4 = PhotoImage(file = imgfile4)
gifsdict[imgfile4] = img4
img5 = PhotoImage(file = imgfile5)
gifsdict[imgfile5] = img5
 
#création d'une liste des images
liste =[img1,img2,img3,img4,img5]
 
 
 
# Boucle création nuages
 
for i in range(COUNT):
    index = randint(0,4)
    g = liste[index]
    y = randint(0,600)
    nuage = canvas.create_image(1200,y,anchor=NE,image=g)
    nuages.append(nuage)
 
 
def collision():
    if len(canvas.find_overlapping(x1,y1,x2,y2))>1:
        print("COLLISION !")     
 
def cancel_delayed(nuage):
    nuages_differe.remove(nuage)
    nuages.append(nuage)
 
def nuages_move(delay=50):
 
    for nuage in nuages[:]:
 
        if canvas.coords(nuage)[0]<=0:
            nuages.remove(nuage)
            nuages_differe.append(nuage)
            y = randint(0,600)
            canvas.coords(nuage,randint(1550,2300),y)
 
            canvas.after(500, lambda nuage=nuage: cancel_delayed(nuage))
 
        else:
            canvas.move(nuage, -20, 0)
            collision()
    canvas.after(delay, nuages_move)
 
 
 
#creation de l'avion
aviongrand=PhotoImage(file='avion29.gif')
 
#fonctions de déplacement de l'avion
 
def haut(event):
    if canvas.coords(cadreavion)[1]<=0:
        canvas.move(cadreavion,0,0)
 
    else:
        canvas.move(cadreavion,0,-15)
 
def bas(event):
    if canvas.coords(cadreavion)[1]>=500:
        canvas.move(cadreavion,0,0)
 
    else:
        canvas.move(cadreavion,0,15)
 
 
#reduction de l'image initiale par 2:
avion = aviongrand.subsample(2, 2)
cadreavion = canvas.create_image(20,20,anchor=NW,image=avion)
 
#détermination des coordonnées de l'avion via le tuple renvoyé                                         
coordavion = canvas.bbox(cadreavion)
x1 = coordavion[0]
y1 = coordavion[1]                                          
x2 = coordavion[2]
y2 = coordavion[3]
 
#les 4 coordonnées du rectangle au cas ou mais semble inutile ...
#a=(x1,y1)
#b=(x1+153,y1)
#c=(x2,y2)
#d=(x2-153,y2)
 
canvas.focus_set()
 
canvas.bind('<Up>',haut)
canvas.bind('<Down>',bas)
 
 
nuages_move()
 
updateTime()
canvas.mainloop()

[mika34770]

voici un petit visuel de mon jeu avec l'affichage d'une collision précédente.
avec un zip contenant les gifs, le fichier sonore étant trop lourd.

[wiztricks]

Salut,

Mon souci est que sur l'affichage de plusieurs nuages mon avion n'entre en collision qu'avec un seul sur la vague et pas les autres.

Lorsque l'avion bouge, les coordonnées de sa "bbox" stockées dans x1, y1, x2, y2 ne sont pas mises à jour... Il n'y a collision que lorsqu'un nuage atteint sa position initiale.

Alors voila je me suis bien inspiré de votre programme qu'il m'a fallu analyser, décortiquer et adapter car j'affiche des images GIF.

A vouloir faire joli prématurément, vous ne regardez pas l'essentiel qui se résume à bouger et détecter des collisions entre des rectangles...

- W

[mika34770]

je vous remercie de l'éclairage, je vais faire en sorte de mettre à jour les coordonnées de la bbox.
Et en effet j'ai été un peu trop vite sur l'aspect esthétique au détriment de l'essentiel
un grand merci pour la rapidité de votre réponse.
Cordialement.

[mika34770]

Bonjour pour mieux comprendre ce qui se passe j' affiche les coordonnées de canvas.coords(cadreavion) qui lorsque je bouge l'avion prennent en compte le déplacement
et enfin des variables x1,y1,x2,y2 au moment de la collision et en effet ces dernières sont toujours aux mêmes valeurs. comment les actualiser ?
j'ai pensé( surement à tort ) à utiliser global dans ma fonction mais je ne suis pas sur que cela soit nécessaire et en tout cas sans efficacité..

je vous remercie de vos éclairages

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
from tkinter import *
import tkinter as tk
from random import randint
 
import pygame
import time
 
from timeit import default_timer
 
def updateTime():
    now = default_timer() - start
    minutes, seconds = divmod(now, 60)
    hours, minutes = divmod(minutes, 60)
    str_time = "%d:%02d:%02d" % (hours, minutes, seconds)
    canvas.itemconfigure(text_clock, text=str_time)
    canvas.after(1000, updateTime)
 
 
 
# nombre de nuages
COUNT = 5
 
pygame.mixer.init()
 
mon_audio=pygame.mixer.Sound("son3.wav")
mon_audio.set_volume(1)
mon_audio.play()
 
canvas = tk.Canvas(width=1000, height=600, bd=0, bg='skyblue')
 
canvas.pack()
#canvas.resisable(width=False,height=False)
 
start = default_timer()
text_clock = canvas.create_text(930, 20,font="Arial 30 italic", fill="red",)
# création de listes
 
nuages = []
nuages_differe = []
 
# création des images
 
imgfile1 = 'nuage1.gif'
imgfile2 = 'nuage2.gif'
imgfile3 = 'nuage3.gif'
imgfile4 = 'nuage4.gif'
imgfile5 = 'nuage5.gif'
 
# Utilisation d'un dictionnaire pour conserver une reference:
gifsdict={}
 
#Creation des images:
 
img1 = PhotoImage(file = imgfile1)
gifsdict[imgfile1] = img1
img2 = PhotoImage(file = imgfile2)
gifsdict[imgfile2] = img2
img3 = PhotoImage(file = imgfile3)
gifsdict[imgfile3] = img3
img4 = PhotoImage(file = imgfile4)
gifsdict[imgfile4] = img4
img5 = PhotoImage(file = imgfile5)
gifsdict[imgfile5] = img5
 
liste =[img1,img2,img3,img4,img5]
 
 
 
# Boucle création nuages
 
for i in range(COUNT):
    index = randint(0,4)
    g = liste[index]
    y = randint(0,600)
    nuage = canvas.create_image(1200,y,anchor=NE,image=g)
    nuages.append(nuage)
 
def positionavion():
    canvas.bbox(cadreavion)
    return cadreavion
 
def collision():
    global x1,y1,x2,y2
    if len(canvas.find_overlapping(x1,y1,x2,y2))>1:
        print("coordonnées collision:",x1,y1,x2,y2)     
 
def cancel_delayed(nuage):
    nuages_differe.remove(nuage)
    nuages.append(nuage)
 
def nuages_move(delay=50):
 
    for nuage in nuages[:]:
 
        if canvas.coords(nuage)[0]<=0:
            nuages.remove(nuage)
            nuages_differe.append(nuage)
            y = randint(0,600)
            canvas.coords(nuage,randint(1550,2300),y)
            canvas.after(500, lambda nuage=nuage: cancel_delayed(nuage))
 
        else:
            canvas.move(nuage, -20, 0)
            canvas.coords(cadreavion)
            collision()
 
    canvas.after(delay, nuages_move)
 
 
 
#creation de l'avion
aviongrand=PhotoImage(file='avion29.gif')
 
#reduction de l'image initiale par 2:
avion = aviongrand.subsample(2, 2)
cadreavion = canvas.create_image(20,20,anchor=NW,image=avion)
 
#détermination des coordonnées de l'avion                                          
coordavion = canvas.bbox(cadreavion)
x1 = coordavion[0]
y1 = coordavion[1]                                          
x2 = coordavion[2]
y2 = coordavion[3]
 
#fonctions de déplacement de l'avion
 
def haut(event):
    if canvas.coords(cadreavion)[1]<=0:
        canvas.move(cadreavion,0,0)
 
    else:
        canvas.move(cadreavion,0,-15)
 
        print(canvas.coords(cadreavion))
 
def bas(event):
    if canvas.coords(cadreavion)[1]>=500:
        canvas.move(cadreavion,0,0)
 
    else:
        canvas.move(cadreavion,0,15)
 
        print(canvas.coords(cadreavion))
 
 
canvas.focus_set()
 
canvas.bind('<Up>',haut)
canvas.bind('<Down>',bas)
 
 
nuages_move()
updateTime()
canvas.mainloop()

[wiztricks]

Salut,

des variables x1,y1,x2,y2 au moment de la collision et en effet ces dernières sont toujours aux mêmes valeurs. comment les actualiser ?

Il suffit de récupérer leurs valeurs via x1, y1, x2, y2 = canvas.bbox(cadreavion)....

pour mieux comprendre ce qui se passe j' affiche les coordonnées de canvas.coords(cadreavion) qui lorsque je bouge l'avion prennent en compte le déplacement

En voulant directement travailler sur vos images, vous ne faites qu'ajouter un niveau de difficulté et de la confusion entre la position de l'image et le rectangle qu'elle occupe (et qui vous intéresse côté collision).

- W

[mika34770]

je vous remercie pour votre aide au niveau du programme et de votre clairvoyance sur ma confusion certaine entre l'image et le rectangle qu'elle occupe.
je retravaille tout cela de suite
Bien cordialement.

[mika34770]

Grace à vous cela fonctionne très bien désormais et avec tous les nuages.
je vous en remercie infiniment.

j'ai reconsidéré ma fonction ainsi :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
def collision():
    x1, y1, x2, y2 = canvas.bbox(cadreavion)
    if len(canvas.find_overlapping(x1,y1,x2,y2))>1:
        print("Nuage touché !")
        print(x1,y1,x2,y2)# pour voir les coordonnées mise à jour

Votre éclairage sur ma confusion entre l'image et son rectangle m'a donné l'idée de réduire le rectangle par rapport à mes images pour rendre la collision plus précise. je pense que cela doit être possible ..enfin je l'espère

[mika34770]

Bonsoir dans votre fonction nuages_move j'ai du mal a comprendre la fonction lambda qui je sais est une fonction anonyme et qui pourrait être remplacée par une fonction de type def.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

canvas.after(500, lambda nuage=nuage: efface_différé(nuage))

cependant dans cette syntaxe je n'arrive pas à saisir le sens de la fonction et surtout a la retranscrire en fonction de type def.

Pouvez vous me l'expliquer dans cette syntaxe et me dire comment la remplacer ?

je vous remercie par avance.

Cordialement.

[wiztricks]

Salut,

Pouvez vous me l'expliquer dans cette syntaxe et me dire comment la remplacer ?

C'est une mauvaise habitude, .after n'en a pas besoin, et on peut écrire cela:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

canvas.after(500, efface_différé, nuage)

- W

[mika34770]

Ah oui ! la je comprend mieux
je vous remercie pour cette syntaxe plus abordable à mon niveau
pas de souci pour votre " mauvaise habitude" j'aimerai bien avoir votre niveau
bien cordialement.

[mika34770]

Avec tous mes remerciements pour votre aide précieuse, ça donne envie de faire de la programmation
je peux désormais fermer cette discussion et vous retrouver certainement dans une autre :p
Bien cordialement.