Video: Slik legger du furugulv 2024
Fordi nettlesere er inkonsekvente i måten de rapporterer musens posisjon på, er musens innspilling i vanlig JavaScript vanskelig i HTML spillverden. SimpleGame-biblioteket håndterer dette ved å legge til getMouseX () og getMouseY () -metoder til Scene-objektet. Disse metodene er ikke alltid akkurat riktige, men de er nær nok til de fleste spillprogrammering.
Når du vil lese en vanlig mus, må du bare bruke Scene Object-objektets getMouseX () og getMouseY () -funksjoner for å bestemme den omtrentlige museposisjonen.
Det meste av tiden når du vil ha museposisjonen, skyldes at du skal flytte et objekt der musen er eller peker et objekt mot musen.
Ofte vil du gjemme musemarkøren, slik at du kan bruke Scene Object-objektets HideCursor () -metode for å skjule markøren. (Selvfølgelig kan du hente markøren med showCursor () -metoden.)
Hvis du vil lese en berøringsskjerm, er det enda et enkelt trinn. SimpleGame-biblioteket har et virtuelt joystick-objekt kalt Joy. Opprett en forekomst av denne klassen for å slå på lesingsfunksjonene på berøringsskjermen.
Merk at berøringsgrensesnittet til mobile enheter ikke er akkurat som musen, så det trenger et annet grensesnitt. Men når du har opprettet et Joy-objekt, vil getMouseX () og getMouseY () -funksjonene gjøre berøringsinndata, akkurat som en vanlig mus.
touchMouse. html skjuler den normale musepekeren og flytter en ball hvor musen peker. Dette bestemte eksemplet fungerer både med en tradisjonell nettleser og en berøringsskjerm.
SimpleGame-biblioteket forenkler arbeidet med musepekeren dramatisk ved å gi noen enkle metallsamtaler. Her er koden:
touchMouse. html var ball; var spill; var glede; funksjon init () {game = new Scene (); ball = ny Sprite (spill, "redBall. png", 25, 25); ball. setSpeed (0); spill. hideCursor (); glede = ny glede (); spill. start ();} // end init funksjon oppdatering () {spill. klar(); followMouse (); ball. oppdatering ();} // end oppdatering funksjon followMouse () { x = spill. getMouseX (); y = spill. getMouseY (); hvis (spill. Berørbar) { // flytt objektet litt høyere for berøringsskjermene y - = 100; } // berøringsskjermtest ball. settposisjon (x, y); }
Å få en sprite til å følge musen er bare et spørsmål om å vite hvilke metoder som skal ringes.
-
Skjul musepekeren.
Scene-objektet har en hideCursor () -metode.Dette er den enkleste måten å skjule den normale musepekeren på. Normalt, når du følger musen med et objekt, mener du at objektet skal fungere som den nye musepekeren, slik at du vil skjule den normale pilen.
-
Opprett en variabel for den virtuelle joysticken.
Hvis du skal jobbe med en pekefelt, må du ha en variabel som inneholder det virtuelle joystickobjektet. (Hvis dette spillet bare blir brukt på stasjonære maskiner med normale mus, trenger du ikke joystickobjektet.)
-
Initialiser joysticken.
Lag en forekomst av Joy-objektet i init () -funksjonen. Bare å opprette styrespaken vil fortelle motoren å forvente berøringsinngang og kartlegge den til normale musekommandoer.
-
Legg til en followMouse () -funksjon.
Det er generelt godt å lage en ny funksjon for å håndtere innspill. FølgMouse () -funksjonen vil fortelle objektet å følge musen. Selvfølgelig, hvis du bygger et objekt som følger musen, kan du gjøre dette til en metode for objektet hvis du foretrekker det.
-
Bruk getMouseX () og getMouseY () metoder.
Scene-objektet har metoder som kalles getMouseX () og getMouseY (). Bruk disse metodene for å få X- og Y-koordinatene til musen på scenen. Merk at koordinatene ikke alltid er nøyaktige.
-
Sjekk om du har en berøringsskjerm.
Sceneobjektet har en berørbar egenskap som er sant hvis nettleseren har en berøringsskjerm. Du vil ikke normalt at objektet skal skjules av fingeren, så ofte vil du kompensere for et objekt når du bruker en berøringsskjerm for input.
-
Flytt objektet høyere enn fingeren.
I et berøringsskjermmiljø vil du normalt at sprite fortsatt skal være synlig, så du vil ofte kompensere Y-aksen med litt beløp, slik at den ikke blir skjult av spillerens finger. Trekk litt verdi fra Y for å få denne effekten.
