Aller au contenu

Cours 6

Ti chat

Assets

Indices

Pour le fond d'écran, utilisez simplement ce qu'on appelle un tileSprite.

Exemple
this.bg = this.add.tileSprite(0, 0, config.width, config.height, "bg");
this.bg.setOrigin(0, 0);

Pour l'animation de saut, vous devrez utiliser l'événement animationcomplete. C'est un peu le défi de l'exercice ;)

this.player.on("animationcomplete", (animation) => {
    if (animation.key === "---") {}
});

Résultat attendu

Consignes

  • Faites une copie de votre modèle de base
  • Ajoutez la notion de physique dans l'objet config
  • Charger correctement les 3 assets dans preload()
  • Dans create(), ajouter l'arrière plan (background)
  • Dans create(), ajouter les 4 plateformes. Voir la notion de refreshBody() dans un groupe static (cours5)
  • Dans create(), ajouter le joueur (le chat), puis ajuster sa zone de collision et sa taille
  • Dans create(), ajouter 4 animations : 'en attente', 'marche', 'saut' et 'chute'
  • Dans create(), ajoutez les controles pour le déplacement : A (gauche), D (droite) et ESPACE (saut)
  • Dans update(), appeler 3 fonctions : this.handleMovement(), this.handleAnimations() et this.handleDeath()
  • Dans la scène, ajouter les 3 nouvelles fonctions
  • Dans handleMovement(), faire la gestion du déplacement horizontal et celui du saut. N'oubliez la de faire un flipX du personnage pour que ce soit plus joli
  • Dans handleAnimations(), déterminez l'animation à jouer en fonction de la situation du personnage.
  • Dans handleDeath(), lorsque le personnage tomber dans le trou, il doit réapparaitre à son lieu de départ.