V-ați văzut vreodată vechile jocuri Game & Watch unde personajele erau fie pe teren, fie în aer, fără tranziție între ele? Acesta poate fi un efect rece atunci când este folosit în locul potrivit, dar în majoritatea jocurilor arată rigid și înțepător. În acest sfat rapid, vă voi arăta diferența dintre abordarea Game & Watch și o abordare mai realistă (dar totuși simplă) care utilizează o viteză și o gravitate de salt.
Notă: Deși acest tutorial este scris folosind JavaScript, ar trebui să puteți utiliza aceleași tehnici și concepte în aproape orice mediu de dezvoltare a jocului. De asemenea, mulțumiri mari pentru Kenney.nl pentru spritele minunate de platformă gratuite!
Modul naiv de a aborda un salt de caractere ar fi să setați doar personajele y
poziția la o coordonată superioară, lăsați-o pentru o secundă și apoi readuceți-o la valoarea anterioară.
De exemplu:
var jumpSpeed = 1000; funcția salt () character.y - = 25; setTimeout (funcția () character.y = characterGround; stage.update ();, jumpSpeed); funcția gameloop () // Când jucătorul apasă W: apela saltul funcției salt ();
Am creat un demo pentru a demonstra această abordare. Folosește W pentru a face saltul de caractere și pentru a vizualiza și modifica codul pe jsFiddle:
Acest lucru pare să funcționeze destul de bine. Putem schimba jumpSpeed
pentru a face saltul caracterului mai rapid sau mai lent.
Totuși, atunci când ne hotărâm să adăugăm o mișcare personajului nostru, vedem că aceasta devine o problemă. Vedeți demo-ul de mai jos (utilizați W a sari, A și D pentru a vă deplasa la stânga și la dreapta și pentru a vizualiza și modifica codul pe jsFiddle):
Cu siguranță nu știu pe nimeni care sărută așa. Avem nevoie de o modalitate de a face ca personajul nostru să "cadă" treptat la pământ. Folosind noțiunea de gravitate, putem face asta. (O altă problemă este că personajul nostru poate să sară în timp ce este deja în aer, așa că vom rezolva și el acest lucru.)
Dacă ne uităm la o definiție formală a gravității (Derulați în jos până la secțiunea de gravitație a Pământului), putem vedea că un obiect care se încadrează liber în apropierea suprafeței Pământului crește viteza descendentă cu 9,81 m / s (32,1740 ft / s sau 22 mph) în al doilea rând că se încadrează.
Toate acestea înseamnă că viteza cu care se încadrează crește în timp. Cu alte cuvinte, accelerează spre sol.
Pentru a traduce acest lucru într-un cod de lucru, trebuie să adăugăm o variabilă y-velocity pentru caracterul nostru; în fiecare cadru, se va deplasa în jos cu valoarea acestei viteze y. Când jocul pornește primul, viteza y a caracterului va fi 0, deoarece el este la pământ. Pentru al face să sară, îi vom stabili viteza y la un număr negativ, lăsându-l în aer. În fiecare cadru pe care îl are în aer, vom adăuga o valoare stabilită (pe care o vom apela gravitatie
) vitezei sale, accelerându-l spre pământ în timp ce trece timpul.
Mai jos este modul în care codul ar putea funcționa:
var yVel = 0; var gravitatea = 1,2; var isJumping = false; funcția salt () if (isJumping == false) yVel = -15; isJumping = true; funcția gameloop () if (isJumping) yVel + = greutate; caracter.y + = yVel; dacă (character.y> characterGround) character.y = characterGround; yVel = 0; isJumping = false;
Am stabilit mai întâi Yvel
la 0, setați a gravitatie
variabilă (pe care o puteți schimba pentru a face ca personajul să coboare într-un ritm diferit) și setați un isJumping
variabilă pentru a stabili dacă el deja sărit.
Dacă utilizatorul încearcă să sară în timp ce se află deja în aer, nu se întâmplă nimic; altfel, am stabilit Yvel
la -15
. (Schimbați această valoare pentru a face saltul inițial mai mare sau mai mic.)
În interiorul gameloop ()
, dacă caracterul este sărituri, adăugăm ceva gravitate la Yvel
ceea ce face ca caracterul "să cadă" o anumită sumă pe fiecare bifă a buclei de joc. Dacă atinge pământul pe care l-am stabilit isJumping
înapoi la fals
așa că îl putem face să sară din nou
Am un alt demo pe care il puteti incerca, furculita si personaliza. Încercați să schimbați gravitatie
și Yvel
valori pe jsFiddle, astfel încât să puteți obține cu adevărat un simț pentru modul în care funcționează această tehnică:
În acest tutorial scurt ați învățat cum să faceți saltul personajului mai realist încorporând o anumită gravitate. Sper că ați găsit acest tutorial util și vă mulțumim pentru citire!