Share
Har du aldri sett de gamle spill- og watch-spillene hvor tegnene var enten på bakken eller i luften, uten overgang mellom dem? Det kan være en kul effekt når den brukes på riktig sted, men det ser stivt og rusk ut i de fleste spill. I denne Quick Tip, viser jeg forskjellen mellom Game & Watch-tilnærmingen og en mer realistisk (men likevel enkel) tilnærming som bruker en hopphastighet og tyngdekraft.
Merk: Selv om denne opplæringen er skrevet med JavaScript, bør du kunne bruke de samme teknikkene og konseptene i nesten hvilket som helst spillutviklingsmiljø. Også, stor takk til Kenney.nl for den kjempebra gratis plattformen sprites!
Den naive måten å nærme seg å lage et tegn hoppe ville være å bare sette tegnene y posisjon til en høyere koordinat, la den gå et sekund, og sett deretter tilbake til forrige verdi.
For eksempel:
var jumpSpeed = 1000; funksjonshopp () character.y - = 25; setTimeout (funksjon () character.y = characterGround; stage.update ();, jumpSpeed); funksjon gameloop () // Når spilleren trykker W: ring hoppefunksjonen hopp ();
Jeg har satt opp en demonstrasjon for å demonstrere denne tilnærmingen. Bruke W nøkkel for å gjøre tegn hoppe, og se og endre koden på jsFiddle:
Dette ser ut til å virke ganske bra. Vi kan endre jumpSpeed variabel for å få karakteren til å hoppe raskere eller langsommere.
Men når vi bestemmer oss for å legge til bevegelse til vår karakter, ser vi at dette blir et problem. Se demonstrasjonen nedenfor (bruk W å hoppe, EN og D å flytte til venstre og høyre, og se og endre koden på jsFiddle):
Jeg vet absolutt ikke om noen som hopper sånn. Vi trenger en måte å gjøre vår karakter gradvis "faller" tilbake til bakken. Ved å bruke gravitasjonsbegrepet kan vi bare oppnå det. (Et annet problem er at vår karakter kan hoppe mens den allerede er i luften, så vi får det også.)
Hvis vi ser på en formell gravitasjonsdefinisjon (Rull ned til jordens tyngdekraftseksjon), ser vi at et objekt som faller fritt nær jordens overflate, øker dens nedoverhastighet med 9,81 m / s (32,1740 ft / s eller 22 mph) hver andre at det faller.
Alt dette betyr at hastigheten som den faller øker over tid. Det akselererer med andre ord mot bakken.
For å oversette dette til noen arbeidskode, må vi legge til en y-hastighetsvariabel for vår karakter; hver ramme vil han bevege seg nedover med mengden av denne y-hastigheten. Når spillet først starter, vil karakterens y-hastighet være 0, siden han er på bakken. For å få ham til å hoppe, setter han sin y-hastighet til et negativt tall som driver ham inn i luften. Under hver ramme som han er luftbåren, vil vi legge til en innstilt verdi (som vi vil ringe tyngde) til sin hastighet, akselerere ham mot bakken når tiden går.
Nedenfor er hvordan koden kan fungere:
var yVel = 0; var tyngdekraften = 1,2; var isJumping = false; funksjon hopp () hvis (isJumping == false) yVel = -15; isJumping = true; funksjon gameloop () hvis (isJumping) yVel + = tyngdekraften; character.y + = yVel; hvis (character.y> characterGround) character.y = characterGround; yVel = 0; isJumping = false;
Vi satte oss først Yvel til 0, sett a tyngde variabel (som du kan endre for å få karakteren til å synke med en annen hastighet), og angi en isJumping variabel for å definere om han allerede hopper.
Hvis brukeren forsøker å hoppe mens den allerede er i luften, skjer ingenting; ellers setter vi Yvel til -15. (Endre denne verdien for å gjøre det første hoppet høyere eller lavere.)
Inne i gameloop (), Hvis tegnet hopper, legger vi til noe tyngdekraften til Yvel som gjør tegnet "fall" en viss mengde på hvert kryss i spillsløyfen. Hvis han treffer bakken, setter vi på isJumping tilbake til falsk slik at vi kan få ham til å hoppe igjen
Jeg har en annen demo du kan prøve ut, gaffel og tilpasse. Prøv å endre tyngde og Yvel verdier på jsFiddle, så du kan virkelig få en følelse av hvordan denne teknikken fungerer:
I denne korte opplæringen har du lært hvordan du får karakteren til å hoppe mer realistisk ved å inkorporere litt tyngdekraften. Jeg håper du har funnet denne opplæringen nyttig og takk for å lese!
Accentsconagua