Share
Astăzi vom construi un sabot controlat Wiimote folosind WiiFlash și Papervision3D. Scopul acestui tutorial va fi de a învăța cum să folosiți un wiimote în flash și cum să îl combinați cu papervision3D. Apoi, desigur, puteți folosi această aplicație pentru a vă pregăti pentru masteratul dvs. Jedi.
Primul pas este și cel mai simplu; descărcați pachetele de care avem nevoie. Accesați blog.papervision3d.org și wiiflash.bytearray.org pentru a descărca cea mai recentă versiune a ambelor pachete. Dezarhivați ambele pachete și plasați bibliotecile (un director numit "org") în directorul dvs. de lucru.
Deoarece acest proiect va fi scris în întregime în ActionScript 3.0, primul lucru pe care trebuie să-l facem este să creați un nou document Flash și să faceți o referință la clasa noastră principală: LightSaber. Salvați-l ca "lightsaber.fla" în directorul dvs. de lucru.
Apoi, creați o clasă goală numită "LightSaber". Aceasta va fi clasa principală în care totul se inițiază. Salvați-l ca "LightSaber.as" în directorul de lucru.
pachet public class LightSaber funcția publică LightSaber ()
Următoarea clasă pe care o vom crea se numește LightSaber3D și aceasta va conține toată logica 3D. Salvați-l ca "LightSaber3D.as" în directorul dvs. de lucru.
pachet public class LightSaber3D funcția publică LightSaber3D ()
Acum, că toate clasele și bibliotecile sunt în loc, putem începe să le completăm. Vom începe cu configurarea comunicației wiimote. Următorul cod este codul complet pentru clasa LightSaber; în etapele următoare vom discuta mai detaliat.
pachet import flash.display. *; import flash.events. *; import org.wiiflash.Wiimote; import org.wiiflash.events. *; import LightSaber3D; clasa publica LightSaber extinde Sprite private var wiimote: Wiimote; private var lightSaber3D: LightSaber3D; funcția publică LightSaber (): void stage.align = StageAlign.TOP_LEFT; stage.scaleMode = StageScaleMode.NO_SCALE; wiimote = nou Wiimote (); wiimote.addEventListener (eveniment.CONNECT, onWiimoteConnect); wiimote.connect (); funcția privată onWiimoteConnect (pEvent: Event): void lightSaber3D = nou LightSaber3D (); addChild (lightSaber3D) luminaSaber3D.buildLightSaber (); lightSaber3D.turnOffLightSaber (); wiimote.addEventListener (WiimoteEvent.UPDATE, updateWiimote); wiimote.addEventListener (ButtonEvent.B_PRESS, butonulPress); wiimote.addEventListener (ButtonEvent.B_RELEASE, butonulReleased); funcția privată updateWiimote (pEvent: WiimoteEvent): void lightSaber3D.updateLightSaber3D (wiimote.pitch); funcția privată buttonPressed (pEvent: ButtonEvent): void lightSaber3D.turnOnLightSaber (); funcția privată buttonReleased (pEvent: ButtonEvent): void lightSaber3D.turnOffLightSaber ();
import flash.display. *; import flash.events. *; import org.wiiflash.Wiimote; import org.wiiflash.events. *; import LightSaber3D;
Înainte de a putea face ceva cu wiimote în flash, va trebui să includem bibliotecile wiiflash în clasa noastră. Pentru acest proiect special vom avea nevoie de clasa principală WiiMote și evenimentele wiimote. De asemenea, includem clasa noastră LightSaber3D, dar aceasta va fi discutată mai târziu.
Înainte de a discuta despre ceea ce face de fapt codul și de ce avem nevoie de el, este foarte important să cunoaștem "conceptul general" din spatele acestei aplicații. Construim un sabie 3d, pe care o putem schimba folosind un wiimote și ca o caracteristică suplimentară vom putea să o pornim și oprit folosind butonul "B" de pe spatele wiimote.
Cum obținem toate acestea? Ei bine, am decis să o despart în două clase; unul care manipulează wiimote și unul care controlează toate aspectele 3D. Clasa wiimote primește datele de la wiimote și le transmite în clasa 3D. Acest lucru se realizează prin intermediul procesatorilor de evenimente din clasa wiimote.
funcția publică LightSaber (): void stage.align = StageAlign.TOP_LEFT; stage.scaleMode = StageScaleMode.NO_SCALE; wiimote = nou Wiimote (); wiimote.addEventListener (eveniment.CONNECT, onWiimoteConnect); wiimote.connect ();
Mai întâi, vom crea o nouă instanță a clasei wiimote și vom adăuga la acest obiect un ascultător de evenimente denumit "Event.CONNECT". Acest lucru se întâmplă deoarece dorim ca aplicația să ruleze numai atunci când există o conexiune cu un wiimote. Apoi, încercăm să ne conectăm la serverul wiimote. Dacă funcționează, evenimentul "CONNECT" va fi expediat și aplicația va începe.
Lucrările serverului wiimote vor fi explicate la sfârșitul acestui tutorial.
funcția privată peWiimoteConnect (pEvent: Event): void lightSaber3D = nou LightSaber3D (); addChild (lightSaber3D) luminaSaber3D.buildLightSaber (); lightSaber3D.turnOffLightSaber (); wiimote.addEventListener (WiimoteEvent.UPDATE, updateWiimote); wiimote.addEventListener (ButtonEvent.B_PRESS, butonulPress); wiimote.addEventListener (ButtonEvent.B_RELEASE, butonulReleased);
Dacă suntem conectați la serverul wiimote și este găsit un wiimote, această funcție va fi executată. Acesta va crea o nouă instanță a clasei lightsaber3D și o va adăuga la scenă. Apoi, vor fi numite câteva funcții interne, care vor crea un sabot 3D și îl vor activa. Următoarele 3 linii sunt mai importante pentru noi chiar acum. Ei adaugă 3 ascultători de evenimente pentru obiectul wiimote și acești ascultători vor transmite datele necesare clasei lightsaber3D.
Pentru mai multe informații despre evenimentele wiimote disponibile, aruncați o privire la API-ul wiiflash, este inclus în pachetul pe care l-ați descărcat mai devreme.
funcția privată updateWiimote (pEvent: WiimoteEvent): void lightSaber3D.updateLightSaber3D (wiimote.pitch); funcția privată buttonPressed (pEvent: ButtonEvent): void lightSaber3D.turnOnLightSaber (); funcția privată buttonReleased (pEvent: ButtonEvent): void lightSaber3D.turnOffLightSaber ();
Aceste trei funcții vor apela cele 3 funcții publice din interiorul clasei lightsaber3D. Este destul de simplă, atâta timp cât apăsați butonul "B" butonul de aprindere este pornit și dacă mutați wiimote, valoarea senzorului de pas este transferată la funcția care controlează deplasarea sabiei de lumină.
Prin ruperea acestor clase și prin utilizarea ascultătorilor de evenimente, va fi foarte ușor să reutilizați ambele clase în alte proiecte. Nu sunt dependenți unul de celălalt, astfel încât să puteți înlocui wiimote-ul cu o tastatură sau mouse normal fără a fi nevoie să modificați codul lightsaber3D. Prin urmare, puterea programării orientate obiect :-)
Deoarece toate comunicările wiimote sunt configurate, este timpul să începeți să faceți o programare 3D. Pentru aceasta folosim Papervision3D. Vom folosi o clasă pentru a configura un mediu 3D și pentru a construi o săgeată în ea. În mod normal, l-ați rupe în mai multe clase, dar din moment ce avem doar un bec cu lumină, nu este cu adevărat necesar să o faceți aici. Spunând că este o bucată de cod destul de mare, pentru a împiedica căderea browserului, puteți descărca fișierul LightSaber3D.as pentru vizualizare.
În primul rând, vom avea nevoie de clasele necesare din biblioteca papadion3D pentru a construi un mediu 3D. Acesta va consta într-un port de vizualizare, o scenă, o cameră foto și un motor de randare. Pentru mai multe detalii despre conceptul de programare 3D, aruncăm o privire la site-ul web al papervision3D.
Din moment ce sabia noastra se va compune din 2 cilindri cu un filtru cu incandescență atasat, avem nevoie doar de cele 3 clase menționate mai sus. Filtrul de strălucire pe care îl folosim face parte din biblioteca flash standard.
funcția publică LightSaber3D (): void viewport = new Viewport3D (600, 450, true); addChild (fereastra); renderer = new BasicRenderEngine (); scena = nou Scene3D (); camera = nou Camera3D ();
Acum, că avem toate clasele disponibile, este timpul să construim săbii de lumină - dar înainte de a putea face acest lucru avem nevoie de un mediu 3D. Vom crea un port de vizualizare, un fel de fereastră prin care ne uităm, o scenă în care ne plasăm obiectele, o cameră care acționează ca "ochiul" și, în final, motorul de randare care face totul.
Folosim constructorul pentru acest lucru, deoarece acesta este cel mai logic loc. După cum probabil vă amintiți de la Pasul 5, numim acest constructor atunci când există o conexiune cu serverul wiimote, exact la momentul când avem nevoie de ele.
funcția publică buildLightSaber (): void lsHolder = new DisplayObject3D (); var handleColor = ColorMaterial nou (0xCCCCCC); var bladeColor = ColorMaterial nou (0x99FF33, 0.6); // dați săgeții de lumină niște mâner de culoare = Cilindru nou (mânerColor, 16, 150, 8, 3, 16); lama = cilindru nou (bladeColor, 12, 500, 8, 3, 8);
Funcția buildLightSaber este cea care adaugă de fapt toate obiectele 3D pe scenă. Lămpile de lumină constau dintr-o lamă și un mâner, care sunt plasate într-un container. Lama și mânerul sunt cilindri simpli, cu un material colorat pe suprafață. Observați că lama este ușor transparentă prin adăugarea unui parametru suplimentar la constructorul de materiale color.
blade.useOwnContainer = adevărat; blade.filters = [nou GlowFilter (0x66FF33)];
Lama are un filtru de lumină foarte simplu atașat la ea, astfel încât va avea acel lumină veritabilă strălucind în jurul acestuia. În acest moment, puteți înlocui materialul color cu un material bitmap pentru a adăuga niște texturi, dar aici vom folosi doar o culoare simplă.
// poziționați lama și mânerul handle.y = 0; blade.y = 325; lsHolder.addChild (mâner); lsHolder.addChild (lamă); // plasați suportul într-o anumită poziție în centrul ecranului lsHolder.y = -200; scene.addChild (lsHolder);
Acum adăugăm ambele obiecte într-un container numit "lsHolder". Facem asta pentru că vrem un obiect pe care îl putem manipula. În cele din urmă, adăugăm containerul la scenă, astfel încât acesta să fie vizibil atunci când facem totul.
// acum mutați aparatul foto puțin spre dreapta pentru un unghi bun pe camera de lumină camera.x = -200; // ... dar inca mai trebuie sa se uite la aparatul de fotografiat cu lumini. ViewAt (lsHolder);
Ca ultim pas, mișcăm camera la 200 de pixeli spre stânga, așa că avem un unghi mic pe sabia de lumină. Acest lucru este pur și simplu făcut pentru a face ceea ce facem mai vizibil. Bineînțeles, trebuie să-i spunem camerei unde să se uite, deci asta facem în ultimul rând.
// redați acum scena astfel încât să vedem de fapt, săgeata de lumină renderer.renderScene (scena, camera, fereastra de vizualizare);
Ultima linie a funcției buildLightSaber este foarte importantă și necesită o atenție deosebită. Orice programați în 3D va fi invizibil până când îl veți reda, deci asta facem aici.
Mai devreme am decis ca dorim ca sabia sa fie activa numai atunci cand apasati butonul "B" de pe spatele wiimote. Prin urmare, am adăugat doi ascultători de evenimente, unul care este expediat când butonul "B" este apăsat - și altul când butonul "B" este eliberat. Următoarele două funcții vor fi invocate la acele evenimente.
funcția publică turnOnLightSaber (): void blade.visible = true; funcția publică turnOffLightSaber (): void blade.visible = false;
Pentru a crea un efect de pornire / oprire pentru sabia noastră, facem ca lama să fie vizibilă sau invizibilă. Cu un efort suplimentar puteți adăuga o rutină care face ca lama să crească și să se micșoreze, dar asta nu este necesar pentru acest tutorial.
funcția publică updateLightSaber3D (pitch: Number) // calculați diferența de grade ale pitch var newPitch: Number = 90 + Math.round (pitch * (180 / Math.PI) - lsHolder.rotationX); // aplicați-l lsHolder.pitch (newPitch); // și să o facă. renderer.renderScene (scena, camera, fereastra de vizualizare);
Aceasta este funcția în care se întâmplă magia. De fiecare dată când wiimote trimite date către aplicația noastră, această funcție va fi invocată. Pentru aplicația noastră mică avem nevoie doar de valoarea senzorului de pitch, astfel încât acesta este trecut ca parametru pentru această funcție. După cum sa explicat mai devreme, ar trebui să fie ușor să înlocuiți wiimote cu un mouse sau tastatură fără a fi nevoie să modificați acest cod.
var newPitch: Numărul = 90 + Math.round (pas * (180 / Math.PI) - lsHolder.rotationX);
Valoarea pitch a lui wiimote va fi dată în radiani, dar funcția pitch a papervision3D așteaptă grade, deci trebuie să facem niște calcule. Deoarece funcția pitch utilizează un unghi relativ trebuie să scăpăm unghiul curent de valoarea senzorului de pas. În caz contrar, lămpile de lumină s-ar stinge de sub control.
// aplicați-l lsHolder.pitch (newPitch); // și să o facă. renderer.renderScene (scena, camera, fereastra de vizualizare);
După ce am plasat containerul la noua sa valoare, trebuie să redăm scena din nou.
Și am terminat! Având doar 151 de linii de cod, am creat un program de instruire Jedi Jedi! Deși nu înainte de a-l exporta, bineînțeles. Pentru a obține cea mai bună performanță, ar trebui să o executăm ca proiector autonom. Accesați setările de publicare, atingeți casetele proiectorului și utilizați setările indicate mai jos.
Acum publicați-o și ați terminat.
Nu destul de ... Înainte de a putea rula această aplicație trebuie să pornim serverul wiiflash și să conectăm wiimote la acesta. Acest lucru ar trebui să fie foarte simplu. Rulați serverul (îl veți găsi în pachetul pe care l-ați descărcat în Pasul 1) și apăsați butoanele 1 + 2 pe wiimote.
O notă rapidă privind construirea de aplicații și jocuri care utilizează wiimote. Datele senzorilor pe care le primiți de la wiimote nu sunt extrem de precise. Veți observa că în aplicația pe care tocmai am construit-o. De aceea majoritatea jocurilor pe care le veți găsi pe Wii se bazează pe recunoașterea mișcării. Acest lucru înseamnă că sistemul (în acest caz Wii) recunoaște o anumită mișcare făcută cu un wiimote și îi atașează o anumită acțiune (vizuală). De exemplu, dacă faceți o mișcare care seamănă cu o minge de tenis, Wii vă va calcula viteza și direcția, având în vedere datele senzorilor și o va traduce într-o animație fluentă 3D. Calculele implicate în aceste rutine sunt foarte complexe și, prin urmare, nu sunt incluse în acest tutorial.
Fie ca forța să fie cu tine…
Accentsconagua