Learn Om Linear Kinematikk
Del
Del
Del
Del
Dette Cyber mandag Envato Tuts + kurs vil bli redusert å bare $ 3. Ikke gå glipp av.
Picturing animasjon i form av vektorer er intuitiv, men å forstå vektor matematikk er en smerte. I denne opplæringen håper jeg å lette at smerte og gi en løsning på animasjons problemer ved hjelp av en tilpasset skriftlig Vector2D klasse. Vi skal se på noen grunnleggende begreper om lineære kinematikk i Eulersk tilnærming: forskyvning, hastighet og akselerasjon. Deretter vil vi bygge en enkel applikasjon med det.
Endelig resultat Forhåndsvisning
La oss ta en titt på det endelige resultatet vi skal jobbe mot. Klikk på Flash panel nedenfor og kontrollere pilspiss ved å trykke på de fire retningstastene
Trinn 1:. Vector Antall
Alle vektor mengder har to komponenter:. Størrelse og retning
Trinn 2: Endring i Vector Antall
En endring i vektor mengder refererer til en av disse sakene:
Endre i retning
Endring i størrelsesorden
endring i både størrelse og retning
Trinn 3: Displacement som en Vector Antall
Displacement, hastighet og akselerasjon er vektor mengder. Definisjonene er som følger:
Displacement - Vektor av den korteste veien som peker fra opprinnelse til destinasjon. Jeg definerer opprinnelse som punkt (0, 0) og destinasjon som partikkelens plassering i forhold til dette punktet. I utgangspunktet refererer det til kartesisk koordinatsystem som gjennomføres av Flash
Velocity -.. Velocity er endringen av forskyvning over tid
Acceleration -. Akselerasjon er endringen av hastighet over tid
Animasjonen nedenfor viser forskyvning som vi kommer til å gjennomføre i Flash senere
Trinn 4:. Velocity som en Vector Antall
Velocity illustreres av animasjon nedenfor. Note hastighet er konstant, noe som betyr at akselerasjonen er fraværende i dette scenario. Hvis hastigheten er null, vil forskyvning forblir konstant gjennom
Trinn 5:. Akselerasjon som en Vector Antall
Akselerasjon er illustrert med animasjonen nedenfor. Merk: kinematikk innebærer konstant Nå som du har fått en kort forståelse av lineære kinematikk mengder og i stand til relatert dem til vektorer, kan vi begynne å bygge vår prosjektil klasse. Vi ønsker prosjektilet kunne fange opp alle disse mengdene:. Forskyvning, hastighet og akselerasjon - slik at det kan manipuleres på hver ramme Nedenfor er de dataene vi skal ta opp i vår Prosjektil klasse: Ved oppstart av dette Prosjektil klassen, skal vi initial de nevnte variabler og tegn . den grafiske representasjonen Følgende er accessors av våre private variabler - fortrenge, Velo, ACC - i prosjektilet klassen Ved forfriskende hver ramme, må vi oppdatere hastighet (ved hjelp av akselerasjon) og oppdatere forskyvning (ved hjelp av nevnte hastighet ). Dette kan oppnås ved hjelp av de følgende funksjoner. For en grundig forklaring på Vector tillegg besøker denne flotte innlegget fra Daniel Sidhon Vi må også oppdatere orientering av Sprite. Dette kan oppnås gjennom rotasjon tilhører Sprite Jeg har også implementert en Math2 statisk klasse, der har jeg skrevet en funksjon for enkelt å konvertere frem og tilbake fra vinkel enheter av grader og radianer Nå som vi har etablert vår prosjektil og Math2 klasse, vi kan begynne å kode vår hovedklassen. Vi trenger en Vector2D klasse også selv grundig forklaring ikke er inkludert på grunn av den nevnte artikkel om vektorer av Daniel Sidhon. Jeg antar at leserne forstår Vector2D klassen etter å ha lest den. Men hvis avklaringer er nødvendig, ikke be meg med dine spørsmål Først av alt, må vi vite private variabler av denne klassen Ved initialisering av Main, funksjonen init vil bli lansert. Denne funksjonen vil opprette et nytt prosjektil og sette starthastighet. Deretter vil lyttere til arrangementer tildeles Jeg har definert brukerkontroll som tastetrykk på Opp, Venstre, Ned og Venstre piltastene. Ved å trykke på og slippe disse nøklene, vil flagg variabler av Hoved (trinn 11) slås sant og usant. Basert på disse flaggene, vil Vector mengder manipuleres på hver ramme. Bemerk også jeg har delt kontroller i horisontale og vertikale aksen manipulatorer Ved oppdatering av hver ramme følgende kode vil bli henrettet. Det er lang, men ikke fortvil, bare les videre Oppdatering av bevegelse bør gjøres i følgende rekkefølge: Du kan finne at det er andre funksjoner med spor i mellom disse uthevede koder. Hva er de? Det ene er å bruke en annen vektor å bremse ned vår prosjektil som brukeren ikke trykker på noen taster. Dette er brukt før vi legger hastighet til vår forskyvning Den neste er å begrense vår prosjektil å alltid holde seg på scenen, ellers vil den fly ut av skjermen. Igjen er implementBound en funksjon jeg har inkludert i Math2 statisk klasse. Gitt en øvre grense, nedre grense og en tilfeldig verdi, vil implementBound returnere en verdi som er innenfor grensene. Etter at dette begrensninger på vår forskyvning (og bare etter det), oppdaterer vi Sprite posisjon med denne displacment verdi Før vi forlater denne sprite som det er, vi skal innrette det slik at det alltid peker i den posisjonen det er overskriften bruker funksjonen orient Nå er alt satt til å gå. Som du starte dette stykket ved å trykke på Ctrl + Enter, vil du se en pil som gradvis bremser ned som det hodet diagonalt nedover skjermen. Trykk på de fire retningstastene til å flytte pilen om. Ikke bekymre deg for å miste pilen; det vil bo inne visningen. Denne artikkelen skal få deg kjent med bruk av vektorer å animere bevegelse. Når du har forstått kinematikk, trenger fortsette å lese opp på mitt innlegg på dynamikk. La meg vite hvordan det går. Terima Kasih. Anmeldelser
akselerasjon. Hvis akselerasjon endringer over tid, faller den under temaet dynamikk
. Dynamikk er studiet av krefter som årsak til akselerasjon varierer over tid. En slik kraft er tyngdekraften, og jeg har skrevet et innlegg på animere at
Trinn 6:. Begynne å bygge et prosjektil
private Var fortrenge: Vector2D; private Var velo: Vector2D; private Var acc: Vector2D;
Trinn 7: Initial Prosjektil
offentlig funksjon prosjektil () {//tegne grafikk this.draw (); //init alle vektor mengder fortrenge = new Vector2D (this.x, this.y); velo = new Vector2D (0, 0); acc = new Vector2D (0, 0);} beskyttet funksjon draw (): void {//tegning pilspissen Var høyde: Number = 30; Var bredde: Number = 60; graphics.beginFill (0x0000FF); graphics.moveTo (0, 0); graphics.lineTo (bredde /-3, høyde /2); graphics.lineTo (bredde /2, 0); graphics.lineTo (bredde /-3, høyde /2); graphics.lineTo (0, 0); graphics.endFill ();}
Trinn 8:. accessors av Vector Mengder
offentlig funksjon setDisp (mag: Antall, vinkel: Number): void {displace.redefine (mag, vinkel);} offentlig funksjon getDisp (): Vector2D {return fortrenge;} offentlig funksjon setVelo (mag: Antall, vinkel: Number): void {velo.redefine (mag, vinkel);} offentlig funksjon getVelo (): Vector2D {return velo;} offentlig funksjon setAcc (mag: Antall, vinkel: Number): void {acc.redefine (mag, vinkel);} offentlig funksjon getAcc (): Vector2D {return acc}
Trinn 9: oppdateringsprogrammer av Vector Mengder
offentlig funksjon applyVelo (). Void {this.displace = this.displace.add (velo);} offentlig funksjon applyAcc (): void { this.velo = this.velo.add (acc);} //oppdatering sprite posisjon ved displacement.public funksjon animere (): void {this.x = this.displace.x; this.y = this.displace.y;}
Trinn 10: Updater for Sprite orientering
offentlig funksjon orient (). Void {this.rotation = Math2.degreeOf (velo.getAngle ());}
public static funksjon radianOf (gr: Number): Antall {return grader /180 * Math.PI;} public static. funksjon degreeOf (rad: Number): Antall {return rad /Math.PI * 180;}
Trinn 11: The Main Class
private Var b1: Prosjektil; //tastetrykk flagsprivate Var UP..: boolean = false; privat Var NED: Boolean = false; privat Var VENSTRE: Boolean = false; privat Var akkurat: Boolean = false;
Trinn 12: Initialiserer Hoved
privat funksjon init (e: Hendelses = null). Void {removeEventListener (Event.ADDED_TO_STAGE, init); //Inngangspunkt b1 = new prosjektil (); stage.addChild (b1); //sette utgangshastighet b1.setVelo (5, Math2.radianOf (30)); //sette hendelsen lyttere b1.addEventListener (Event.ENTER_FRAME, proj_enterFrame); stage.addEventListener (KeyboardEvent.KEY_DOWN, handle_keyDown); stage.addEventListener (KeyboardEvent.KEY_UP, handle_keyUp);}
Trinn 13: Tastatur tilstelninger Lyttere
privat funksjon handle_keyDown (e: KeyboardEvent): void {if (e.keyCode == Keyboard.UP) UP = true;. else if (e.keyCode == Keyboard.DOWN) NED = true; if (e.keyCode == Keyboard.LEFT) LEFT = true; else if (e.keyCode == Keyboard.RIGHT) RIGHT = true;} private funksjon handle_keyUp (e: KeyboardEvent): void {if (e.keyCode == Keyboard.UP) UP = false; else if (e.keyCode == Keyboard.DOWN) NED = false; if (e.keyCode == Keyboard.LEFT) LEFT = false; else if (e.keyCode == Keyboard.RIGHT) RIGHT = false;}
Trinn 14: enterframe tilstelninger Lyttere
privat funksjon proj_enterFrame (e: Hendelses): void {//definere akselerasjon Var accMag. Number = 0,1; if (UP) {b1.setAcc (accMag, Math2.radianOf (-90)); b1.applyAcc (); } Else if (NED) {b1.setAcc (accMag, Math2.radianOf (90)); b1.applyAcc (); } If (LEFT) {b1.setAcc (accMag, Math2.radianOf (180)); b1.applyAcc (); } Else if (HØYRE) {b1.setAcc (accMag, Math2.radianOf (0)); b1.applyAcc (); } //Bremse som nothng presses til å simulere friksjon. if (UP + NED + Venstre + høyre == 0) {var currentVeloMag. Number = b1.getVelo () getMagnitude (); Var currentVeloAng. Number = b1.getVelo () getAngle (); if (currentVeloMag > 1) {b1.setAcc (accMag * -1, currentVeloAng); b1.applyAcc (); }} B1.applyVelo (); //begrense sprite til grensene av scenen b1.getDisp () x = Math2.implementBound (0, stage.stageWidth, b1.getDisp () x.).; . b1.getDisp () y = Math2.implementBound (0, stage.stageHeight, b1.getDisp () y.); b1.animate (); b1.orient ();}
Trinn 15: Oppdatering Motion
Definer ny akselerasjon i henhold til brukerens tastetrykk.
Bruk av akselerasjon, oppdatere strømhastighet.
Ved hjelp av strømhastighet, oppdatere gjeldende fortrengning.
Spesifiser forskyvning å holde objektet innenfor grensene.
< p> Jeg har uthevet kodene for enkel identifisering av disse trinnene
privat funksjon proj_enterFrame (e: Hendelses): void {//definere akselerasjon Var accMag. Number = 0,1; if (UP) {b1.setAcc (accMag, Math2.radianOf (-90)); b1.applyAcc (); } Else if (NED) {b1.setAcc (accMag, Math2.radianOf (90)); b1.applyAcc (); } If (LEFT) {b1.setAcc (accMag, Math2.radianOf (180)); b1.applyAcc (); } Else if (HØYRE) {b1.setAcc (accMag, Math2.radianOf (0)); b1.applyAcc (); } //Bremse så ingenting er presset til å simulere friksjon. if (UP + NED + Venstre + høyre == 0) {var currentVeloMag. Number = b1.getVelo () getMagnitude (); Var currentVeloAng. Number = b1.getVelo () getAngle (); if (currentVeloMag > 1) {b1.setAcc (accMag * -1, currentVeloAng); b1.applyAcc (); }} B1.applyVelo (); //begrense sprite til grensene av scenen b1.getDisp () x = Math2.implementBound (0, stage.stageWidth, b1.getDisp () x.).; . b1.getDisp () y = Math2.implementBound (0, stage.stageHeight, b1.getDisp () y.); b1.animate (); b1.orient ();}
Trinn 16: nedbremsing Motion
//bremse som nothng presses til å simulere friction.if (UP + NED + Venstre + høyre == 0) {var currentVeloMag. Number = b1.getVelo (). getMagnitude (); Var currentVeloAng. Number = b1.getVelo () getAngle (); if (currentVeloMag > 1) {b1.setAcc (accMag * -1, currentVeloAng); b1.applyAcc (); }}
Trinn 17: Hold Inside
//begrense sprite til grensene til stageb1.getDisp () x = Math2.implementBound (0, stage.stageWidth, b1.getDisp () x.),... b1.getDisp () y = Math2 .implementBound (0, stage.stageHeight, b1.getDisp () y.);
Trinn 18: Orient Sprite
Trinn 19:.! Get Set og dra
Konklusjon