Share
Har du någonsin sett de gamla spel- och klockspel där karaktärer var antingen på marken eller i luften, utan övergång mellan dem? Det kan vara en cool effekt när den används på rätt ställe, men det ser stramt och ryckigt ut i de flesta spel. I den här snabba tipsen visar jag skillnaden mellan Game & Watch-tillvägagångssättet och ett mer realistiskt (men ändå enkelt) tillvägagångssätt som använder en hopphastighet och gravitation.
Notera: Även om denna handledning skrivs med JavaScript bör du kunna använda samma tekniker och begrepp i nästan vilken spelutvecklingsmiljö som helst. Också stort tack till Kenney.nl för den fantastiska gratis plattformsspelaren!
Det naiva sättet att närma sig att göra ett karaktärshopp skulle vara att bara ställa tecknen y placera till en högre koordinat, lämna den en sekund och sätt sedan tillbaka den till föregående värde.
Till exempel:
var jumpSpeed = 1000; funktion hopp () character.y - = 25; setTimeout (funktion () character.y = characterGround; stage.update ();, jumpSpeed); funktion gameloop () // När spelaren trycker på W: ring hoppa funktionen hoppa ();
Jag har satt upp en demonstration för att visa detta tillvägagångssätt. Använd W nyckeln för att göra teckenhoppet och visa och ändra koden på jsFiddle:
Detta verkar fungera ganska bra. Vi kan ändra jumpSpeed variabel för att få karaktären att hoppa snabbare eller långsammare.
Men när vi bestämmer oss för att lägga till rörelse för vår karaktär ser vi att detta blir ett problem. Se demo nedan (använd W att hoppa, en och D att flytta åt vänster och höger och visa och ändra koden på jsFiddle):
Jag vet verkligen inte om någon som hoppar så. Vi behöver ett sätt att få vår karaktär gradvis att "falla" tillbaka till marken. Genom att använda gravitationen kan vi bara uppnå det. (Ett annat problem är att vår karaktär kan hoppa redan i luften, så vi fixar det också.)
Om vi tittar på en formell definition av gravitationen (Bläddra ner till jordens gravitation) kan vi se att ett objekt som faller fritt nära jordens yta ökar sin nedåtgående hastighet med 9,81 m / s (32,1740 ft / s eller 22 mph) varje för det andra att det faller.
Allt detta innebär att den hastighet som den faller ökar över tiden. Med andra ord accelererar den till marken.
För att översätta detta till en viss arbetskod måste vi lägga till en y-hastighetsvariabel för vår karaktär; Varje ram kommer han att röra sig nedåt med mängden av denna y-hastighet. När spelet börjar börjar karaktärens y-hastighet vara 0, eftersom han är på marken. För att få honom att hoppa, ställer vi hans y-hastighet till ett negativt tal och driver honom i luften. Under varje ram som han är luftburna lägger vi till ett bestämt värde (som vi ringer till allvar) till sin hastighet, accelerera honom mot marken när tiden går.
Nedan är hur koden kan fungera:
var yVel = 0; var gravitation = 1,2; var isJumping = false; funktion hopp () om (isJumping == false) yVel = -15; isJumping = true; funktion gameloop () om (isJumping) yVel + = gravitation; character.y + = yVel; om (character.y> characterGround) character.y = characterGround; yVel = 0; isJumping = false;
Vi ställde in första gången Yvel till 0, sätt a allvar variabel (som du kan ändra för att få tecknet att sjunka i en annan takt) och ställa in en isJumping variabel för att bestämma om han redan hoppar.
Om användaren försöker hoppa medan han redan är i luften händer ingenting. annars bestämmer vi Yvel till -15. (Ändra det här värdet för att göra det ursprungliga hoppet högre eller lägre.)
Inuti gameloop (), om karaktären hoppar lägger vi till någon tyngdkraft till Yvel vilket gör tecknet "fall" en viss mängd på varje fäst i spelet loop. Om han träffar marken bestämmer vi isJumping tillbaka till falsk så vi kan få honom att hoppa igen
Jag har en annan demo du kan prova, gaffel och anpassa. Försök byta allvar och Yvel värden på jsFiddle, så du kan verkligen få en känsla för hur denna teknik fungerar:
I denna korta handledning har du lärt dig hur man gör din karaktär mer realistisk genom att införliva en viss gravitation. Jag hoppas att du har hittat denna handledning användbar och tack för läsningen!
Accentsconagua