Besoin d'éxécuter une boucle en même temps que le code

Fermé
meziane - 25 mars 2022 à 19:45
 Dondin - 26 mars 2022 à 10:04
Bonjour, dans mon code javascript, j'ai un besoin très précis, je dois exécuter une boucle mais en même temps pouvoir utiliser les évènements addEventListener etc..., je code un mini jeu dans lequel un cube se déplace grâce aux flèches du clavier dans un Canvas prévu et je voudrai avoir un boucle while qui s'exécute quand le jeu est actif mais ou je pourrais utiliser les évènements
voila le projet :
https://jsfiddle.net/MEZIANE002/rfwdkn19/
A voir également:

2 réponses

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
Modifié le 26 mars 2022 à 09:11
Bonjour,

Tu peux créer une boucle avec la fonction setInterval(), une meilleure solution serait de créer la boucle avec la fonction requestAnimationFrame().

Tu peux éventuellement suivre le tuto "Jeu de casse-briques 2D" sur le site mdn qui explique comment utiliser la fonction setInterval() puis qui montre comment la remplacer par requestAnimationFrame() :
https://developer.mozilla.org/fr/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript
0
Salut,
requestAnimationFrame est la meilleure solution pour ça comme déjà dit.
Il n'y a pas de rapport avec un détecteur d'événement et une boucle d'animation. Il faut que l'on puisse accéder aux données des éléments à dessiner.
function rectangle(name,x,y,w,h,color){
return {name,x:x,y:y,w:w,h:h,color:color}//-- objet notation JSON
}

function setPosition(obj,x,y){ obj.x=x;obj.y=y
}
function movePosition(obj,x,y){
 setPosition(obj, obj.x+x,obj.y+y)
}

function drawConsole(obj){ console.log(obj.name+' ('+obj.x+','+y+') couleur:'+obj.color ) }

let carreRouge = rectangle(20,20,30,30,'#f00')

drawConsole(carreRouge)
movePosition(carreRouge, 60, -50)
drawConsole(carreRouge)
0