Comment sauter et courir sur les plates-formes dans votre jeu de html5

La plate-forme "sauter et courir« genre a longtemps été un genre d'arcade de base pour une bonne raison. Il offre une belle expérience interactive pour votre jeu HTML5 et est relativement facile à modifier pour de nombreux types de jeux.

L'élément essentiel d'un jeu de plate-forme est - bien - plates-formes. L'action se produit généralement avec une vue de côté et un personnage de joueur qui répond à la gravité. Normalement, le joueur va sauter sur les plateformes et de combattre les ennemis par des tirs, sauter, ou le combat de mêlée.

Mon prototype présente les caractéristiques essentielles. Il comprend un caractère de joueur qui peut sauter et atterrir sur des plates-formes. Plates-formes déplaçables sont inclus afin que vous puissiez modifier la scène et de voir comment le personnage interagit avec diverses configurations de plate-forme.

Codes de saut et jeu de terres

La clé d'un jeu à défilement horizontal est le saut et l'atterrissage mécanicien. Utiliser un chute Propriété à suivre si le personnage doit répondre à la gravité ou non. Voici le code de la checkKeys () méthode qui lit la flèche vers le haut et fait sauter le personnage.

 si (keysDown [K_UP]) {if (this.falling == false) {this.setImage ("characterUp.jpg") - this.y - = 5 this.falling = true-this.addVector (0, 15) -} // fin si} else {checkFalling () -} // fin si

La checkFalling () fonction vérifie chacun des blocs. Si le personnage ne touche aucun des blocs, mis à tomber vrai. Cela rendra la chute de caractère une fois qu'il se déplace hors d'un bloc.

Comment venir en vue d'un atterrissage

L'interaction entre le personnage et les blocs est important parce que vous voulez le caractère à arrêter de bouger avant il frappe un bloc. Il faut pour cela une technique appelée détection de collision prédictive, qui sonne beaucoup plus compliquée qu'elle ne l'est. Voici le mécanisme:

1. Déplacer l'élément comme normale.

   
   
   
   
   

   Faire les calculs pour déplacer l'objet (dans ce cas le caractère) que la normale. Notez que le caractère est pas encore établi, mais de nouvelles valeurs x et y ont été déterminées en ajoutant dx et dy.

2. Vérifiez pour une collision.

   Vérifiez pour voir si le caractère est entré en collision avec quelque chose (dans ce cas, chaque bloc dans le tableau de blocs).

3. Si une collision se produit, sauvegarder le caractère.

   Vous vérification d'une collision, mais vous ne voulez pas le caractère à se chevaucher avec le bloc. Au lieu de cela, vous êtes intéressé à savoir si le vecteur de mouvement actuel serait provoquer une collision.

4. Soustraire dx de X, dy de y.

   Une collision a été détectée, de sorte que diminuer collision en soustrayant le vecteur de mouvement. Il en résulte l'image-objet étant son point de départ avant la collision a été détectée.

5. Réglez la vitesse du sprite à zéro.

   Réglez la vitesse du sprite à zéro si la trame suivante ne provoque pas le sprite de tomber en panne dans le bloc à nouveau.

La meilleure façon d'obtenir le comportement prédictif est d'ajouter une sauvegarde () Procédé pour la Lutin objet, qui peut être appelée sur tout type de collision:

 tCharacter.backup = function () {// Je chevauchant quelque chose que je ne devrais pas partager l'espace avec // retour à où je me trouvais avant la collision était detectedX = this.x - this.dx-Y = this.y - this.dy-this.setPosition (X, Y) -} // sauvegarde d'extrémité

Comment faire des blocs déplaçables

Ce jeu propose une autre caractéristique très intéressante: Chaque bloc peut être déplacé vers une nouvelle position de sorte que vous pouvez expérimenter avec d'autres placements de blocs. Il est relativement facile de prendre toute sprite à déplacer. Il suffit de vérifier pour voir si le bloc est actuellement cliqué. Si oui, définir sa position égale à la position de la souris:

 tBlock.checkDrag = function () {// permettra au bloc de se draggableif (this.isClicked ()) {this.setPosition (scene.getMouseX (), scene.getMouseY ()) -} // fin si} // fin checkDrag

Comment améliorer le jeu de plateforme

Le jeu de plate-forme est ouverte à de nombreux types d'améliorations:

• Utilisez plusieurs niveaux. Les blocs de défaut sont faciles à construire et travailler avec, mais ils ne sont pas très intéressant. Expérimentez avec différentes formes de blocs et les positions de construire des niveaux intéressants. Vous pouvez stocker les positions de blocs dans des tableaux pour faire de nouveaux niveaux, et tout simplement réutiliser les blocs.

• Envisager une approche basée sur la tuile. L'exemple de la plate-forme utilise un schéma arbitraire de placement de bloc, mais vous pouvez également utiliser une approche basée sur la tuile.

• Ajouter buts et ennemis. Une amélioration évidente à ce jeu serait d'inclure un objectif à atteindre avec un obstacle dans le chemin. Considérez comment vous pourriez mettre en œuvre les personnages ennemis. Vont-ils se déplacer? Vont-ils tirer? Ne manquez ajoutant des bonus pour améliorer la vitesse de saut, d'ajouter une arme à distance, ou tout ce que vous pouvez imaginer.

• Ajouter plus de puissance de feu. Ajouter une arme pour le caractère de sorte qu'il peut tirer. Dans changeurs secondaires, l'arme tire normalement horizontalement, mais vous pouvez jouer pour obtenir le comportement que vous voulez.

• Améliorer la physique. La dynamique de ce jeu fonctionne assez bien, mais vous pouvez les améliorer avec un peu plus de peaufinage. Suivez le schéma général du programme existant, mais de voir si vous pouvez le faire fonctionner exactement comme ce que vous voulez.