Share
I dag skal vi bygge en wiimote-kontrollert lightsaber ved hjelp av WiiFlash og Papervision3D. Målet med denne opplæringen er å lære å bruke en wiimote i flash og hvordan å kombinere den med papervision3D. Etterpå kan du selvfølgelig bruke denne appen til å trene for Jedi-mesterskapet.
Det første trinnet er også den enkleste; Last ned pakkene vi trenger. Gå til blog.papervision3d.org og wiiflash.bytearray.org for å laste ned den nyeste versjonen av begge pakkene. Unzip begge pakkene og plasser bibliotekene (en katalog som heter 'org') i arbeidskatalogen.
Siden dette prosjektet vil bli skrevet helt i ActionScript 3.0, må du først opprette et nytt Flash-dokument og referere til hovedklassen: LightSaber. Lagre det som "lightsaber.fla" i arbeidskatalogen.
Deretter oppretter du en tom klasse som heter "LightSaber". Dette blir hovedklassen der alt blir initialisert. Lagre det som "LightSaber.as" i arbeidskatalogen.
pakke offentlig klasse LightSaber offentlig funksjon LightSaber ()
Den neste klassen vi skal lage heter LightSaber3D, og denne vil inneholde all 3D-logikken. Lagre det som 'LightSaber3D.as' i arbeidskatalogen.
pakke offentlig klasse LightSaber3D offentlig funksjon LightSaber3D ()
Nå som alle klassene og bibliotekene er på plass, kan vi begynne å fylle dem. Vi starter med å sette opp wiimote-kommunikasjonen. Følgende kode er den komplette koden for LightSaber-klassen; I de følgende trinnene vil vi diskutere det nærmere.
pakke import flash.display. *; importer flash.events. *; importere org.wiiflash.Wiimote; importer org.wiiflash.events. *; importer LightSaber3D; offentlig klasse LightSaber utvider Sprite private var wiimote: Wiimote; privat var lightSaber3D: LightSaber3D; offentlig funksjon LightSaber (): void stage.align = StageAlign.TOP_LEFT; stage.scaleMode = StageScaleMode.NO_SCALE; wiimote = ny Wiimote (); wiimote.addEventListener (Event.CONNECT, onWiimoteConnect); wiimote.connect (); privat funksjon onWiimoteConnect (pEvent: Event): void lightSaber3D = new LightSaber3D (); addChild (lightSaber3D) lightSaber3D.buildLightSaber (); lightSaber3D.turnOffLightSaber (); wiimote.addEventListener (WiimoteEvent.UPDATE, updateWiimote); wiimote.addEventListener (ButtonEvent.B_PRESS, buttonPressed); wiimote.addEventListener (ButtonEvent.B_RELEASE, buttonReleased); privat funksjon updateWiimote (pEvent: WiimoteEvent): void lightSaber3D.updateLightSaber3D (wiimote.pitch); privat funksjonsknappTrykk (pEvent: ButtonEvent): void lightSaber3D.turnOnLightSaber (); privat funksjonsknappReleased (pEvent: ButtonEvent): void lightSaber3D.turnOffLightSaber ();
importer flash.display. *; importer flash.events. *; importere org.wiiflash.Wiimote; importer org.wiiflash.events. *; importer LightSaber3D;
Før vi kan gjøre noe med wiimote innen flash, må vi inkludere wiiflash-bibliotekene i vår klasse. For dette spesielle prosjektet trenger vi den viktigste WiiMote-klassen og wiimote-hendelsene. Vi inkluderer også vår LightSaber3D-klasse, men det vil bli diskutert senere.
Før du diskuterer hva koden egentlig gjør, og hvorfor vi trenger det, er det veldig viktig å kjenne det "generelle konseptet" bak denne applikasjonen. Vi bygger en 3d lightaber som vi kan svinge rundt med en wiimote, og som en ekstra funksjon kan vi slå på og av med "B" -knappen på baksiden av Wiiimote.
Hvordan oppnår vi alt dette? Vel, jeg har bestemt meg for å bryte den opp i to klasser; en som håndterer wiimote og en som styrer alle 3D-aspektene. Wiimote-klassen mottar dataene fra wiimote og sender den videre til 3D-klassen. Dette gjøres gjennom hendelseshåndterere fra wiimote-klassen.
offentlig funksjon LightSaber (): void stage.align = StageAlign.TOP_LEFT; stage.scaleMode = StageScaleMode.NO_SCALE; wiimote = ny Wiimote (); wiimote.addEventListener (Event.CONNECT, onWiimoteConnect); wiimote.connect ();
Først oppretter vi en ny forekomst av wiimote-klassen og legger til en hendelselytter som heter "Event.CONNECT" til dette objektet. Dette gjøres fordi vi bare vil at programmet skal løpe når det er en forbindelse med en wiimote. Deretter prøver vi å koble til wiimote-serveren. Hvis det virker, sendes "CONNECT" -hendelsen, og programmet starter.
Funksjonene til wiimote-serveren vil bli forklart på slutten av denne opplæringen.
privat funksjon onWiimoteConnect (pEvent: Event): void lightSaber3D = new LightSaber3D (); addChild (lightSaber3D) lightSaber3D.buildLightSaber (); lightSaber3D.turnOffLightSaber (); wiimote.addEventListener (WiimoteEvent.UPDATE, updateWiimote); wiimote.addEventListener (ButtonEvent.B_PRESS, buttonPressed); wiimote.addEventListener (ButtonEvent.B_RELEASE, buttonReleased);
Hvis vi er koblet til wiimote-serveren og en wiimote er funnet, blir denne funksjonen utført. Det vil skape en ny forekomst av lightsaber3D-klassen og legge den til scenen. Deretter vil et par interne funksjoner bli kalt som vil skape en 3D-lysbar og slå den på "på". De neste 3 linjene er viktigere for oss akkurat nå. De legger til 3 hendelseslyttere til wiimote-objektet, og disse lytterne vil videresende de nødvendige dataene til lightsaber3D-klassen.
For mer informasjon om tilgjengelige wiimote-hendelser, ta en titt på wiiflash API, den er inkludert i pakken du lastet ned tidligere på.
privat funksjon updateWiimote (pEvent: WiimoteEvent): void lightSaber3D.updateLightSaber3D (wiimote.pitch); privat funksjonsknappTrykk (pEvent: ButtonEvent): void lightSaber3D.turnOnLightSaber (); privat funksjonsknappReleased (pEvent: ButtonEvent): void lightSaber3D.turnOffLightSaber ();
Disse 3 funksjonene kaller de 3 offentlige funksjonene i lightsaber3D-klassen. Det er ganske greit, så lenge du trykker på "B" -knappen, lyser lyseren på og hvis du flytter wiimote, blir verdien av toneføleren overført til funksjonen som styrer bevegelsen av lysbjelken.
Ved å bryte disse klassene opp og bruke hendelseslyttere, vil det være veldig enkelt å gjenbruke begge klassene i andre prosjekter. De er ikke avhengige av hverandre, slik at du kan erstatte wiimote med et normalt tastatur eller en mus uten å måtte justere noen av lightsaber3D-koden. Derfor er kraften i objektorientert programmering :-)
Siden all wiimote-kommunikasjon er satt opp, er det på tide å begynne å gjøre litt 3D-programmering. For dette bruker vi Papervision3D. Vi bruker en klasse for å sette opp et 3D-miljø og bygge vår lightsaber i den. Normalt vil du bryte det opp i flere klasser, men siden vi bare har en lightsaber, er det egentlig ikke nødvendig å gjøre det her. Å si at det er en ganske stor del av koden, for å forhindre at nettleseren faller over, kan du laste ned LightSaber3D.as-filen for visning.
Først trenger vi de nødvendige klassene fra papervsion3D-biblioteket for å bygge et 3D-miljø. Dette vil bestå av et visningsport, en scene, et kamera og en gjengivelsesmotor. For mer informasjon om begrepet 3d programmering, ta en titt på papervision3Ds nettsted.
Siden vår lightsaber vil bestå av 2 sylindere med et lite lysfilter festet til det, trenger vi bare de 3 ovennevnte klassene. Glødfilteret vi bruker er en del av standard flash-biblioteket.
offentlig funksjon LightSaber3D (): void viewport = new Viewport3D (600, 450, true); addChild (visningsfelt); renderer = ny BasicRenderEngine (); scene = ny Scene3D (); kamera = nytt kamera3D ();
Nå som vi har alle tilgjengelige klasser, er det på tide å bygge lightsaberen - men før vi kan gjøre det, trenger vi et 3D-miljø. Vi skal sette opp et visningsport, et vindu som vi ser ut, en scene der vi plasserer våre objekter, et kamera som fungerer som "øyet" og til slutt rendering-motoren som gjør alt.
Vi bruker konstruktøren til dette, siden det er det mest logiske stedet. Som du sikkert husker fra trinn 5, kaller vi denne konstruktøren når det er en forbindelse med wiimote-serveren, akkurat når vi trenger dem.
offentlig funksjon buildLightSaber (): void lsHolder = new DisplayObject3D (); var handleColor = nytt ColorMaterial (0xCCCCCC); var bladeColor = nytt ColorMaterial (0x99FF33, 0,6); // gi lightaber noen fargehåndtak = ny Cylinder (handleColor, 16, 150, 8, 3, 16); blad = ny sylinder (bladkolor, 12, 500, 8, 3, 8);
Funksjonen buildLightSaber er den som faktisk legger alle 3D-objektene til scenen. Lysbjelken består av et blad og håndtak som er plassert i en beholder. Blad og håndtak er enkle sylindere, med fargemateriale på overflaten. Legg merke til at bladet er gjort litt gjennomsiktig ved å legge til en ekstra parameter til fargematerialekonstruksjonen.
blad.useOwnContainer = true; blade.filters = [ny GlowFilter (0x66FF33)];
Bladet har et veldig enkelt glødelfilter festet til det, så det vil få den ekte lightaber gløden rundt den. På dette punktet kan du erstatte fargematerialet med bitmap-materiale for å legge til noen teksturer, men her bruker vi bare en enkel farge.
// plasser bladet og håndtaket håndtaket.y = 0; blad.y = 325; lsHolder.addChild (håndtak); lsHolder.addChild (blad); // plasser holderen litt i midten av skjermen lsHolder.y = -200; scene.addChild (lsHolder);
Nå legger vi begge objektene til en beholder kalt "lsHolder". Vi gjør dette fordi vi vil ha ett objekt som vi kan manipulere. Til slutt legger vi beholderen til scenen slik at den blir synlig når vi gjengir alt.
// flytt kameraet litt til høyre for en god vinkel på lightaber-kameraet.x = -200; // ... men det må fortsatt se på lightsaber-kameraet. Se på (lsHolder);
Som et siste skritt beveger vi kameraet 200 piksler til venstre, så vi har en liten vinkel på lysbjelken. Dette er bare gjort for å gjøre det vi gjør mer synlig. Selvfølgelig må vi også fortelle kameraet hvor du skal se, så det er det vi gjør i den siste linjen.
// nå gjengi scenen slik at vi faktisk kan se lightsaber renderer.renderScene (scene, kamera, visningsport);
Den siste linjen i buildLightSaber-funksjonen er svært viktig og trenger litt oppmerksomhet. Uansett hva du programmerer i 3D, vil være usynlig til du gjør det, så det er det vi gjør her.
Tidligere besluttet vi at lyslyset skulle være aktivt bare når "B" -knappen på baksiden av wiimote er trykket. Derfor har vi lagt til to hendelseslyttere, en som sendes når "B" -knappen trykkes - og en annen når "B" -knappen slippes. De to neste funksjonene vil bli påkalt på disse hendelsene.
offentlig funksjon turnOnLightSaber (): void blade.visible = true; offentlig funksjon turnOffLightSaber (): void blade.visible = false;
For å lage en på / av-effekt for vår lysbjelke gjør vi bare bladet synlig eller usynlig. Med litt ekstra innsats kan du legge til en rutine som gjør bladet vokse og krympe, men det er ikke nødvendig for denne opplæringen.
offentlig funksjon updateLightSaber3D (pitch: Number) // calcaulte forskjellen i grader av banen var newPitch: Number = 90 + Math.round (tonehøyde * (180 / Math.PI) - lsHolder.rotationX); // bruk det lsHolder.pitch (newPitch); // og gjengi det. renderer.renderScene (scene, kamera, visningsport);
Dette er funksjonen der magien skjer. Hver gang wiimote sender data til vår søknad, vil denne funksjonen bli påkalt. For vår lille applikasjon trenger vi bare verdien av tonehøysensoren, slik at den videreføres som en parameter til denne funksjonen. Som forklart før, bør det være enkelt å erstatte wiimote med en mus eller et tastatur uten å måtte endre denne koden.
var newPitch: Number = 90 + Math.round (tonehøyde * (180 / Math.PI) - lsHolder.rotationX);
Plassverdien til wiimote vil bli gitt i radianer, men pitch-funksjonen til papervision3D forventer grader, så vi må gjøre noen beregninger. Fordi tonefunksjonen bruker en relativ vinkel, må vi trekke den nåværende vinkelen fra verdien av tonehøyden. Ellers ville lightaberen snurre ut av kontroll.
// bruk det lsHolder.pitch (newPitch); // og gjengi det. renderer.renderScene (scene, kamera, visningsport);
Etter å ha kastet beholderen til sin nye verdi, må vi gjøre scenen igjen.
Og vi er ferdige! Med bare 151 kodelinjer har vi opprettet vårt eget Jedi lightsaber treningsprogram! Selv om vi ikke eksporterer det selvsagt. For å få best mulig ytelse, bør vi kjøre den som en frittstående projektor. Gå til publiseringsinnstillingene dine, trykk på projektorbokser og bruk innstillingene som vist nedenfor.
Publiser nå, og du er ferdig.
Ikke helt ... Før vi kan kjøre denne applikasjonen, må vi starte wiiflash-serveren og koble wiimote til den. Dette burde være veldig enkelt. Kjør serveren (du finner den i pakken du lastet ned i trinn 1) og trykker på knappene 1 + 2 på wiimote.
Et raskt notat om byggeprogrammer og spill som bruker wiimote. Sensordataene du mottar fra wiimote er ikke ekstremt nøyaktige. Du vil legge merke til det i programmet vi nettopp har bygget. Derfor er de fleste spillene du finner på Wii, basert på bevegelsesgjenkjenning. Dette betyr at systemet (i dette tilfellet Wii) gjenkjenner en bestemt bevegelse laget med en Wiiote og legger til en viss (visuell) handling for den. For eksempel, hvis du lager bevegelse som ligner på en tennisball, beregner Wii din hastighet og retning gitt sensordataene og oversetter det til en flytende 3d animasjon. Beregningene som er involvert i disse rutinene er svært komplekse og er derfor ikke inkludert i denne opplæringen.
Må kraften være med deg…
Accentsconagua